設定ガイド

Setting Instructions

設定ガイド

WordPress用テーマPILGRIMは、ダッシュボード(管理画面)からの設定を少なくして、軽量化を図っています。カスタマイズは各設定項目のページをご覧ください。

CSS “mobile-overlay”

ブロックカバーの高度な設定 > 追加CSSクラス「mobile-overlay」を入力すると、モバイル表示のときにのみオーバーレイが適用されます。

ブレイクポイントは、画面サイズ425px以下です。

CSS “right-center-text” “left-center-text”

ブロックカバーの高度な設定 > 追加CSSクラス「right-center-text」または「left-center-text」を入力すると、ブロックカバー内のテキストの位置を左右に寄せる事ができます。

Left Center Text

左寄せのテキスト

左側に空白がある写真の上にテキストを配置したい場合にCSS「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」フォルダに格納されていますので、好きな画像に差し替えることができます。

landscape-pic
mobile-pic

スペースレスデザイン

PILGRIMでは、スペースレスデザインを採用しています。スペースレスとは、上下左右の余白がなく、背景画像や配置した画像をフルサイズで画面いっぱいに配置するデザインです。

これは、WordPress 5.2以上の機能であるブロックエディターに対応したものであり、「カバー」「画像」を配置した場合に余白がなくなるようにスタイルを調整しています。余白が必要であれば、ブロックスペーサーでブロック上下の余白を調整するか、追加CSSで指定部分の余白を設けてください。

フォーラムでの質疑応答

テーマに関するご質問、お問い合わせがありましたら、関連するForumにコメントで書き込んでください。