WordPress,AFFINGER5に特化したカスタマイズ、トラブルシューティングの記事です。
基本、私の備忘録ですのであらゆるトラブルやカスタマイズを網羅するものではありませんが、よろしければぜひお役立て下さい。
尚この記事は常時更新しております。
質問頂けましたら記事に反映させて頂きますので、コメント欄よりお寄せ下さい。
▼ Contents
WordPress : ファビコンの設定
AFFINGR5からも設定できますが、デバイスやブラウザの種類によってはうまく反映されないことがあったので、こちらで設定されることをお勧めしています。
一番下の『サイトアイコン』がファビコンの設定です。
AFFINGER5 : メニュー表示
フッターメニューの途中改行を禁止するCSS
導入のメリット
｜プライバシーポ
リシー｜
のように主にスマホで発生するブサイクなフッターメニュー表示の崩れ解消
↓コピペでOK (￣▽￣)
/* フッターメニュー途中改行禁止 */
footer .footermenust li {
display: inline-flex;
display: -webkit-inline-flex;
flex-wrap: wrap;
-webkit-justify-content: center;
justify-content: center;
}
AFFINGER5：スマホ表示のカスタマイズ
スマホ左上のハンバーガーメニューをスクロール追尾させる
導入のメリット- 表示部分を圧迫するスマホ用ホフッターメニューを使用しない
- 長い記事の真ん中あたりでユーザーがトップスクロールせずに済む
(￣▽￣)
スクロールしてからちょいと戻すとハンバーガーメニューが左上に現れるようになります。
step
1スライドメニューボタン背景色：お好みで
step
2スライドメニューアイコン色：#ffffff（白）またはお好みで
step
3「スライドメニューバー背景色」と「グラデーション」：#RRGGBB（クリア）に設定しないとヘッダごと追尾表示されてしまうので注意！
step
4 表示パターン：スクロール追尾のチェック
step
5公開ボタン
トラブル：SSL接続が外れる
これは実際に私が数日間苦しんだ記録でもあります笑
メンターにも助けて頂いてめでたく解消した記念に記しておきます。
特定のページでSSL接続できない
特定のページでSSLがいつの間にか外れている場合、表示されているページにhttp:のリンクが入っています。
ブラウザのコンソールでhttp:になっているリンクを特定してローカルファイルのリンク先や外部リンクを全てhttps:に書き換えれば解決します。
Firefoxのコンソールではエラーが表示されたリンクそのものをブロック出来るので、修正する前にFirefoxでエラー箇所をブロックしてSSL接続が正しく行われることをシミュレーションして確認すると良いでしょう。
サイト全体でSSL接続出来ない
サイト全体でSSL接続が出来ない場合はテーマそのものに異常が起きている事が考えられます。
これを確認するには、テーマを一時的に別のものに変更してみましょう。
アドレスバーの先頭に正しく南京錠マークが表示されていればテーマそのものに問題が起きていると断定出来ます。
もしこの時点で解決しない場合はプラグインの問題も考えられますので、プラグインを一度全部無効にしてから一つづつ戻してみてください。
理屈としてはブラウザのコンソールでhttp:になっているリンクを特定してローカルファイルのリンク先や外部リンクを全てhttps:に書き換えれば解決しますが、
AFFINGERのテンプレートで背景画像などに指定されているリンク先が外部のサーバーになっている場合、ファイルをローカルに展開してリンクし直すかリンクそのもを削除しなくてはなりません。
配色は崩れてしまいますが、テンプレをただ再現するだけの事に手間を取られるのも馬鹿らしいので
の一番下
・・・一撃でSSL接続が復活します。