固定ページのスタイル
固定ページは基本的にはFullWidthで作成します。
また、Padding Topを0pxとします。
固定ページのスタイル（その２）
固定ページ文章等を多く描く場合は、FullWidthにすると、横幅が長くなりすぎて読み難くなります。
その場合は、段組を行うか、サイドメニューなどを表示し、画面を分割することにより読みやすくしましょう。
現在、問題解決の各ページで採用しています。
例） http://tlccc-machida.com/solutions/renewal
レスポンシブ設定
システムでは、Bootstrapというフレームワークを使っています。
このフレームワークでは以下の設定がなされています。
必要に応じてこの設定をオバーライトしています。
Extra small devices (col-xs)
スマホ用、768px未満のビューポート
Small devices (col-sm)
タブレット用、768px以上 992px未満のビューポート
Medium devices (col-md)
デスクトップ用、992px以上 1200px未満のビューポート
Large devices (col-lg)
デスクトップ用、1200px以上のビューポート
なお、テーマでもこれらの設定を継承していますが、調べて見ると多少変な設定があります。
レゾルーションバウンダリーに以下の幅で設定されている項目があります。
320px,480px,600px,640px,767px,768px,769px,920px,992px,1200px
この辺りの微調整はデバイスでの動作確認をして、問題があれば修正します。
画像をレスポンシブルで表示する
固定画面のトップなどに画面いっぱいに画像を表示したい場合は、以下のクラス指定で記述する。
<div class="full-width-image">
<img src="http://tlccc-machida.com/wp-content/uploads/2017/08/Hakuba80357-1920.jpg" />
</div>
Youtube動画をレスポンシブルで埋め込む
Youtube動画のurlをそのまま記述すれば、自動的にレスポンシブで動画を埋め込みます。
例：
https://www.youtube.com/watch?v=UWSSRzKff2Q
文章をインデントする
文章をインデントしたい場合は以下のクラスを利用します。デフォルトでは80%。
すなわち、横幅に対して、先頭に１０％、本文が８０％、後ろに１０％の余白が取られます。
session-indent (デフォルト８０％）
session-indent-95 (95%)
session-indent-90 (90%)
session-indent-85 (85%)
session-indent-80 (80%)
session-indent-75 (75%)
session-indent-70 (70%)
具体的な記述は
<div class="session-indent">
Your contents
</div>
アイキャッチ画像について
アイキャッチ画像は可能な限りしていします。これはFacebookなどで共有した場合のイメージとして使われます。
Facebookはリンクが指定されると、そのページで使われている画像を自動的に取得します。
アイキャッチ画像を指定することにより、より効果的な表示をFacebookページで行うことが可能です。
アイキャッチ画像は４：３程度の画像を推奨します。
*SEO設定はこれから検討する*
メニューについて
トップページのメニューエリアには２種類のメニューが表示されます。
メニュー前半はテーマでしたいしたメニューが表示されます。
各項目を表示するかどうかは、各項目のメニュータイトルで指定されます。
メニュー後半には、Home Page Header Menuというメニューエリアがあり、ここにカスタムメニューを表示できます。
ここに、固定ページへの直接リンクなどを記述できます。
プルダウンメニューを作ることも可能です。
メニューは管理画面のメニューで作成できます。
投稿について
投稿ではアイキャッチが必須です。どんな投稿にも必ずアイキャッチ画像を指定してください。
アイキャッチ画像が入っていないと、リスト表示した時にライアウトがクザウレます。
デフォルトアイキャッチの指定できる機能がないため。ソースコードをいじればいいのですが時間がないので。。。
リスト表示について
お知らせ情報のリスト
http://tlccc-machida.com/news
Blogのリスト
http://tlccc-machida.com/blog
リストの先頭にアイキャッチ画像を出すようにしています。
ホーム画面の段組
サブメニュー及び教会の働きの段組は640PXを教会として段組を解除しています。
サブメニューに関しては640-767の間で４段組を２段組に自動制御できればスマートだな！
アップルはそんな制御をしている。（さすが！！！！）
サイト内ページリンクにつて
ほとんどのページが現在ツリー状に配置されている。
できるだけページ内リンクを作り、少しでも訪問者のサイト滞在時間を長くしましょう。
パブりサイズ共有について
システムが完成に近づいたら、パブりサイズ共有の設定を行おうと思います。
パブりサイズ共有とは、投稿をすれば自動的にFacebook、Twitter、LineなどのSNSへも投稿する機能です。
ちょっと勉強しておいてください。
そのためのシステムはすでにインストールしてあります。（JetPack)
配色に関して
今後マテリアルデザインを導入するにあたり、カラーレパートリーを統一する必要があります。
そこで、このレパートリーのLevel-300で統一します。
柔らかなイメージになると思います。
教会用語
教会用語の英語訳が良くわからんので参考サイト
http://www5b.biglobe.ne.jp/~shu-sato/lds/ldsyogo.htm
Wedgetエリアのアサイン
Sidebar 1 イベントページサイドバー用
Sidebar 6 お悩み解決ページインデックス（HTML)
Sidebar 8 全固定ページインデックス