on良かったらフォローお願いします。】ライブドアブログにはデフォルトでは、メニューがない。Makerを紹介する。普通のブログやサイトでも利用できる。デザインが非常に豊富で、選ぶのに苦労するほどである。HTMLやCSSの知識がなくても、プレビューを見ながら簡単に作成できるので、是非とも活用して欲しい。知識のある人は、更にカスタマイズもでき自由度も高い。Makerにアクセスする。利用する場合、登録する必要があるように見えるが、実際は、必要ない。Up」ボタン(登録用ボタン)をクリックする。STARTED」をクリックする。メニューが用意されている。Down」「Flyout」「Horizontal」「Tabbed」「vertical」の中から利用したいタイプを決定する。Down」「Tabbed」から選ぶと良いだろう。「Vertical」と「Flyout」は縦長のメニューだ。サブカテゴリーを設定できるものとできないものがある。「Horizontal」のデザイン「Horizontal」からメニューを選択することとする。これだけの種類が用意されている。今回は、2枚目の画像からひとつメニューを選択した。選択したメニューをカスタマイズ選択したメニューをクリックする。すると次の画面が現れる。続けて、「Customize/Download」をクリックする。現れた画面でカスタマイズすることになる。以下の3つのパートに分かれている。各パートの説明Aパートここで、メニューに設置したい「テキスト」を設定する。上の空欄に設置したい「テキスト」を入れて、「+」をクリックすると、下に表示される。下に表示されている「テキスト」の横の「×」をクリックすると削除できる。Item」で編集できる。「title」で「テキスト」を訂正できる。「link」でリンクを設定する。Window」も用意されているので、新しいウィンドウで開きたいようなリンクはチェックを入れる。Bパートデフォルトでは、プレビュー画面が表示されており、変更を確認できる。その他に「html」「css」「Images」が用意されているが、特段確認する必要はない。Cパートプルダウンが表示され、メニューの全幅や、文字の色、大きさを指定できる。仕上がりひととおり、設定するとこんな感じでプレビューが表示される。よければ、「Download」をクリックする。CSSメニューの設置cssmenu.zipの解凍ダウンロードしたcssmenu.zipを解凍する。cssmenuフォルダを展開すると以下のようになっている。必要なファイル上記のうち必要なファイルは、menu_sourceフォルダの中のindex.htmlstyle.cssmenu_sourceフォルダ>imagesフォルダの中のbg.pngの3つ。画像ファイルだけそのまま使用するが、後は中身の一部をコピーして利用する。画像ファイルのライブドアブログサーバーへのアップロード「ライブドアブログ管理画面」>「画像/ファイル」>「ファイル管理」でフォルダ(任意の名前でいいが、例えば「CSSMENU」>「images」)を作成して、そのフォルダの中にbg.pngをアップロードする。ライブドアブログ管理画面でのファイルのアップロードについてわからない場合は、ライブドアサーバーへのアップロードを参考に確認しながら実行して欲しい。「CSSMENU」>「images」フォルダを作成し、その中にbg.pngをアップロードすると次のように表示される。HTMLへの記載index.htmlファイルの次の部分をコピーする。index.htmlファイルは直接使用するわけではないが、ブラウザーで表示したときに文字化けする場合は、文字コードを追加してやればよい。今回は、index.htmlファイルを直接使用するわけではないので、このままで構わない。コピーする箇所を抜き出したのが以下。これは、私の設定なので、実際には、「#」部分には実際のリンク先のURLがhttp://から記載されており、「トップページ」以下のテキストも実際に設定したものが記載されていると思う。この部分は後から、直接加筆訂正できる。href='#'><span>ライブドアブログのカスタマイズ</span></a></li></ul></div>この部分をライブドア管理画面>ブログ設定>デザイン/ブログパーツ設定>PC>デザイン設定>カスタマイズの「トップページ」、「個別記事ページ」、「カテゴリーアーカイブ」、「月別アーカイブ」の全て同じ場所にコピーする。コピーする場所は、各自使用しているテンプレートによって違うので、<body>より少し下の場所で色々試して欲しい。ちなみに私のテンプレートでは以下の場所。class="column">CSSへの記載style.cssファイルの中身を全てコピーする。追記がわかりやすいように、/*CSSメニュー*/を付け足している。url(http://48collect.publog.jp/cssmenu/images/bg.png)では各自の画像の保存場所(アップロードした場所)を指定すること。上では、私の画像の保存場所になっているので、注意。この部分をライブドア管理画面>ブログ設定>デザイン/ブログパーツ設定>PC>デザイン設定>カスタマイズ>CSSで、CSSの最後にコピーする。上で説明しているが、わかりやすいように、/*CSSメニュー*/みたいな表題を付けて、追記してやれば良い。出来上がり!以上スポンサーリンクレクタングル(大)広告もし良ければお願いします。良かったらフォローお願いします。jump-up関連記事Dropboxでデフォルトでは利用できない「publicフォルダ」を利用するには一部のブログなどでは、画像系ファイル以外アップロードできない。1ファイルのアップロード容量に制限があったりする。先日、ライブドアで画像中心に作成していたまとめブログがあまりに重いので、テンプレートを「ギャラリー」という画像を綺麗に見せるものから普通の2...記事を読むアイキャッチ画像に最適!デスクトップ・ノートパソコンやスマホ・タブレットへのはめ込み画像が簡単に作成出来るサービス一覧ブログのアイキャッチ画像には、フリー画像のPixabayなどを利用している人も多いと思う。今回は、いわゆるモックアップ(パソコンやスマホ...記事を読むWordPressや普通のホームページで縦書きが利用できる「涅槃」GoogleCodeが閉鎖されたためnehan3のスクリプトの置き場所が変わっている。PhotoFuniaブログのアイキャッチ画像に困ったときなどに無料で簡単に素敵な合成写真をオンラインで作成できるサイトを紹介する。紹介するのは、PhotoF...記事を読む一押しのRSSリーダーFeedlyのフォローボタンを設置しようあけましておめでとうございます。今年もよろしくお願いします。年末から年始にかけてたっぷりとブログの更新もお休みしていた。コメントをキャンセルメールアドレスが公開されることはありません。*サイト人気の記事まだデータがありません。Widget人気の記事まだデータがありません。Profileメインブログでは、WordPressやTwitterその他好きなことを記事にしています。そのほか2ちゃんまとめサイトやubuntuなどのブログもぽちぽちやってます。JUMP-UP.INFO。