回答 メニューの作り方(画像)

メニューボタンの作り方(0:00~3:24)

まず、素材を用意する必要があるから、「メニューボタン フリー素材」みたいなキーワードでぐぐって気に入ったボタンを探し出す。ちなみに動画で使用してるのは「取り放題COMさん」から借りてきた。

んで、このメニューボタンにイラストや画像をいれる場合、レイヤー機能が使えるソフトが必要になる。おれはフォトショップを使ってる。有料だけど「Photoshop Elements」ってのが安い。この程度の画像加工なら古いバージョンでも大丈夫。無料なら上の動画のGIMPってソフトがシェア率が多いようだから、たいがいわからないことがあったらぐぐればヒットするんじゃなかろうか。

TABLEの作り方(3:25~)

「TinyMCE Advanced」というワードプレスのプラグインをインストールすると、簡単にテーブルが作成できるようになる。
イントール後、ビジュアルモードから任意の列と行のテーブルを作成して、テーブル枠の中に上で作ったメニューボタンや画像のボタンを貼り付けていく→リンク先にページのURLを入れる。(完)

TinyMCE Advancedの使い方
TinyMCE Advanced の設定方法と使い方

SEO的によろしくない

ちなみにDIYのサイトのように個別のページにメニューを設置してしまうと、SEO的にもよろしくないうえPVが落ちてしまう。なので、上で作ったメニューボタンは、カスタムメニューを作成して、どこのページにも表示されるように、ワードプレスの上部かサイドメニューに表示させたほうがいいと思う。随分前に作ったページだが、下のページを参考にしてくれ!

コメント

  1. 大人とこどもの より:

    かんなさま
    こんなに丁寧親切に教えていただいてありがとうございます。
    見ていて、あまりの速さに魔法でもかけているんじゃないか?なんて思ってしまいます。
    とても勉強になります。カラムのカスタムメニューのやり方もすごくてびっくりします。

    本当にありがとうございます。
    フォトショップは家に歴代のソフトがあるのですが(私が使うわけではないのですが)、参照と絆創膏ツールと写真に名前を入れて並べるぐらいしか自分はやっていないので、こんな使い方があると思うととても驚きです。
    本当にありがとうございます。

    ゴミ○ズだなんてそんなことないですよ。
    前々から本当にネットの分からない私みたいな者には有意義な情報ばかりで。とても助かってて。

    は○なとか媚売り、意識高い系、自己啓発系とか、あんまり信用できないようなものが多い中、自分のスタイルでやっているのが本当にかっこいいなー。と、これからも応援しています。頑張ってください。

    本当にありがとうございます。

    • かんな より:

      いえいえ、前半マウスのカーソルを表示させてなくてすみません。(古いフォトショップのほうが使いやすいです)。
      TinyMCE Advancedは表を作るときにも便利なので、是非入れておきたいプラグインです。
      自分がサイトでしてることで何か分からないことがあればお気軽にお知らせください!
      ターゲットは悩みや疑問が発生したときに見えてきます。ではまた!

      • 大人とこどもの より:

        本当にありがとうございます。
        よつばと分からないのですが、イラストもとてもかわいいです。
        昔のダンボ―とのフィギュアのヘッダー画像も好きでした。

        これからもよろしくお願いします。

タイトルとURLをコピーしました