アフィエイトブログという名のゲームでゴールを目指す日々、略して『A・F・Bの旅』。
今回は「レベル2:ブログ環境を整える」をお届けします。
ようやく普通にブログ更新ができるようになりましたが、ここに至るまでには、様々な迷走がありました。
「親テーマ」と「子テーマ」の違い。
ここで言うテーマというのは、「背景は白色で、文字の色は黒で、タイトルの文字の大きさは20pxで・・・」といった、ブログの全体的な見た目を整えるための《デザインまるごとセット》みたいなものですね。
まず「テーマ」を決めるためには、ダッシュボードの「外観」⇒「テーマ」の順に開いて、「新規追加」で好きなテーマを探すことから始まります。
いろ~んなデザインがあるので目移りしそうですが、私は、設定に困った時に解説してる人が多い、つまり情報を探しやすいという点でオススメされている『Cocoon』というテーマを選びました。
ここまでは良かったんですが。
テーマには「親テーマ」「子テーマ」があるんですよね~。
最初はほんとに(なんだこれ??)って思いました。
よ~~するに、親テーマというのはデザインの本体で素人はいじっちゃダメな奴。
そして子テーマのほうが個人の設定を登録していいほう。
親テーマがバージョンアップしても、子テーマのほうは勝手に更新されないので、自分で弄らないかぎり設定が消えないってわけですね。

