使っているテーマ「SURFARAMA 」の変更点について

調べてもあんまりないので書いておきます。このサイトで使っているWordPress用テーマ「SURFARAMA」を変更した中でポイントになる点についてです。興味ない人には全く意味のない記事です。

元になっているテーマはこの「SURFARAMA」です。さしあたり記事毎の見出しがピンタレスト風に大量に生成されますが、アイキャッチは全てFULLサイズで読み込みます。これだと超絶大きい画像を連続して読み込むことになりますのでCSSでFULL→MEDIUMに変更。併せてMEDIUMのサイズ自体をWP設定→メディアでテンプレートに合わせて600くらいに変更します(これをしないと画質がガタ落ちする)。これで読み込みが劇的に速くなります。

デザイン的な色の組み合わせは趣味だと思うのですが、テーマ自体の機能であちこちカラー設定出来ます。ですが逆にこの機能がデザインをイジる上で邪魔になるのでCSSで色やデザインをいじっていく場合は!importantを付与します。しないと結局どこを追えばいいのか追っかけきれないです。

トップに(このサイトのように)スライダーを入れたい場合はindex.phpをイジることになります。なのでphpのコードが生成できるタイプのプラグインを使います。ここはmeta sliderを使っています。文字などを入れたい場合はindex.phpに直接HTML書いちゃったほうが早いです。

カテゴリー分けした画面でここでは「多くの実績の中から公開可能なものをご紹介します。」とか「新しく挑戦していることや日々の雑感をお届け」とか書き分けていますが、これはcategory.phpのheader読み込みの下ににifを追加し、カテゴリーIDで分岐しています。カテゴリーのスラッグではなくIDなのに注意。

面倒なのはこの辺りです。表示全体の入れ子構造が結構めんどくさいので好みの見た目に持っていくのは意外と大変です。とりあえずピンタレスト風にグリッドする小窓はgrid-boxです。CSSやGoogle chrome デベロッパーツールとにらめっこしましょう。頑張ってください。

それとIE8以下はもう切り捨てましょうw  付き合ってたらキリがないし、それのために先進性やデザインを犠牲にするのはもったいないです。

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

CAPTCHA