LIQUID DESIGNさん MAGAZINE(WordPressテーマ)を選択 ブログの外観を変更しました

当ブログ ものくろぼっくす の外観を変更しました。今回も有料テーマを購入しまして、LIQUID DESIGNさんのMAGAZINEをチョイスしました。

6時間ほど、調整していい感じになりました。

知ったきっかけ

このテーマを知ったきっかけは、facebookだった思います。そして、「あなたのスイッチを押すブログ」さんにて、姉妹関係になるテーマ MAGAZINE-Pが使われているを見つけて、気になっていました。

年明けのタイミング(2016年1月)に、facebookのメッセージが届かない記事にアクセス集中がありまして、嬉しかったのですが、レンタルサーバーから規制によってサーバーダウン、その後、すぐに網元AMIさんを契約して、ブログを引越しました。その時は、バズ部さんが配布されているテーマを使って、カスタマイズを行う予定でした。

ところが、ありがたいことに、お仕事の依頼もたくさんいただきまして、部分的には調整しつつも、根本的な部分は手付かずの状態に。いつまでもカスタマイズに着手できていない状態だったので、思い切って有料テーマを購入しました。

結果、買って正解でした。半日の作業でかなり効率良く、情報発信するベースとなる状態を作れました。

このテーマのGood

関連記事も表示でき、人気記事はプラグイン(WordPress Popular Posts)をインストール・有効化するだけで最適化された表示ができます。

テーマのファイルサイズがコンパクトでいい感じです。ライセンスがGPLに準拠されています。

子テーマにてカスタマイズ

テーマファイルを直接書き換えると、後々の管理が大変になります。カスタマイズとメンテナンスを両立させるために、子テーマを使ってカスタマイズしています。

子テーマを設定するときも、functions.phpは使うことが推奨されています。

詳しくはこちらの記事をご覧下さい。

カスタマイズしたCSS

フォントの調整

日本語・欧文フォントにはこだわりがあります。昔 LaTexをやっていたので組版が好きなのです。読みやすさにこだわって調整しました。本当はWebフォントを使いたいのですが、表示速度を優先して、採用を見送りました。また、記事本文のマージン領域もちょっと工夫して見やすくしています。

参考にした記事はこちらです。

見出しの調整

見出し部分の文字サイズと並びも調整しています。文字と文字の間は少しゆったりにしています。

AmazonJS表示部分もカスタマイズ

テーマとは違いますが、Amazonのリンクを作成しているプラグイン AmazonJSのレイアウトも読みやすくなるように設定しています。

写真のレイアウト

写真はセンタリングの配置へ変更し、枠を書くようにしました。iPhoneのスクリーンショットなどを掲載した時に、背景と同化する場合があるためです。

パンクズ リスト

パンクズ リストの記事タイトル部分の表示も控えめに調整しました。

サブタイトル

スマートフォンでの表示にて、タイトルロゴとサブタイトルが窮屈だったため、配置を変更しています。

CSSソースコード

ロゴは変えずに

ロゴは愛着があります。そして、感謝しているので、変更していません。ロゴ誕生の秘話はこちらの記事をご覧下さい。

もう一つ、記事を読んで行かれませんか?

[amazonjs asin=”4844327518″ locale=”JP” title=”視覚マーケティング実践講座 ブログデザインで自分ブランドを魅せる”]

[amazonjs asin=”4844365711″ locale=”JP” title=”デザイナーのラフスケッチ デザインのアイデアを形にする過程”]

[amazonjs asin=”4416115016″ locale=”JP” title=”アートディレクションの「型」。: デザインを伝わるものにする30のルール”]

著者プロフィール

ものくろ(大東 信仁)
ものくろ(大東 信仁)
ブロガー・Web&Blogコーチ。親指シフト orzレイアウト開発者。ブログは月間65万PVを記録(2016年1月)。200回を超えるワークショップ開催・のべ1,000名のブログサポートに携わる。WordPressが得意。

詳しいプロフィールはこちら

もっと
ブログで情報発信
について読む