シンプルで使いやすいWordpress用無料テーマ【ha-Basic】の配布、テーマカスタマイズの方法のご紹介など

【ha-Basic】テーマカスタマイザーを使用した初期設定の手順

公開日:2020年9月3日 マニュアル

シンプルデザインの無料テーマ【ha-Basic】では、初心者の方や初めて本テーマを使用する方が戸惑うことがないよう、ほとんどの機能制御、設定をテーマカスタマイザーという機能を使って行えるようにしています。

テーマの設定(テーマカスタマイザーの呼び出し)は以下の手順で行います。

管理画面から外観カスタマイズを選択します。

開かれた画面にha-Basic設定という項目があるのでクリックします

するとさらに細かいメニューが表示されますので、それぞれの項目について設定を行っていきます。

一部の設定を除き、変更したものは即座に右側の画面に反映されますので、確認して問題なければ画面上の公開をクリックして確定していきます。

それでは早速いろいろな項目の設定を行っていきましょう

※設定項目がたくさんあり、ここですべての解説を行うと設定疲れしてしまう可能性がありますので、本ページではメニュー内容と大まかな設定方法を紹介します。機能の詳細情報、機能の使用方法については各項目にあるリンクをクリックしてそれぞれの機能の詳細ページをご覧ください。

「表示設定」項目の設定内容

メニュー項目機能や設定内容の概要
カテゴリー別人気記事ウィジェットのID「カテゴリー人気ウィジェット」を個別投稿以外で表示させないようにするため、ウィジェットのIDを入力します
サイトのキャッチフレーズを表示管理画面の「設定」で入力した、キャッチフレーズの内容をサイトタイトル下に表示する場合は有効にします
サイトスキンいくつかのカラーパターンの中からサイトの基調色を選択します
※変更は即座に右側のプレビューへ反映されません
Topへ戻る、Homeへ戻るボタンを表示画面右下に表示されるボタンの表示/非表示を決定します
投稿本文下にQRコードを表示する投稿本文の末尾へ現在閲覧中のページURLを含めたQRコードを表示します
本文下に作者情報を表示する投稿本文の末尾へ作者情報を表示します
作者プロフィールでHTMLタグを許可する作者プロフィールに使われる「ユーザー」の「プロフィール情報」でhtmlタグを使えるようにします
作者情報の画像にGravatarを使う作者画像にGravatar(グラバター)を使用するかどうかの設定です
作者画像に共通の画像を使うすべての作者に共通のユーザー画像を表示させます(単独作者によるサイト向けの設定です)。
トップページに画像スライダーを表示するトップページメニュー下に徐々に拡大しながら入れ替わる画像スライダーを表示します。最大3つまで画像を設定可能です。画像はその場でアップロード、変更が可能です。
投稿本文下へ関連投稿を表示する本文下へ関連記事(同一カテゴリー・ランダム抽出)を表示させます。下の項目で表示する件数の設定をします。
投稿本文下へSNSシェアボタンを表示する投稿本文下へシェアボタンを表示する場合はチェックを入れます
固定ページ本文下へSNSシェアボタンを表示する固定ページ本文下へシェアボタンを表示する場合はチェックします
画面左へ追従型のSNSシェアボタンを表示する画面左側へ追従型(常時表示型)のシェアボタンを表示する場合はチェックします
サイト内のリストを「更新日順」で出力通常「公開日順」で表示されるアーカイブやブログの一覧を「更新日順」に表示します
RSSフィードの出力を更新日順にする通常「公開日順」で出力されるRSSフィード情報を「更新日順」で出力するようにします。出力内容と出力件数は管理画面の「設定」→「表示設定」に従います。

「アクセス解析&高速化」項目の設定内容

