ブログを始めて丸１カ月。これからブログを始める人のために、私が苦心したことをメモしておきます。まるっきり文系頭のブログシロウト仲間向けの情報なので、達人は無視してください。
今回は、はてなブログで、どーやってもグローバルナビゲーションが設置できず、壁にぶつかった件です。ネットでいくら検索しても答えがみつからなかったので、誰かのヒントになるかもと記載することにしました。
グローバルナビゲーションは絶対に必要
ブログの記事数が増えてくると、グローバルナビゲーションが必要になってきます。グローバルナビゲーションとは、このブログでいう題字の下のカテゴリー分けみたいな部分です。
特に、記事のジャンルが雑多なブログは、設置していないと読者がとまどってしまいます。また、このブログでいえば、「香港」で検索してきた読者は、グローバルナビゲーションがあれば、「ほかの香港の記事も見てみよう」と思ってくれるかもしれません。
「アメリカの旅」のような専門分野のブログでも、いくつか記事を書いているうちに、「アメリカの食べ物」「アメリカの鉄道」「アメリカの景色」みたいな感じで、テーマが枝分かれしていくことに気付くと思います。
達人をマネても、グローバルナビが設置できない
私もさっそく、web知識の達人たちのブログを検索し、書かれていたコードを自分のブログに貼り付けてみました。まず、参考にさせていただいた達人ブログの一つはこちらです。
ここで紹介されているCSS MenuMaker | Drop Down Menu Generator は、追記されているようにすでに有料になっていますし、お金を払って試したとしても、あなたのブログには設置できない可能性があるので注意してください。
CSS MenuMakerをあきらめた私は、cssとHTMLをコピペ＆変更させていただき、設置を試みることにしました。
参考にさせていただいた達人ブログの一例はこちらです。
ところが、こんなに親切に書かれたブログ通りに作業をしても、グローバルナビゲーションを設置することはできませんでした。それはもう、いろんな達人のブログを検索し、慎重にcssを書き、貼り付け位置も確認しながらやってもダメでした。
「ナビの文字は表示されていても、機能はしない」とか、ブログのトップにコードがズラズラと表れて焦りまくる!!といったことを繰り返しました。
ほかのブログ作成者は、「ナビ設置できました!!」と大喜びしている様子なのに、なぜに私だけができないのか?
藁にもすがる思いで、はてなブログのサポートセンターにメールで助けを求めますが、「見た目のカスタマイズはサポート外」という、しごくまっとうな返信をいただいて終了。お手上げとなりました。
PC版にグローバルナビを設置できた解決方法
それでもあきらめきれずにもがいていると、ある記述を発見します。
「はてなブログ」⇒「テーマストア」の「Innocent」の作成者さまのブログに「はてなブログテーマ「Innocent」はナビゲーションバーを内蔵しています」という一節を発見したのです。
つまり、「選んだテーマによって、グローバルナビゲーションが設置できるものとできないものがあるのではないか」とひらめきました。
私がブログを始めたときに選んだテーマは「timeline-minimal」。そこから、手当たり次第にカスタマイズを繰り返したので、この仮説は正しくないかもしれませんが、
とにかく「timeline-minimal」で作ったブログを、「Innocent」に変更してみることにしました。すると、遂にグローバルナビゲーションを設置できたではありませんか!!
変更したテーマはこちら。
テーマの変更は、簡単にクリック一つでできます。
テーマストアから新しいテーマをダウンロードして入れ替えるだけでいいのです。ただ、元に戻せないので恐怖もあります。私の場合はもうイチかバチかでしたが、ダメージが少ない早い段階でナビを設置するのがいいと思います。
スマホにナビが設置できなかった解決方法
次に、スマホ版にもグローバルナビゲーションを設置しようと思いました。
参考にさせていただいた達人ブログの一例はこちらです
ところが、スマホ版への設置も全然うまくいきません。
スマホ版もこちらの達人ブログを参考に、楽しく全面的にカスタマイズしてあったので、そのせいかもしれませんがわかりません。(なにせ、ど素人ですから)。
そして、「スマホ」＋「グローバルナビ」で死ぬほど検索して試しましたが、どうにもなりませんでした。
そんなとき、一筋の光が、、、。「グローバルナビ」ではなく「トグルメニュー」を設置する、という案です。
これは、タイトル周辺に「三 MENU」をつけて、クリックするとカテゴリー一覧が表示されるタイプです。
これはなぜか設置できましたので、同じ現象で悩んでいる方はお試しください。
本当は、タイトル下に表示したかったのですが、ほかのコードとバッティングしているのか、上にしか表示できず。まぁ、いいか、、、。
お力をお借りしたのは、こちらの達人サイトです。
以上、私がおちいった「グローバルナビが設置できない」問題と解決にいたった方法でした。
参考にさせていただいた達人ブログには一切のまちがいはなく、すべての原因は私の知識不足にあることをお断りしておきます。