私はこの仕組みを理解するまでに、時間がかかりました。
最初これの意味が分からなかったので、Cocoonって書いてあるものが2つあるなぁ・・・これどっちを使えばいいんだ?などと思って、Child(子テーマ)を消しちゃったり、どっちを有効化するのか悩んだりと、結構迷走しました。(;´∀`)
「外観」と「Cocoon設定」の違い。
ブログの外観を整えるために設定する場所が2つあります。
テーマを決める前は「外観」だけ。
自力でデザインを組む知識がある人は、ここからスタイルシート等を編集して、オリジナルのブログを構築しちゃうことができます。
しかし、私のようにその知識がない人は、テーマを決めたあとに表示される「Cocoon設定」の方から設定していきます。

こ~~~れが、また、ややこしいw
「Cocoon設定」では、デザインのスキン、ヘッダー&フッター、ボタン、本文、固定ページ、目次、カラム、ブログカードなど、さまざまな設定を行えます。
ただ、これはあくまでも、各パーツの表示・非表示とか、表示するならどのタイプにする?といった個別の設定をしやすくするためのメニュー群で、より細かい設定をしようとすると「外観」メニュー内にある「カスタマイズ」や「ウィジェット」「テーマエディター」などを使って、自分で機能を追加していく必要があるんです。
もう、これを理解するまでに何日掛かったことかw
いまだに(あれ、これの変更はどこからやればいいんだ?)と迷うので、当分の間は、ネットの情報を頼ることになりそうです。
ヘッダーをどう設定したらいい?
デザインを決める上で、一番悩んだのがヘッダーですね。
最初は黒い背景にしていたので、メインカラムからサイドバーまでの幅と同じ大きさのヘッダーロゴを作ったのですが、グローバルメニュー等とのバランスが悪くて断念。
次に、ロゴを何も入れず、タイトルテキストだけのシンプルなヘッダーにしたものの、あまりにも味気なさすぎてこれもボツ。
最終的に、サイトアイコンを作った際に(あ・・・これと文字を組み合わせたロゴにすればいいか)と思いつき、試行錯誤を繰り返していまのヘッダーに落ち着いたというわけです。
ただ、キャッチフレーズの文字が、ヘッダーロゴに微妙に被さってしまう問題がいまだ解決できず、苦悩しております・・・。
プラグインには何を導入すればいいの?
プラグインというのは、ブログの機能を追加するためのプログラムのことですね。
たとえばGoogleと連携するぜ!とか、SEO対策するよ!とか、カテゴリーの並べ替えをしやすくするよ!とか、目的に応じた使い勝手を良くしてくれるプラグインが山のようにあります。
何を導入すればいいのかさっぱり分からなかったので、ひとまずオススメされている最小限のプラグインを入れて、その後、ブログを書きながら(使い勝手が悪いなぁ)と思う問題点が生じるたびにそれを解決するプラグインを探す、というやり方で増やしていきましたね。
【参考にさせていただいた記事】

目次が表示をカッコよくしたい。
Cocoonにも「目次」を設定する場所はあるのですが、初期設定の段階では、まるで論文の記事のようなザ・シンプル!という感じ。その見た目をカッコよくするには、スタイルシートを編集するかプラグインを入れる必要があります。
わたしはスタイルシートをいじれる自信がないので、素直に「Easy Table of Contents」というプラグインを導入。
しかし、これまでブログの記事を書いてて「h1~h6」というタイトルの区別を意識したことが無かったので、どう書き分けすれば見やすいのだろうか、という点で悩みましたね。
あと、なぜか記事ごとで、プラグインで設定してるはずのデザインが反映しなかったり、目次の表示位置が可笑しかったりするのが、なかなか解決できず困りました。
【参考にさせていただいた記事】

カテゴリーを見やすくしたい。
何も設定しなかった時、カテゴリー表示はこうなってました。
しかしこれだと、カテゴリーの階層が区別し難いですよね。
そこで【ゆずゆろぐ。】というサイトが提供してくださっている、カスタマイズ用コードをお借りしてきて、スタイルシートにコピペ。
で、こうなりました。
親カテゴリーと、子カテゴリーがアイコンで区別されているので、この方が断然分かりやすくなりましたよね。
【参考にさせていただいた記事】

「カテゴリー」と「タグ」をどう区別するか。
カテゴリーを考えた時に「カテゴリー」と「タグ」の区別でも悩みました。
ようするに、自分の記事をどう分類するか、なのですが。
私のは雑記ブログなので、どうしても記事の分類が増えていくことになりますよね。
でも、たとえば同じ「スマホゲーム」でも、細かく分類していけば「パズル・育成・RPG・カード・コレクション」など多岐に渡るので、全部をカテゴリーにすると縦になが~~い表示になってこれまた見づらいものになります。
そこで大雑把に「スマホゲーム」をカテゴリーにして、その中の「パズル・育成・RPG」といったジャンルのほうをタグ付けして分けることにしました。
【参考にさせていただいた記事】

固定ページに何を設定すればいい?
固定ページって要るのかな?って思ったのが最初でした。
いままでのブログなら、たとえば「プロフィール」は1つの記事に書いて、それ自体をカテゴリーとしてサイドバーに表示するやり方をしてましたが、カテゴリーを編集するうちに、記事1つだけをカテゴリーとして扱うのは具合が悪いのだなと考えを改めさせられました。
ようするに《固定ページ》というのは、「会社概要」だとか、「プロフィール」「プライバシーポリシー」といった更新されないページ、サイトごとでとくに強調したいページを訪問しやすくするためのものなのですね。
ちょっと考えましたが、うちではひとまず、ホーム含めて4つだけ設定しておきましたw
使いにくい編集画面をカスタマイズする。
ブログの記事を書いてて困ったのが、編集画面の使いにくさでした。
どうやら編集画面にはブロックエディター (Gutenberg) や、クラシックエディター (TinyMCE)といったバージョン違いがあるらしく、カスタマイズをしないと使い勝手が悪いんですよね。
そのため、TinyMCE Advancedというプラグインを入れて機能を拡張しました。
このプラグインのエディター設定で、よく使うボタンを選んだり、表示位置を調整するなど、個人の使い勝手に合わせてカスタマイズできます。
ここまできて、ようやく、編集環境が整いました。
【参考にさせていただいた記事】

クエストLv.2 攻略完了!
というわけで、なんとかブログの環境を整えることができました。
普段ブログを使い慣れない方がこの記事を読むと、(うへぇ、面倒くさそう)って感じるだろうな~って思うのですがw
ただ既述どおり、問題解決のための方法を、その道の詳しい方々が記事として提供してくださっているので、大抵のことは調べれば解決出来るという点が心強いです。
まだまだ、様々な困難は待ち受けているのですが。
私も1つずつ勉強しながら、ブログを成長させて行こうと思います。
コメント