メニュー項目機能や設定内容の概要
Google Analyticsを使うすぐ下の「トラッキング ID」を使ってGoogle Analyticsのトラッキングタグをヘッダー内に生成する場合はチェックします
表示高速化設定を使うWordPressの仕組みに従って挿入されるスクリプトの読み込みを遅延させ、CSSの読み込みを最適化することで高速表示させます
※プラグイン使用時に不具合が起きた場合にはチェックを外してください
HTMLの圧縮を行う出力されるHTMLを可能な限り空白・コメントのない状態で出力します。転送ファイルサイズが小さくなるため、高速化が期待できます。
ブログ村パーツ読み込みの高速化日本ブログ村パーツの表示遅延が原因で表示速度が低下するのを防ぎます
※この機能を使う場合はパーツのコードに含まれる「<script src=”https://blogparts.blogmura.com/js/parts_view.js” async></script>」というコードを削除してください。
Twitter埋め込みの高速化Twitterの埋め込みコンテンツの呼び出し遅延が原因で表示速度が低下するのを防ぎます
※埋め込みコード後半の「<script async src=”https://platform.twitter.com/widgets.js” charset=”utf-8″></script>」は挿入した埋め込みコードから削除してください
インスタグラム埋め込みの高速化Instagramの埋め込みコンテンツの呼び出し遅延が原因で表示速度が低下するのを防ぎます
※埋め込みコード後半の「<script async src=”//www.instagram.com/embed.js”></script>」は挿入した埋め込みコードから削除してください

「追加コンテンツ・コード」項目の設定内容

何かのカスタマイズ用スクリプトやHTMLをヘッダー(<head>~</head>の間)、フッター(<footer>~</footer>)、および本文下へ追加する場合に使用します

※PHPプログラムは動作しません

「広告設定」項目の設定内容

メニュー項目機能や設定内容の概要
Google Adsenseを使うチェックを入れることで、アドセンスの外部スクリプトタグを遅延読み込みさせ、表示速度の低下を防ぎます
(Google PageSpeed Insightのスコアも大幅にアップします)
※この機能を有効にするには、すべてのアドセンス広告タグから「<script async src=”https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js”></script>」を削除してください
Google Adsense自動広告を使う自動広告を有効にする場合にチェックします。上の「Google Adsenseを使う」にチェックを入れ、下の「アドセンス広告のID」へIDを入力すると機能します。
アドセンスインフィード広告の広告IDAdsenseインフィード広告のコードの中にある「data-ad-slot」という行の数字をコピペすると、下の「アドセンスインフィード広告の表示間隔」で設定した記事ごとにインフィード広告を表示させます
※要「Google Adsenseを使う」のチェック、「アドセンス広告のID」の入力
商品カード用設定商品カード表示用ショートコードを使用する際に「Amazon PA-API アクセスキーID」~「Yahoo!バリューコマースPID」までのIDを入力します
※Amazonアソシエイトの情報は必須です。楽天・バリューコマースについては任意です(ショートコード生成時にボタンの表示/非表示の切り替えができます)
H2タグ前に入れるコンテンツ本文内にあるN番目(1~3)のH2タグ前に設定した定型文や広告が自動挿入されます
※PHPプログラムは動作しません
記事下ダブルレクタングルコンテンツを使う記事下に2列表示の広告を表示します。表示する内容はその下の入力窓へ挿入します
※本文の幅に対して2つ表示させますので、広告幅は最大336pxにしてください
また、モバイル用に1列で表示する広告コードも設定します

「ログイン画面・管理画面」項目の設定内容

メニュー項目機能や設定内容の概要
管理画面側をカラーパターンに合わせる「表示設定」のサイトスキン項目で選択したカラーパターンを、管理画面・ログイン画面にも適用します。
会員制サイトなどでバックエンド作業をさせる場合など統一感を持たすことができます。
ログイン画面のロゴ画像を変更ログイン画面のロゴ画像を独自の画像に変更します。
また、クリック時のリンク先をWordPress公式サイトから、自サイトのトップページへ変更します。
管理バーロゴを変更する管理バー左隅のWordPressマークをオリジナルのものへ変更します
管理画面下部のテキストを非表示にする管理各画面下に表示されるWordPressのバージョン情報などを非表示にします。

「エディタ設定」項目の設定内容

