wordpressテーマ「GOLD BLOG」のインストールが済んだらまず行うべき設定箇所の解説をします。これをやらないとブログとして機能しないという重要な所のみ触れています。
インストール作業の済んだ時点からの解説となります。
- 1. 初めに手を付けるところ
- 2. 「一般」→「基本」<配色関連の設定>
- 3. 「一般」→「各種アカウント」<アクセス解析Google Analyticsの設定>
- 4. 「一般」→「公式SNSページURL」<各種SNSページURLの設定>
- 5. 「一般」→「アイキャッチ画像」<アイキャッチ画像の設定>
- 6. 「一般」→「ウィジェット機能」<ウィジェット部分の設定>
- 7. 「一般」→「カスタマイザー表示機能」<カスタマイザー部分の設定>
- 8. 「一般」→「着せ替え設定」<GOLD BLOGが提供するデモサイト選択の設定>
- 9. 「一般」→「ヘッダー・フッター自由入力」<ヘッダー・フッターに記述するコードの設定>
- 10. 「プリセット設定」
- 11. SEO設定
- 12. 高速化設定
- 13. 広告設定
- 14. ふきだし設定
初めに手を付けるところ
「GOLD BLOG」のインストールが済み、「テーマ利用 ID」も入力し終わったところから解説を始めます。
最初に手をつけるところは、「テーマ設定」メニューの中にある、「一般」・「プリセット設定」・「SEO設定」・「高速化設定」・「広告設定」・「吹き出し設定」の6つになります。
「一般」→「基本」<配色関連の設定>
ここでは見た目に大きく影響するカラーの設定をします。
「メインカラー」がブログのおおよそを締め、その補助として「サブカラー」が使われます。グラデーション表現はこの2つのカラーで設定されます。
「アクセントカラー」は使われる面積的には非常に少ないです。
「基本文字カラー」で文字色の一括設定ができます。
- テーマ利用IDの設定
- カラー設定
- 全体背景イメージ設定・・・背景画像の表示位置やリピート設定
- フォント設定・・・日本語フォントファミリー/日本語フォントファミリー/モバイルフォントサイズ/モバイルフォントサイズの設定
- 記事一覧ラベル設定・・・新着ラベルの表示日数設定
- 記事一覧除外設定・・・記事一覧から除外したい記事の設定
「一般」→「各種アカウント」<アクセス解析Google Analyticsの設定>
「GA4トラッキングID」を入れるところはここです。「UAトラッキングID」廃止になるので入れる必要はありません。「Googleタグマネージャー」に切り替えることも出来ます。
- アクセス解析Google Analyticsの設定(GA4トラッキングID/UAトラッキングID/GoogleタグマネージャーID)
- X(旧ツイッター)設定・・・新旧ロゴの表示方法を変えることができます。
「一般」→「公式SNSページURL」<各種SNSページURLの設定>
- 公式SNSページURL登録設定・・・所有しているSNSのアドレスを入力します。
「一般」→「アイキャッチ画像」<アイキャッチ画像の設定>
- NO IMAGE画像設定・・・NO IMAGE画像は、「アイキャッチ画像」などが設定されていないときに、出力される画像です
- サイズ設定・・・アイキャッチ画像の表示サイズを設定します。
- エフェクト設定(通常時)・・・何もしない時の表示。
- エフェクト設定(マウスオーバー時)・・・「変形を利用する」にチェックを入れ、「ズーム」を1.2程度にすると動的効果が見て取れます。
- アイキャッチ上カテゴリラベル設置・・・ONであればカテゴリが分かりやすくなります。
「一般」→「ウィジェット機能」<ウィジェット部分の設定>
ON/OFF切り替えが連動している先は、「外観」→「ウィジェット」の項目です。不要なものは非表示にできます。
- ウィジェットエリアのON/OFF・・・上図参照
- ウィジェットエリアの見出しデザイン設定
- ウィジェットアイテムのON/OFF設定
「一般」→「カスタマイザー表示機能」<カスタマイザー部分の設定>
ON/OFF切り替えが連動している先は、「外観」→「カスタマイズ」の項目です。不要なものは非表示にできます。
- カスタマイザー設定エリアの表示設定
「一般」→「着せ替え設定」<GOLD BLOGが提供するデモサイト選択の設定>
- 着せ替え設定・・・デモサイトの設定をコピーできます。
- 着せ替えデータエクスポート・・・現在の設定をバックアップファイルとして出力できます。
- 着せ替え画像素材インポート・・・デモサイトの欲しい素材をインポートできます。
「一般」→「ヘッダー・フッター自由入力」<ヘッダー・フッターに記述するコードの設定>
- 自由入力エリア</head>直上の設定・・・</head>直前に入力を指定されたコードがあればここで入力します。(ex.アフィリエイトサービスプロバイダコード、CSS、Adsense広告ブロックによる損失収益の回復コード、…)
- 自由入力エリア</body>直上の設定・・・</body>直前に入力を指定されたコードがあればここで入力します。(ex.計測コード、…)
「プリセット設定」
ここではブログ要素のスタイルを選択します。CSS編集もできます。
記事の編集に際にブロックエディタを使用すると表示されるプレビューが、ここの並び順と同じなので、多用するものを上に移動しておきます。「並び替え」を持って上に移動し「変更を保存」を押します。
「見出し」
利用できる「見出し」の一覧が確認できます。
「ボタン」
利用できる「ボタン」の一覧が確認できます。
「ハイライト」
利用できる「ハイライト」の一覧が確認できます。(ハイライト・・・テキストを協調する効果)
「ボックス」
利用できる「ボックス」の一覧が確認できます。
「タイトルボックス」
利用できる「タイトルボックス」の一覧が確認できます。
「引用ボックス」
利用できる「引用ボックス」の一覧が確認できます。
「メッセージ」
利用できる「メッセージ」の一覧が確認できます。
「ULリスト」
利用できる「ULリスト」の一覧が確認できます。
「OLリスト」
利用できる「OLリスト」の一覧が確認できます。
「アコーディオン」
利用できる「アコーディオン」の一覧が確認できます。
「FAQ」
利用できる「FAQ」の一覧が確認できます。
「ステップ」
利用できる「ステップ」の一覧が確認できます。
「テーブル」
利用できる「テーブル」の一覧が確認できます。
「ブログカード」
利用できる「ブログカード」の一覧が確認できます。
SEO設定
「SEO機能の有効化設定」を「ON」にして「変更を保存」をクリックすると、上部に追加のタブが表示されるようになります。
共通
サイトのタイトルなど、検索結果として表示される文言を設置します。どの様なサイトなのか分かりやすく説明します。
デフォルトでは「no index(サイト全体)」にチェックが入っているので注意しましょう。チェックを付けっぱなしにするといつまでたっても検索エンジンに表示されません。
Default
検索結果で表示されるページ内容を決める所になります。「投稿ページ」、「固定ページ」、「カテゴリアーカイブ」、「タグアーカイブ」、「投稿者アーカイブ」について設定できます。
個別のページにも設定箇所はありますが、ここで設定しておけば個別のページの方で設定しなくとも、ここの設定が引き継がれます。
TOPページ(最新の投稿)
TOPページ用の「ページタイトル」、「ディスクリプション」を設定します。
ダッシュボードの「設定」→「一般設定」にある「サイトのタイトル」と「キャッチフレーズ」の内容が引き継がれるので、そちらで入力していれば省略しても大丈夫です。
ダッシュボードの「設定」→「一般設定」の方に記載するようにしましょう。
年月日アーカイブ
検索結果で表示されるページ内容を決める所になります。「年月日アーカイブ」について設定できます。
検索結果ページ
検索結果で表示されるページ内容を決める所になります。「検索結果ページ」について設定できます。
404ページ
リンク切れの場合の表示内容を設定できます。
高速化設定
「高速化機能の有効化設定」を「ON」にして「変更を保存」をクリックすると、上部に追加のタブが表示されるようになります。
CSS非同期読込
各CSSファイルについて、HTMLと同期させるかさせないかの設定をすることができます。
非同期にすれば、ブラウザに読み込まれた順に表示が始まるのでより早く表示されるようになります。
非同期の方が良いように思えますが、広告などがレイアウト崩れを起こす場合もあるので、その際はON/OFFを切り替えてテストをしてみます。
IMG非同期読込
画像ファイルについて、HTMLと同期させるかさせないかの設定をすることができます。
重い画像を多く扱っているサイトの場合には、先に HTML だけを読み込ませブラウザに表示させることにより、ユーザーの離脱を回避できます。
htaccess制御
- ブラウザキャッシュ・・・ブラウザなどが表示したウェブページのデータを一時的にコンピューターに保存する機能です。キャッシュを利用するのでWebサイトの表示速度が早まります。ただし、古いデータを表示する可能性があるため、最新の情報を反映させるためには、キャッシュの削除が必要な場合もあります。
- Gzip圧縮・・・ファイルサイズを小さくする圧縮方法の1つで、ウェブサイトを構成しているhtml、JavaScript、css、xmlなどを圧縮することでデータ量が軽くなりサイトの表示速度を向上させる効果が期待できます。
HTML圧縮
HTMLのサイズを小さくし、読み込み時間を向上させます。
広告設定
「広告機能の有効化設定」を「ON」にして「変更を保存」をクリックすると、上部に追加のタブが表示され、ダッシュボードのメニューに「広告管理」が表示されるようになります。
自動広告設定
Google Adsenseコードを持っていればここに入力し保存します。持っていなければここので入力はありません。
Google Adsenseの申請・設定に関しては下記の記事群で解説しています。
フレームデザイン1・2・3
広告に3種類の枠を表示できます。フレームの形状、フレームの太さ、枠の影などを設定できます。
「広告管理」で広告設定をする
ここではAdSense広告やアフィリエイト広告(ASP)について一元管理できるようにします。
- ここの設定画面でページ内の表示位置を指定する方法
- 設定した広告のショートコードをページに張り付ける方法
この2つの表示方法があります。
ブログページ内に色々なタイプの広告を配置するためには、下の画像のようにダッシュボードの「広告管理」を選び、「新規追加」ボタンを押し、次に出る設定画面で広告タイプなどを入力します。
作った数だけ下の様に一覧で出ます。
個々の設定はGOLD BLOGのマニュアルサイトに詳しく記載があります。
ふきだし設定
「ふきだし機能の有効化設定」を「ON」にして「変更を保存」をクリックすると、ダッシュボードのメニューに「ふきだし管理」が表示されるようになります。(上部に追加のタブはありません。)
「ふきだし」とは下の画像のようなものです。
ふきだしを作るには下の画像のように、ダッシュボードの「ふきだし管理」を選び、「新規追加」ボタンを押し、次に出る設定画面(略)で必要事項を入力します。複数種類を作ることができます。
作った数だけ下の様に一覧で出ます。
作った「ふきだし」を記事上に出すには、「ブロックを追加」からGOLDメニューの「ふきだし」を選びます。設定した「ふきだし」の数だけ「ふきだしセット」内に名前が出るので選択します。
以上、GOLD BLOG(ゴールドブログ)を導入したらすぐに設定すること【テーマ設定】【ゴールドブログ設定】でした。
これより細かな設定はダッシュボードの「外観」→「カスタマイズ」・「ウィジェット」・「メニュー」でできます。
GOLD BLOG(ゴールドブログ)の各ウィジェットの設定については下の記事で解説しています。
ナビゲーション(ヘッダー・フッター)の設定については下の記事で解説しています。
カスタマイザー設定については下の記事で解説しています。
では、また~