Frontier9

ゲーム、ガジェット、スマホ決済、予約サービス、時事ニュースなどを中心とした個人メディアブログ

WordPress

ブログのトップページをカテゴリー別にし、横並びデザインにした

更新日:

このブログ「Frontier9」のデザインをようやく少し変えました。

何でも形から入るタイプなので、テーマのデフォルトでは満足できないタイプです。

今回細かく変えたわけではないですが、トップページの記事一覧をカテゴリー別にし、2列の横並びデザインにしたので結構印象が変わったと思います。

このデザインレベルならメチャクチャ簡単に出来ます。

 

というわけでそのへんのお話を少し書いていきます。

ブログのトップページをカテゴリー別にし、横並びデザインにした

【Before】

【After】

ヘッダーやメニューバーもちょこっと変えましたけど、まだまだデザインをイジるところはいっぱい。

アイキャッチ画像サイズ、記事一覧の記事タイトルの大きさ、キャプションの文字数とかとか。

今後ゆっくりデザインも変えていきます。

 

「WING」というテーマがすごく楽!

今回はCSS編集(子テーマなど)での変更点はほぼなく、WordPressのダッシュボード内で完結しています。

このカテゴリー横並びの記事一覧も全部記事編集画面で作成したものです。

 

デザインカスタマイズが楽

このブログではWING(STINGER PRO2版)を使っているんですが、このテーマデザインのカスタマイズがまじで楽。

ダッシュボードにあるカスタマイズでほとんど出来るって言っていいくらいイジれる。

 

Hタグのデザイン、場面ごとの文字サイズ、様々なカラー変更も手軽にできます。

デザインが苦手な人でもやり方を調べながらではなく感覚でできるんじゃないかな。

 

自分は別のブログではしっかりCSSの方でも編集したりして構築していますが、別にそれをしなくてもいいくらい基礎が備わってるし、少し人より差を出したいくらいの人であれば十分。

 

最近はAFFINGER5というのも出ていて、そっちを新しく買おうかも考え中。

WordPressテーマ 「WING(AFFINGER5)」

 

記事を書くのも楽

今回はデザインの話を書いていますが、記事を書く際もかなり楽です。

カスタマイズボタンも記事編集画面で簡単に入れられるのもかなり使えます。

「詳しくはこちら」とかリンクを目立たせたいときにも、選んで使うだけ。

詳しくはコチラ

こういうのが慣れれば10秒くらいで出来ます。

画像をきれいに横並びにするのも簡単ですし、スマホにだけ表示したいものやPCだけに表示したいものなども選んで使うだけなんで早い。

もちろんアドセンスなどもショートコードで入れられる。

吹き出しも設定さえすれば簡単に使えます。

 

ちなみにこのブログの横並びのカテゴリー別記事一覧は記事の編集画面で作りました。

【WordPress】トップページの記事一覧をカテゴリー別で横並び2列表示させるやり方

 

SEO対策も標準装備

アクセスアップに重要な機能(SNSボタン、ディスクリプション、メタキーワード等)もしっかりしてます。

上位サイトでも結構このテーマのブログを目にしますね。

素人でも結構やれる印象です。

 

AMPも対応

最近AMPの対応も検討したりしている方もいらっしゃると思いますが、このテーマでも対応しています。

ブログ全体をAMP化することも出来るし、選んだ記事をAMP表示出来るようにすることも出来る。

AMPとかブログ始めたばっかりの人はわかんないですよね。

 

まとめ

いつの間にかWINGをおすすめする記事になってしまいましたが、まぁそれくらい簡単にできたことにびっくりしたっていうことですかね。

別に「テーマは買ったほうがいいぜ」っていう話じゃないです!笑

実際無料で配布されているテーマを使ったブログでガンガン稼いでる人もいますし、自分も無料のテーマで1日100万円とか言うぶっ飛んだ記録を出したこともあります。

 

基本的にはブログを始めたばかりの方は安定するまでデザインはイジらないほうがいいですしね。

自分はCSSの編集に関しては完全素人で、編集しながら調べて解決していく形をとってやってきたので、過去のブログのデザインはめちゃくちゃ時間がかかりました。

今でこそ知識も増えてきたのもあるし、過去に作成したテンプレートから参考にして編集したりすることで時短ができていますが、未だに何かに引っかかったら解決するまでやめられない質なので厄介ですね。
それだけで1日潰れるのはザラです。

それでも少しくらいブログに愛着を湧かせたいと思うので、簡単な色の変更や文字のサイズなどダッシュボードで出来る範囲は時間がある方はやってみてください。

デザインより記事更新。

これは前提でやりましょう!

-WordPress

Copyright© Frontier9 , 2019 All Rights Reserved Powered by STINGER.