メニュー項目機能や設定内容の概要
タグを一覧表示する投稿編集画面のタブ項目を入力窓のみの状態から、一覧表示へ変更し、選択しやすくします。
独自のブロックパターンを使うWordPress5.5から機能が追加されたブロックパターン機能を使いやすくします
標準のブロックパターンを削除WordPress5.5のブロックパターンで標準搭載されているパターンを削除(非表示)にします

「その他の設定」項目の設定内容

メニュー項目機能や設定内容の概要
ログインをメールアドレスに限定するユーザー名でのログインを無効にします。作者アーカイブのURLからユーザー名を判別されることによる不正ログインのリスクを軽減します。
※サイトのメールアドレスと管理ユーザーのメールアドレスを別にする必要があります
REST APIを無効にする必要最小限の利用を除き、REST APIでの接続を無効にします
画像処理をGDへ変更する標準のImagic画像処理から処理が比較的軽いGD画像処理へ変更します。
画像のアップロード時頻繁にエラーが出る際は、GDにすることで回避できる可能性がアップします。
テーマ作者ページへのリンクを表示するチェックを外すとフッターに表示されるクレジット表示を消すことができます。
ha-Basic標準のファビコンを無効にするha-Basicテーマ標準の猫マークファビコンを無効にします
※独自のファビコン設定は、テーマカスタマイザーの「サイト基本情報」で行います
絵文字機能を無効にするWordPress標準の絵文字機能。チェックを入れると機能を停止します(ほとんど使われることがないと思いますのでデフォルトでチェックを入れています)
本文に挿入する画像のURLを相対URLにするビジュアルエディタ、ブロックエディタ(クラシックブロック・画像ブロック)の画像URLを挿入時に相対URLへ変更します
※機能を有効にしている間に挿入する画像にのみ適用されます
標準のサイトマップ機能を無効にするWordPress5.5から追加された検索エンジン向けサイトマップ生成機能を無効にします。
別のサイトマッププラグイン等と併用するとき有効にします
標準のLazy Load機能を無効にするWordPress5.5から追加された画像の遅延処理(Lazy Load)機能を無効にします
別のLazy Load機能を持つプラグインと併用する際有効にします

「SEOプラグイン併用時の調整」項目の設定内容

メニュー項目機能や設定内容の概要
Canonicalタグをテーマ側で出力しないSEO対策プラグイン等を使ってCanonicalタグが出力されるようになっている場合、重複出力しないようにします
titleタグをテーマ側で出力しないSEO対策プラグイン等を使ってtitleタグが出力されるようになっている場合、重複出力しないようにします
descriptionタグをテーマ側で出力しないSEO対策プラグイン等を使ってdescriptionタグが出力されるようになっている場合、重複出力しないようにします
keywordタグをテーマ側で出力しないSEO対策プラグイン等を使ってkeywordタグが出力されるようになっている場合、重複出力しないようにします
構造化データをテーマ側で出力しないプラグイン等を使って構造化データが出力されるようになっている場合、重複出力しないようにします
OGPタグをテーマ側で出力しないプラグイン等を使ってOGPタグが出力されるようになっている場合、重複出力しないようにします
  •  白黒ハチワレ猫の【モモ】とのんびり暮らしながらフリーランスでサイト制作のお手伝いをしていますブログツールでありながら本格的なウェブサイトに必要な機能を追加できるWordpressの良さを活かした楽しく便利なサイト作りのお手伝いをさせていただいております

QR Code

このページはモバイル端末でもご覧いただけます

左のQRコードを読み取っていただくと、このページのURLが表示され、簡単にアクセスできます。ぜひモバイル端末でもご覧ください。

いつでもご相談・お見積りの依頼を受け付けています

Wordpressのカスタマイズ、不具合解消のご相談はすべてココナラのダイレクトメッセージからお受けしております。まずはこちらのバナーからお気軽にお問い合わせください。

※一度もココナラを使ったことがない方はココナラへの無料登録が必要です。こちらから登録後、上のリンクをクリックする、またはココナラトップページから「ひまあーと」を検索してお問い合わせください。

【スポンサーリンク】