基本デザイン設定

サイト全体で共通する、基本的なデザインの設定がまとめられた設定パネルです。

アクセントカラー

サイトのアクセントカラーを設定できます。テーマによっては場所ごとに細かく色を設定できるものもありますが、Snow Monkey はデザインのバランスが崩れてしまいにくいようにアクセントカラーだけを設定するようにしています。

アクセントカラーを設定するとリンクやメニューの色などが変わります。

アクセントカラーの部分で、アクセントカラーとして使用したい色を選択し、保存して公開をクリックして設定を反映してください。

サブアクセントカラー

ブロックエディターの色設定で選択できるサブアクセントカラーを設定できます。

基本の文字サイズ

サイト全体の基本の文字サイズを設定できます。

基本フォント

選べるフォントは下記の4種類です。

  • サンセリフ(ゴシック体) … sans-serfi のみの指定
  • セリフ(明朝体) … serif のみの指定
  • Noto Sans JP
  • Noto Serif JP
  • M PLUS 1p
  • M PLUS Rounded 1c

Noto Sans JP、Noto Serif JP、M PLUS 1p、M PLUS Rounded 1c は Google Fonts を利用しており、Google からフォントを読み込んで表示するので通信量が増え多少表示速度は落ちますが、ある程度どの環境でもきれいなフォントで表示できます。また、これらのフォントはロードするフォントの太さも設定できます(フォントを選択すると選択肢が表示されます)。

モバイル端末時のカスタムロゴの拡大率(%)

デフォルトはロゴの実際の大きさの1/3で表示されます。拡大率を変更することで、最大で1/2の大きさまで大きくできます。(ちなみに、PC はレティナ対策で1/2のサイズで表示されるようになっています)

PC 時のカスタムロゴの拡大率(%)

PC 時のカスタムロゴの拡大率を設定できます。

コンテンツの最大幅

コンテンツの最大幅を設定できます。

1280px の場合(これまでと同じ幅)
1140px の場合

モバイル端末時のコンテンツの左右余白

モバイル端末時のコンテンツの左右余白(コンテンツの端〜ブラウザの端までの余白)を設定できます。

この設定は IE11 などのレガシーブラウザには反映されません。

PC 時のコンテンツの左右余白

PC 時のコンテンツの左右余白(コンテンツの端〜ブラウザの端までの余白)を設定できます。

この設定は IE11 などのレガシーブラウザには反映されません。

要素間の余白サイズ

要素と要素の間(例えば段落と段落の間)の余白( margin)の大きさを設定できます。

この設定は IE11 などのレガシーブラウザには反映されません。

余白サイズ

要素間の余白(margin)および要素内の余白(padding)の大きさを設定できます。

この設定は IE11 などのレガシーブラウザには反映されません。

パンくずリストの表示位置

パンくずリストの表示位置を変更することができます。

パンくずリストの表示サンプル
パンくずリストの表示サンプル

パンくずリストの表示位置は下記のパターンから選択できます。

  • コンテンツの上
  • コンテンツの上(コンテンツ幅に合わせる)
  • コンテンツ下
  • コンテンツの下(コンテンツ幅に合わせる)
  • なし

記事一覧レイアウト

記事一覧部分のレイアウト選択できます。

記事一覧レイアウト – リッチメディア
記事一覧レイアウト – パネル
記事一覧レイアウト – シンプル
記事一覧レイアウト – テキスト

モバイル端末時に記事一覧を1列にする

記事一覧レイアウトが「リッチメディア」「パネル」のときのみ表示されます。

記事一覧レイアウトが「リッチメディア」「パネル」の場合、モバイル端末では記事一覧が2列で表示されます。この項目にチェックすることで1列にすることができます。

デフォルトページヘッダー画像

「アイキャッチ画像の表示位置」設定で「ページヘッダー」「ページヘッダーの上にタイトルを表示」を選んでいる場合で、アイキャッチ画像がない場合に表示されるデフォルト画像を設定できます。デフォルトページヘッダー画像を設定した場合は一覧ページにもページヘッダー画像が表示されるようになります。

オーバーレイヘッダーと組み合わせた例

デフォルトアイキャッチ画像

記事にアイキャッチ画像が設定されていない場合に代替使用される画像を設定できます。

サイトの概要をサイトロゴの下に表示する

「キャッチフレーズ」に入力した文がロゴの下に表示されるようになります。

サイト概要を表示した例

サイトの概要をサイトロゴの下に表示するにチェックすると、サイトの概要がロゴの下に表示されるようになります。

Pure CSS ギャラリーを使用する

JavaScript を使用せずに CSS のみで画像の拡大表示をおこなう機能です。JavaScript を使用してないため軽快に動作します。この機能を有効にすると、次の部分で画像の拡大表示が適用されます。

  • リンク先がメディアファイルになっているギャラリー
  • リンク先がメディアファイルになっている画像
JetPack を使用している場合

JetPack を使用している場合、チェックをしていても強制的に Pure CSS ギャラリー機能は無効になります。これは JetPack がギャラリーに対しておこなうカスタマイズとの衝突を防ぐためです。その他のギャラリー系のプラグインを使用している場合も、同様の理由で強制的に Pure CSS ギャラリーが無効になる場合があります。

Pure CSS ギャラリーを使用するにチェックすると、Pure CSS ギャラリーが有効化されます。

more タグとパスワード保護を同時に使用している場合、more タグより前のコンテンツを表示する

WordPress には記事のパスワード保護機能があります。記事編集画面の「公開状態」で「パスワード保護」を選択すれば、パスワードを入力しないと記事が見れなくなります。ただ、記事がまるっと見れなくなるので、ここまでは見せたいけどここからは隠したい、ということができません。

この機能を有効にすれば、ここまでは見せたいけどここからは隠したい、ということが実現できます。

あとは記事中に more タグを設置すれば、more タグより前は表示され、それ以降はパスワード保護される形になります。

ドロワーナビゲーション内に検索ボックスを表示する

スマホなどのときに表示されるドロワーナビゲーションの中に検索ボックスを表示できます。デフォルトは表示されるようになっているので、不要な場合はカスタマイザーでチェックを外してください。

ドロワーナビゲーション内に検索ボックスを表示するにチェックすると、ドロワーナビゲーションの中に検索ボックスが表示されるようになります。

ページ上部へ戻るボタンを表示

ページ上部へ戻るボタンを表示/非表示できます。

オーバレイウィジェットエリアの最大幅

オーバレイウィジェットエリアの最大幅を設定できます。オーバレイウィジェットエリアについてはこちらのページをご覧ください。

記事中の h2 のデザイン

h2 見出しブロックのデザインを選択できます。

記事中の h3 のデザイン

h3 見出しブロックのデザインを選択できます。

ウィジェットタイトルのデザイン

ウィジェットのタイトルのデザインを選択できます。

Snow Monkey オンラインコミュニティ

Snow Monkey をより良いテーマにするために、今後の機能開発等について情報共有したりディスカッションをしたりする場所です。より多くのユーザーの交流があったほうがより良いプロダクトに育っていくと思いますので、ぜひご参加ください!