ロゴデザイン

以下の画像を、ヘッダー部に追加してみたりして気分転換。

以前に撮った写真にKeynoteで文字を入れだだけ。

フォントはF5.6と筑紫A丸ゴシック。サイズは6000×800で作ったけど、デカすぎかも。

ピクトサインはpictogram2.com様の素材を利用。

アクションフック

ヘッダー部に何かを入れる場合は、フックで”snow_monkey_prepend_contents”をmy snow monkeyの構文に入れてやると良いらしい。以下のように挿入。

add_action(
    'snow_monkey_prepend_contents',
    function() {
        ?>
        <div class="c-btn c-btn--block c-hsma-hook-point p-snow_monkey_prepend_contents"><img src="URL" ></div>
        <?php
    }
);

どうやら画像にborder-radiusとpaddingがとってあったので、CSSで0指定に

.c-btn, .snow-monkey-posts__more {
    border-radius: 0;
    padding: 0;
}

レスポンシブ対応

携帯サイトは非表示で良いと思ったので、CSSで非表示に。

@media (max-width: 1025px) {
.c-btn, .snow-monkey-posts__more
  {
display: none;
}
}

ググった結果、以下のページに辿り着きました。

アーカイブページでタグが表示されるようにしたい

このトピックには3件の返信、2人の参加者があり、最後にキタジマ タカシにより8ヶ月前に更新されました。 4件の…

snow-monkey.2inc.org

 リンクにある通り「My Snow Monkey プラグイン」にadd_filterで追記すれば良いとのことです。

結果

以前読んだinstagramの本に、ハッシュタグはなるべく多く付けるよう記載があり、ブログでも同じ手法を取り入れ始めました。タグを付けることって、記事の内の重要なキーワードを集めて要約するようなもので、どんな内容だっけ？と思い出すときに「タグ」だけ確認すると思い出せたりするので便利。

【読書】Instagramでビジネスを変える最強の思考法

Instagramでビジネスを変える最強の思考法 現代の消費者は、DECAX（デキャックス）という内藤敦之氏が…

tanomimasu.com

ブログテーマはこれまで「AFFINGER4」を使っていたんですが、他のテーマも使ってみたいと思い「SnowMonkey」に変更してみました。

2016年に「はてなブログ」を利用してブログを始めて、2018年にWordpressに移行し、それから3年くらい「AFFINGER4」を利用していましたが、あまり自分は活用出来ず…。GoogleAdsenceの審査に合格したのも、つい先日のことで…。

ぶっちゃけデザインに飽きちゃった事もあるんですが、前から気になっていた有料のテーマ「Snow Monkey」を使ってみることにしました。無料プラグイン「Snow Monkey Blocks」は以前から使っていて、デザイン性に優れていることが決め手でした。あと、前に参加したWordpress勉強会でも話題になってたので〜。

Snow Monkey

＜公式サイト＞

WordPress テーマ Snow Monkey

どんな味付けにも染まる。高級お出汁のような WordPress テーマ、Snow Monkey

snow-monkey.2inc.org

Gutenbelgに対応し、100%GPLで自由に編集出来ます。100%GPLとは「WordPressテーマファイルのうちPHP/CSS/JSもGPL（自由に利用・再配布可能なライセンス）で提供されていること」を意味するみたいです。でも、テーマ自体を無償または有償で、誰かに配布することは禁じられているのでご注意。

自分みたいな素人は、拡張性が高くて素晴らしい感じだって思っておけば良いかな。Wordpress本体も100%GPLで作られているんだって。サブスクリプション制で年間16,500円とのことですが、定期更新しなくてもそれ以降アップデートされないだけで使用することは出来るらしい。

変わったこと

表示速度

多分、AFFINGER4を上手く活用出来ていなかったのが原因だけど、ページの表示速度が劇的にはやくなりました。以前のテーマだと、ホーム画面を表示するのに5秒程度かかっていたのですが、URLをクリックしてから2秒くらいで表示するようになった。

素人でよく分からんけど、funchtion.phpとかstyle.cssとかに無駄なコードを書きまくってた気がするので、リセットして読み込みが早くなったのだろう。よく分からんけど。

デザイン

左が旧で、右が新。ほとんど変わってないレイアウトでページ作成出来た。

使用する色は「ディック・ブルーナの６色」のカラーバリエーションで統一してみた。メインを青色、基本的には他の５色をベースとした。SnowMonkeyはアイキャッチ画像の右上にカテゴリーを表示してくれるので、カテゴリーも６色を参考にした。

ブルーナカラーのCMYK値、RGB値、Webカラー値 | 0017

ブルーナカラーのCMYK値、RGB値、Webカラー値を調べてみました。画像のソースは祖父江さんのtwitpicにある画像（RGB）（CMYK）です。これを元とし、画像をphotoshopで開き…

0017.org

その他、フォントの調整、アイキャッチ画像のサイズ変換とか、引用のデザイン変更、フッターの挿入なんかをした。この辺り、CSSの変更は結構慣れてきたような…。

また気が向けば、デザインを変えてみたい。