便利機能満載&高速表示を目指したWordPress用テーマ【HABONE】の仕様とダウンロード

【HABONE】はWordPressで作成したサイトの表示・管理をしやすくするための「あったらいいな」という機能を備えた、シンプルなデザインのテーマです。
現在ご覧になっているサイトは【HABONE】を使用しています。
ダウンロード前に、本ページに記載している動作要件や機能などをご確認いただき、テーマ切替時に発生する不都合や不具合についてまとめた「テーマ切替前に確認したいこと、気を付けたいこと」を参照ください、
お使いになる前にテーマの利用規約を必ずご確認ください。
【HABONE】を使ったサイト例については、トップページ内で紹介していますので一度参照ください
親テーマ・子テーマとも無料でダウンロードして使用いただけますが、今後もテーマ開発や更新を続けられるよう、こちらのページで支援をお願いしています。ご協力よろしくお願いいたします。
【HABONE】テーマのダウンロードとインストール方法
ダウンロードの方法
以下のボタンをクリックして、パソコンのデスクトップなどへ保存してください
【HABONE】本体のダウンロード
【HABONE】子テーマのダウンロード
親テーマ・子テーマとも無料でダウンロードして使用いただけますが、今後もテーマ開発や更新を続けられるよう、こちらのページで支援をお願いしています。ご協力よろしくお願いいたします。
インストールの方法
万が一のトラブルに備え、インストール前にデフォルトテーマ(「Twenty Twenty One」などWordPressの最新バージョンでインストールされるテーマ)が存在するかをテーマ一覧で確認いただくことをおすすめします
1.管理画面から「外観」をクリックします
2.画面上部の「新規追加」をクリックします
3.画面上部の「テーマのアップロード」をクリックします
4.「ファイルを選択」をクリックし、先ほどダウンロードした【HABONE】テーマを選択し、「今すぐインストール」をクリックします
5.「今すぐ有効化」をクリックします
子テーマを使われる際は、上記5の前に再度1の手順へ戻り、子テーマをインストール後に、子テーマを有効化をしてください
【HABONE】(親テーマ)と【HABONE Child】(子テーマ)は、WordPressでは別テーマとして扱われます。親テーマで行ったカスタマイザー設定は子テーマには反映されません(逆も同じ)ので、最初から子テーマのインストール&有効化をされることをおすすめします。
テーマ有効化後にトラブルが発生したら
サーバー環境やWordPressのバージョンなどテーマの必須要件を満たさない場合や、併用しているプラグインとの競合などにより、稀にテーマを有効化したら画面が真っ白になってしまうことがあります。
そのような場合には「WordPressのテーマを強制的に別のテーマへ変更する方法」を参考に、WordPressのインストール時に同梱されているテーマへの変更を行って復旧してみてください。
テーマの利用規約にも書かせていただいていますが、本テーマを使用したことによるサイトのトラブルに関しては一切責任を負いませんので、了承の上使用ください。
親テーマ・子テーマとも無料でダウンロードして使用いただけますが、今後もテーマ開発や更新を続けられるよう、こちらのページで支援をお願いしています。ご協力よろしくお願いいたします。
使用した感想をお聞かせください
この度は【HABONE】テーマをご使用いただきありがとうございます。今後のテーマ作成や更新に役立てるため、ご意見をお聞かせください。
いただいたご意見は、一度管理者である「ひまあーと」にて確認させていただき、トップページ内で紹介させていただきます
【HABONE】の仕様と動作要件
開発環境および動作要件
本テーマは以下の環境で開発と動作の確認を行っております。環境が異なる場合やブラウザによっては正常に動作・表示ができない可能性がありますのでご了承ください。
使用しているサーバー | Colorful Box(カラフルボックス) BOX2プラン |
WEBサーバー | LiteSpeed |
PHPバージョン | 7.4および8.0 |
Mysqlバージョン | mysqlnd 7.4.23 |
WordPressバージョン | 6.0 |
動作・表示テスト(PC) | Google Chrome Microsoft EDGE Opera Mozilla Firefox テストはすべてWindows版(Windows10上)のみで行っています |
動作・表示テスト(モバイル) | スマートフォンおよびタブレットについては、Google Chromeのデベロッパーツールおよび、拡張機能「Responsive Viewer」「モバイルシミュレーター」でテストを行っています |
本テーマは、構造上、旧ブラウザ(Internet Explorerやバージョンの古いその他ブラウザ)には対応させていません。
また、今後も対応予定はありませんので、旧ブラウザでも正常表示させたい方は、本テーマの使用をご遠慮ください
テーマの基本仕様と機能の一覧
【HABONE BASE】テーマは以下の機能を備えています。
項目 | 概要 |
---|---|
レスポンシブ対応 | 画面幅(モニタ幅・任意のウインドウ幅両対応)、モバイル/パソコンのアクセス別に画面が自動で拡大・縮小するレスポンシブ対応のテーマです |
右サイドバー | 投稿および固定ページで「サイドバーなし(広)」「サイドバーなし(狭)」を選択した場合を除き、本文右側にサイドバーが表示されます |
国際化対応 | .moファイルを使った翻訳が可能。多言語サイトの作成や独自の翻訳文字列を使ったサイト作りができます。 ※一部文字列は日本語表記のみとなります |
子テーマ | 【HABONEBASE】【HABONE】それぞれに専用の子テーマを用意し、無料で配布しています ※本テーマを使って独自の追加カスタマイズをする際は子テーマの使用をおすすめしています |
テーマカスタマイザー | 本テーマに搭載している機能や設定のほぼすべてがテーマカスタマイザー(「外観」→「カスタマイズ」)から行えるようになっています |
エディタへの反映 | テーマカスタマイザーで指定した色や文字に関する設定は、ブロックエディタ上で可能な限り反映されるようにしています また、ブロックエディタ用のCSSクラスを追加すれば、子テーマのCSSへ記述したコードも反映されるようになっています |
専用スタイルシート | パソコン用とモバイル用とで完全に独立したCSSを読み込ませるようにしています。それぞれに不要なコードを出力したり、後から上書きしたりしないようになるため、より処理が高速になります。 ※レスポンシブチェックを行うツールや拡張機能では正常にページが表示されないことがあります ※モバイル・パソコンの判別には組み込み関数のwp_is_mobileを使用しています |
専用スクリプト | パソコン用とモバイル用とで完全に独立したスクリプトを読み込ませるようにしています。それぞれに不要なコードを出力したり、不要な処理をしないようになるため、より処理が高速になります。 ※レスポンシブチェックを行うツールや拡張機能では正常にページが表示されないことがあります ※モバイル・パソコンの判別にはis_mobile関数を使用しています |
機能の名称 | 機能の概要 |
---|---|
カスタムヘッダー(*1) | ヘッダー部分の色、画像などの設定ができます(画像表示はトップページのみにしています) ヘッダー・フッター部分は「サイト幅と同じ」「画面幅と同じ(幅広)」が選択できます |
サイトの色(*1) | サイトでテーマから出力される背景、境界線、文字、ボタン等の色をテーマカスタマイザーから簡単に変更できます |
デザイン要素(*1) | ヘッダー画像の高さ、基本文字の大きさ、フォント(ゴシック体、明朝体)、境界線の太さなどをテーマカスタマイザーから簡単に変更できます |
カスタムフッター(*1) | フッター部分の色、フッターコンテンツを表示させる列(1~3列)などの設定ができます。フッターの内容はウィジェット設定で簡単にできるようにしています |
ウィジェットエリア | 以下のウィジェットエリアを独自に追加しています ・「サイドバー」 ・「投稿アイキャッチ画像下」 ・「投稿本文下」※ ・「投稿最下部」※ ・「固定ページアイキャッチ画像下」 ・「固定ページ最下部」※ ・「フッター」 ※印のものは、パソコン表示時とモバイル表示時で別のものが設定できるようになっています。 |
モバイル時フッター非表示(*1) | モバイル表示時にフッターの内容が長くならないよう、ウィジェットの情報を表示しないようにできます |
更新日を有効活用(*1②⓹) | ①検索エンジンへ、更新日を優先して認知されるようにします。 ②更新日を基準に閲覧画面側、管理画面側のリストを表示させることができます ③個々の投稿・固定ページに対して更新日の「変更する」「変更しない」「削除する」を選択でき、更新日を使ったコンテンツの鮮度管理ができるようになります ④最終更新日を管理画面の一覧へ表示し、更新日を基準に並び替えができます ⓹クイック編集(個々のクイック編集のみ)での更新時に更新日を変更しないようにします |
アイキャッチ画像の適正化 | アイキャッチ画像の縦横サイズを、HTMLソース上で強制せず、実寸を出力するようにし、検索エンジン等に画像サイズがご認知されないようにします。 |
フッターの著作権表示 | フッターへサイトコンテンツの著作権表示をします。また、対象年度をサイト内の一番古い投稿から最新の投稿の公開日までの範囲表示にします。 |
ブロックベースのウィジェット無効(*1) | WordPress5.8から採用された、ブロック形式のウィジェット設定を無効にし、従来のウィジェット設定画面へ戻します |
Emoji機能を停止(*1) | WordPress標準で有効化されているEmoji機能を無効にし、余分なコードを出力しないようにします。 |
タグを一覧表示にする(*1) | 投稿編集画面のタグ表示をカテゴリーと同じ一覧形式にします |
サイトマップを無効にする(*1) | WordPress標準で出力される、簡易サイトマップ(検索エンジン向け)機能を停止します。 |
機能の名称 | 機能の概要 |
---|---|
「ホーム」「トップ」へ戻るボタン(*1) | ページをするロールしていくと、画面右隅に「ホームへモデル」「トップへ戻る」ボタンを表示します。アイコンの色・背景色の設定ができます。 |
パンくずリスト(*1) | タイトル上に今どの階層のページを閲覧しているかを示す「パンくずリスト」を表示させることができます。 |
ブロックパターン機能(*1) | 通常の投稿と同じように作成しておいた定型文、複数のブロックで構成したフォーマットなどを簡単に挿入できる機能です。 |
REST APIを無効にする(*1) | 不必要なREST APIのリクエストを遮断し、外部からコンテンツの取得ができないようにします |
HTMLの圧縮(*1) | テーマが出力するHTMLから、不要なコメントや改行を削除し、ページの転送量を減らします。 |
画像処理をGDに強制(*1) | アップロード時の画像処理をより軽量なGDに強制します。サーバーの負荷を軽減し、複数の画像をアップロードした際にエラーが出るのを防止します。 |
ログインをメールアドレスに限定(*1) | 作者の投稿一覧からユーザーIDが判別できてしまうことによる不正ログインを防止するため、ログインをユーザーのメールアドレスに限定します。 |
画像alt属性の自動設定(*1) | 本文に挿入した画像(imgタグ)にalt属性が設定されていない場合、投稿(固定ページ)タイトルを自動挿入するようにします。 |
再利用ブロックの強調表示(*1) | 投稿(固定ページ)編集画面上で再利用ブロックが使われている場所に対し、再利用ブロック全体を囲む赤枠の表示、および冒頭へのメッセージ表示を行います。 |
スクリプトの遅延処理(*1) | テーマ・プラグインが読み込むように指示されたスクリプトに対し、「defer」属性を付加し、表示速度の改善を図ります。「レンダリングをブロックするスクリプトの除外」提案を出にくくします。 |
再利用ブロックメニュー(*1) | 標準では投稿編集画面からのみから数手順かけて編集していた「再利用ブロック」の編集リンクを管理画面の左メニューへ追加し、管理しやすくします。 |
メディアサイズ表示 | 標準ではメディア編集画面でしか見られない、「画像の縦横サイズ」「画像の容量」をメディア一覧へ表示させます。 |
SEOフィールド(*1) | 編集画面上で「タイトル」「キーワード」「説明」「noindex」「nofollow」の項目を設定できます(バージョン1.2よりクイック編集でも変更が可能になりました)。 また、これらの情報をHTML内へ出力し、検索エンジンへページの正確な情報を知らせることができます。 ※【HABONEBASE】はこの機能を持つプラグインを使われることを前提としていますので、ページヘッダーには何も出力しません |
canonicalタグの出力(*1) | ページヘッダーへ正確なURLを伝えるCanonicalタグを出力します ※【HABONEBASE】はこの機能を持つプラグインを使われることを前提としていますので、ページヘッダーには何も出力しません |
OGPタグの出力(*1) | ページヘッダーへSNSへ埋め込まれたリンクをカード表示するためのOGPタグを出力します |
アドセンスコード補助(*1) | Google Adsenseの広告コード設置を補助します ・自動広告タグを簡単に設置できます ・インライン広告の簡単設置、表示間隔の設定ができます ・ページ読み込み後、または、訪問者のマウス操作によってAdsenseの外部スクリプトの読み込みを開始するようにし、広告コードの読み込みによる表示速度の低下を防ぎます |
H2タグ下コンテンツ(*1) | 投稿・固定ページ本文内にある1~3番目のH2タグ前に任意のコンテンツを自動挿入します |
ヘッダー・フッターへのコード挿入(*1) | ページヘッダーおよびページフッターへ任意のコードを追加できます。アクセス解析タグやスクリプトや外部スクリプトへのリンクを直接挿入できます。 |
独自アクセス数計測 | 管理ユーザーのアクセスと可能な限りのBOTアクセスを除いた投稿・固定ページごとの累計アクセス数を計測し、管理画面へ並び替え可能な列として表示します また、これを基に独自の人気投稿ウィジェットを表示させることができます |
独自ウィジェット | ・アイキャッチ画像付き新着投稿リストウィジェット(公開日順) ・アイキャッチ画像付き新着投稿リストウィジェット(更新日順) ・アイキャッチ画像付き人気投稿リストウィジェット ・同一カテゴリー内アイキャッチ画像付き人気投稿リストウィジェット |
構造化データの出力 | json-LD形式での構造化データ(schema.org)を出力します(ページ、パンくずリスト) |
装飾機能 | 標準の段落ブロック、リストブロック、テーブルブロックでいくつかのデザイン選択ができます |
メディアページをインデックスしない(*1) | アップロードした画像に対して自動生成される画像ページを検索エンジンにインデックスされないように要求します |
内部リンクカード(*1) | 内部リンクカードでアイキャッチ画像のサイズによって切り替わるカードサイズを、すべて「小」カード表示にします |
埋め込みコンテンツの遅延読み込み(*1) | 「Twitter」「Instagram」「日本ブログ村」のスクリプトを遅延読み込みさせることで表示を高速化します ※カスタムHTMLブロックへ埋め込みタグ挿入後、スクリプト部分を削除することで有効になります |
関連記事表示(*1) | 投稿本文下へ関連記事(同一カテゴリーの記事をランダム抽出)を表示します |
RSSフィードを更新日順にする(*1) | 通常は公開日順で出力されるRSSフィードを更新日順へ変更し、フィードリーダーへ更新日を通知して並び替えるようにします |
最下部のウィジェットを追従表示(*1) | サイドバーウィジェットエリアに挿入した最下部のウィジェットを、本文量に合わせて追従表示させます |
古い投稿への表示(*1) | 最終更新日から一定期間経過した投稿の本文冒頭へ、情報が古い可能性があることを自動表示します |
商品カード表示 | ショートコードを使ってAmazonの商品情報と、楽天・!Yahooショッピングの検索リンクをカード表示します(簡易機能です) |
管理ユーザークリック禁止(*1) | Google Adsenseの自動広告および<div class=”no-click”>~</div>で囲まれた部分を管理者権限を持つユーザーがクリックできないようにします |
ブロックに外枠を付ける(*1) | 投稿・固定ページ編集画面の各ブロックに、薄い外枠を表示させます。ブロック編集に慣れていない方やブロックの視認性の向上に役立ちます。 |
作者プロフィール(*1) | 投稿本文下へ「文字リンク」または「カード形式」で作者情報を表示します(非表示にすることも可能です) |
添付ファイルページをリダイレクト(*1) | 添付ファイルページへの直接アクセス時、トップページへ遷移させます |
任意文字列の装飾 | ブロックエディタ内の任意の文字列に対し、色付きのアンダーラインやマーカーを使うことができます(テスト機能です) |
任意文字のサイズ変更 | ブロックエディタ内の任意の文字列に対し、通常の1.2倍または1.5倍の文字サイズ指定ができます(テスト機能です) |
モバイルのトップページを指定する | ホームページ設定に関わらず、モバイルのトップページを通常の投稿一覧、または、任意の固定ページに指定できます |
シェアボタンの任意表示 | テーマカスタマイザーの位置以外でも、ショートコードを使ってシェアボタンの表示をさせることができます |
冒頭へ説明文の表示 | 本文冒頭へSEO設定欄に入力した文章を表示させる機能です |
ヘッダーカスタマイズ | トップページヘッダーで以下のようなカスタマイズができます ・ヘッダー画像を使う、ヘッダースライダーを使う、画像なしの選択 ・ヘッダーテキスト(タイトルとキャッチフレーズ)を画像の中に表示させるかどうか ・グローバルメニューを画像の上下どちらに表示するか |
XML-RPCの無効 | 不正ログインやスパム行為の原因となるXML-RPC通信を無効にします |
「前ページへ」リンク | 投稿(固定ページ)本文下へ直前に閲覧したページへのリンクを表示します。 また、ショートコードを使って任意の場所へ表示させることもできます。 |
プライバシーポリシーリンク | ページ下部のコピーライト表示横へプライバシーポリシーページへのリンクを表示します。 ・テーマカスタマイザーで表示/非表示の選択ができます ※プライバシーポリシーの固定ページが公開されていて、管理画面のプライバシー設定でその固定ページが選択されている場合のみ機能します |