設定ガイド
CSS “mobile-overlay”
ブロックカバーの高度な設定 > 追加CSSクラス「mobile-overlay」を入力すると、モバイル表示のときにのみオーバーレイが適用されます。
ブレイクポイントは、画面サイズ425px以下です。
CSS “right-center-text” “left-center-text”
ブロックカバーの高度な設定 > 追加CSSクラス「right-center-text」または「left-center-text」を入力すると、ブロックカバー内のテキストの位置を左右に寄せる事ができます。
右に空白がある画像には「right-center-text」、左に空白がある画像には「left-center-text」を入力してください。
※モバイル表示ではクリアされますので、「mobile-overlay」と合わせて使用すると良いでしょう。
テンプレート “No Feature”
ページ属性 > テンプレート > No Feature を選択すると、アイキャッチ画像と投稿タイトルを、このページのようにページトップから消す事ができます。
body クラスは「page-template-no-feature」となりますので、独自のスタイルを追加できます。
タイトル背景全画面トップ画像の登録
PILGRIMでは、各固定ページ・投稿ページのトップに全画面表示のアイキャッチ画像を設定することができます。
ディスプレイサイズ425px以上は、各ページのアイキャッチ画像へ横長(幅980px縦735px推奨)の画像を設定することで、横長のディスプレイにフィットするトップ画像を表示できます。
モバイル用に425px以下の画像は、「ブロックの追加」→「画像」を選び、「高度な設定」の追加CSSクラスに「mobile-pic」と入力することで、縦長(幅654px縦980px推奨)のモバイル用画像を表示できます。
画像の上にテキストを配置したい場合は、キャプションに入力すると反映されます。
アイキャッチ画像を設定しない場合は、代替え画像が表示されます。代替え画像のディレクトリは、テーマフォルダ内の「image」フォルダに格納されていますので、好きな画像に差し替えることができます。
スペースレスデザイン
PILGRIMでは、スペースレスデザインを採用しています。スペースレスとは、上下左右の余白がなく、背景画像や配置した画像をフルサイズで画面いっぱいに配置するデザインです。
これは、WordPress 5.2以上の機能であるブロックエディターに対応したものであり、「カバー」「画像」を配置した場合に余白がなくなるようにスタイルを調整しています。余白が必要であれば、ブロックスペーサーでブロック上下の余白を調整するか、追加CSSで指定部分の余白を設けてください。
フォーラムでの質疑応答
テーマに関するご質問、お問い合わせがありましたら、関連するForumにコメントで書き込んでください。
- JS + CSS + HTML Accordion Elementフィンランド人のアコーディオン奏者、Esa Pakarinen Wikipediaからの写真 JavaScri…
- CSS + HTML only Accordion ElementCSS + HTML only Accordion Element Languages Used This p…
- 投稿日を表示するショートコード投稿ページまたは固定ページに、テンプレート「no-feature」を使用するとトップ画像と投稿日、タイトルが非…
- Google Analyticsのトラッキングコードを<header></header>に設置するfunctions.php 内へ追記します。 <!– Global site tag (gt…
- 設定:ソーシャルボタンの追加・変更WordPress用テーマPILGRIMでは、フッターにSNS用ソーシャルリンクボタンを設置できます。(Fac…
- 設定:フッターウィジェットを増やすテーマPILGRIMでは、軽量化・簡素化のためにテーマのカスタマイズは、「外観」→「テーマエディター」のfun…