WordPressサイトのデザインを司るテーマファイルの基本的な設定として、メニューの作成、デフォルト設定されるウィジェットの削除、画像ウィジェットの追加、カスタムメニューの作成、フロントページ表示の設定を行います。
[su_youtube url=”https://www.youtube.com/embed/l2o3f669blE”]
[su_button url=”https://www.wordpress358.com/html2wp-form” background=”#d87e04″ icon=”icon: reply-all”]新しいWordPressバージョンの動画はこちら[/su_button]
「外観−テーマ」のページを表示する
それでは、テーマファイルを設定していきます。
テーマとは、WordPressのデザインを簡単に変更してくれるテンプレートのことです。
WordPressを使うメリットの1つが、このテーマによってデザインを簡単に変更できるというのがあります。
テーマは何種類もあって、それぞれ微妙に使い方が異なりますが基本は同じです。
今回は、WordPressに最初からインストールされているシンプルで使いやすい「Twenty Twelve」を使います。
他のテーマでも基本は同じですので応用ができると思います。
テーマについては、ネットで自由に検索してお気に入りを探してくる方法と、それに対して正攻法というか無難な方法として「外観ーテーマ」で新規追加とすると検索できるものから選ぶ方法があります。
これらを公式テーマといいますが、これら以外は使わない方がセキュリティ上安全であると言われています。
公式テーマについては、「wordpress公式テーマディレクトリ」というサイトがあるのでその中から選ぶといいと思います。
「Twenty Twelve」を使えるようにするために「有効化」をクリックしてください。
もうページを見られますので、どのように表示されているか確認してみます。
メニューを作成する
「外観−メニューを」開いて、グローバルが選ばれていることを確認します。
そして、”メニュー設定”のテーマの位置でメインメニューにチェックを入れて「メニューを保存」をクリックします。
これで、一度ホームページの方を見てみます。
メニューが配置されていることが分かります。
メディアに画像を追加する
サイドバーに表示する画像をメディアに追加しておきます。
「メディア−新規追加」でファイルを選択します。
こちらにドラッグしてもメディアを追加できます。
最初から入っているウィジェットを削除する
では、ウィジェットを追加していきますが、
ウィジェットというのは、主にサイドバーやフッターの部分に貼り付けられる部品のことです。
”外観−ウィジェット”を開きます。
初期段階で右側の”Sidebar”にいくつかウィジェットが入っていますがとりあえず削除します。
最初から入っているこれらのウィジェットは、ブログサイトを作ることを想定して入っているものがほとんどですのでとりあえず全部消しておきます。
削除の方法は、ウィジェットをドラッグして左側の利用できるウィジェットにドロップするだけです。
画像ウィジェット
今使っているテーマである「Twenty Twelve」には、”メインサイドバー”、”フロントページウィジェットエリア”が２つあり、都合３箇所のウィジェット配置箇所があります。
2つの”フロントページウィジェットエリア”は、
固定ページのテンプレートで”フロントページテンプレート”を使うと表示されますが、今回はすべてデフォルトテンプレートでページを作ります。
そのため、メインサイドバーだけを設定していきます。
既存サイトのように、サイドバーに画像を表示するために、”画像ウィジェット”を使います。
ウィジェットで「画像ウィジェット」を選んでサイドバーにドロップします。
まず、画像を選びます。
メディアライブラリにアップしておいた画像を選択して「ウィジェットに挿入」します。
タイトルとキャプションを既存サイトからコピーして貼り付けます。リンクは後で設定します。
また、サイズは挿入した画像によりますが、今回の画像はサイズが小さいのでフルサイズにします。配置は、中央にします。
ここで、いったん「保存」します。
リンク先の固定ページを一覧から選んで開きます。
パーマリンクをコピーします。
外観ウィジェットに戻って、先ほどの画像ウィジェットを開き、リンクのところに貼り付けます。
また、”詳しくはこちらから”の文字にもリンクをしたいので、htmlを打ち込みます。
以上で、画像の設定ができたので実際に見てみましょう。
このように画像が表示されて説明文があり、リンクも設定されています。
カスタムメニュー
次に、既存サイトのようにサイドバーにメニューを表示します。
あらかじめ”サイド”という名前で作ったメニューを表示します。
外観、ウィジェットで左から”カスタムメニュー”を選んでサイドバーにドラッグします。
タイトルも入力できますが、今回は既存サイトと同じにするために入力しません。
メニュー選択で、サイドを選びます。
「保存」します。
これでメニューの配置ができたので実際に見てみます。
このようにメニューが表示されているのが分かります。
フロントページの表示
先ほどからホームページを開くと表示がおかしいと思われていると思います。
「設定−表示設定」を開きます。
フロントページ、つまりホームページで最初に表示されるページについては”最新の投稿”になっています。
これは、ブログとして使う場合の設定ですので変更します。
固定ページを選んで、フロントページで、固定ページで作成したトップページに当たるホームを選びます。
「変更を保存」します。
これでもう一度ホームページを開いてみると先ほどの表示はきえているはずです。
まだ、固定ページの”ホーム”に何もコンテンツが入力されていないのでこうなっています。
