WordPress設定の備忘録ブログ作成

WordPress設定の備忘録 1-サイトデザイン

WordPressの設定は、しばらく使わないと忘れてしまうことが多いため、備忘録としてまとめました。今回使用しているテーマは「Cocoon」です。

テーマの設定

サイト全体のデザインを決めるために、まずテーマを設定します。

設定手順

  1. WordPress管理画面から 「外観」 > 「テーマ」 を選択
  2. 好みのテーマを選択し、有効化

スキンの設定

スキンを変更するとブログの見た目が劇的に変わります

設定手順

  1. 「Cocoon設定」 > 「スキン」 タブを開く
  2. お好みのスキンを選択し、適用

サイトアイコンの設定

サイトアイコン(ファビコン)は、ブラウザのタブやブックマークバーに表示されるアイコンです。

設定手順

  1. 「外観」 > 「カスタマイズ」 > 「サイト基本情報」 > 「サイトアイコン」 を開く
  2. 画像をアップロードし、「公開」 をクリック

サイトタイトルの設定

サイトのタイトルを設定します。

設定手順:

  1. 「設定」 > 「一般」 > 「一般設定」 を開く
  2. サイトのタイトルを入力

投稿ページのアイキャッチ画像設定

アイキャッチ画像の表示・非表示を切り替えることができます。

設定手順:

  1. 「Cocoon設定」 > 「画像」 タブを開く
  2. 「アイキャッチの表示」の「本文上にアイキャッチを表示する」のチェックをオン/オフで切り替え

カテゴリーの並び順

カテゴリーの並び順は、以下の順番で表示されます。

  1. 記号
  2. 数字
  3. アルファベット
  4. カタカナ
  5. ひらがな
  6. 漢字

設定手順:

  1. 「投稿」 > 「カテゴリー」 を開く
  2. 必要なカテゴリーを追加・編集

お問い合わせフォームの設置

プラグイン「Contact Form 7」を使用しお問い合わせフォームを作成します。

①プラグインのインストール

  1. 「プラグイン」 > 「新規追加」 を開く
  2. 検索バーに「Contact Form 7」と入力
  3. 「今すぐインストール」 > 「有効化」

②コンタクトフォームの作成

  1. 「お問い合わせ」 > 「新規追加」 を開く
  2. フォームタイトルを入力し、フォームを作成
  3. 「メール」タブ で、受信先メールアドレスを設定

③お問い合わせフォームを固定ページに追加

  1. 「固定ページ」 > 「新規追加」 を開く
  2. タイトルを入力し、お問い合わせフォームをブロックに追加
  3. 「公開」 をクリック

④お問い合わせフォームをヘッダーメニューに追加

  1. 「外観」 > 「メニュー」 > 「メニューを編集」
  2. 「固定ページ」 > 「お問い合わせフォーム」 を選択し、メニューに追加
  3. メニューを保存

ウィジェットの設定

設定手順:

  1. 「外観」 > 「ウィジェット」 を開く
  2. 左側の「利用できるウィジェット」から、右側の「表示するエリア」にドラッグ&ドロップ

利用できるウィジェットの例:

  • プロフィール
  • カテゴリー
  • アーカイブ

表示できるエリア:

  • サイドバー: サイトのサイド部分
  • サイドバースクロール追従: スクロール時に追従するエリア
  • メインカラムスクロール追従: 本文部分(サイドバーが長い場合に追従)
外観 > ウィジェット

左側の利用できるウィジェットを右側の表示するエリアにドラッグドロップすると、ウィジェットがそのエリアに表示されます

パンくずリストの設定

パンくずリストとは、閲覧ページの階層を示すナビゲーションです。

パンくずリスト

投稿ページの設定:

  1. 「Cocoon設定」 > 「投稿」 > 「パンくずリスト設定」 を開く
  2. パンくずリストの表示位置を設定

固定ページの設定:

  1. 「Cocoon設定」 > 「固定ページ」 > 「パンくずリスト設定」 を開く
  2. 固定ページのパンくずリストの表示位置を設定
  3. 「変更をまとめて保存」

カテゴリー・タグアイコンの表示設定

カテゴリー・タグアイコンの表示設定を変更できます

カテゴリー・タグアイコン

設定手順:

  1. 「Cocoon設定」 > 「投稿ページ」 > 「カテゴリー・タグ表示設定」 を開く
  2. カテゴリー・タグアイコンの設定を変更
  3. 「変更をまとめて保存」

サイトのOGP画像を設定する

OGP画像とは、Webページのリンクを設定した時に表示される画像(Open Graph Protocol)です。

  1. 「Cocoon設定」 > 「OGP」 > 「ホームイメージ」 で画像選択する
  2. 「変更をまとめて保存」
ギムレットライフ|自分で確認したことを記述するブログです