BLOG

TCD COREをベースにブログデザインをカスタマイズしてみたよ。Googleマップのレスポンシブ化、twitterの埋め込みなど。

今年に入ってから、TCDのCOREというブログテーマを使っています。

WordPressテーマ「CORE (TCD027)」

これまでにCOREについて書いた記事はこちら。
関連記事:ブログのテーマを変更しました。レスポンシブデザインってほんとうにいいものですね。 | darmus.net
関連記事:TCDのWordPressテーマ「CORE」の素晴らしいところ、惜しいところ | darmus.net

上の記事では「惜しいところ」なんて書いたけど、けっこうこのテーマは使いやすいと思います。
アップデートのたびに使いやすくなっていっているし、満足度高いです。

今回の見直しでデザイン変更した主な部分は以下のとおりです。

グローバルメニューの配色を見なおし

今回一番ガラッと変えたのはブログトップのグローバルメニュー。

これまでは赤色一色でしたが、ここをスマートな配色に変更しました。
自分のセンスで配色すると間違いなくヘンテコリンになるので、下の参考リンク先でいろんな配色見本をみながら、各カテゴリへのイメージに近い色を割り当てました。

参考:カラー配色で迷わない!シーン別配色見本32パターン | Web制作会社スタイル

自分のセンスでは絶対に出てこない色の組み合わせがじゃんじゃん紹介されているので、とても役立ちました。

一方で、これまでメインで使っていた赤色はきらいじゃないので、リンクの強調や反転カラーとして残してあります。
以前は全面的に赤色が出ていたけど、見直し後の使い方だと差し色みたいになっています。
むしろこっちのほうがシャレオツだわー。

トップページスライダーは外しています

トップページスライダーは、ブログ自体がとても重くなるので外して様子をみています。
機能としてはとても魅力的だと思います。

またそのうち復活するかも。

twitterアカウントをウィジェットとして埋め込み

ふとした思いつきから、twitterのウィジェットを埋め込みました。
ぼくの中でのtwitterブームは2013年ごろにいったん終了していて、いまのアカウントはブログを始めた時に作りなおしたもの。
はじめは大して使っていないアカウントだったけど、最近は断片的な考えを投げ込んだりしています。

ふだんはあんまり大事じゃないけど、あるとおもしろいので、下の方にスクロールすると発見できるようになっています。

ちなみに以前記事で書いた「テキスト」のウィジェットでつくりました。
関連記事:WordPressの「テキスト」ウィジェットをつかっておすすめ記事への画像リンクをブログの好きなところに配置する方法 | darmus.net

埋め込みのGoogle Mapをスマホでみた時にレイアウトが崩れていたのでレスポンシブ化

このブログはよく記事の中にGoogleマップを埋め込んでいます。

これまではスマホでみるとレイアウトが崩れていて大変見にくかったですが、今回以下のサイトを参考にしてGoogleマップをレスポンシブ化しました。
参考:【コピペOK】GoogleMapの地図をレスポンシブサイトに埋め込む方法

これ、ぼく自身ずーっと前から気がついていて、でもなかなか修正作業が大変そうだったので腰が重かったもの。

今回は一念発起してこの部分も修正。
かなりすっきりしました。

まとめ: ブログデザインはこれからもどんどん変えていきたい。

今回はなかなか良い感じにまとめることができました。
手をかければかけるほどブログにますます愛着が湧いていい感じです。
あとはロゴくらいですかね……。シャレオツなロゴつくりたいなー。

おんなじデザインをずーっと変えないでいると自分が飽きちゃうので、これからも定期的に見直していきたいと思います。

TCDのブログテーマ「CORE」が気になる方はこちらからどうぞ!

WordPressテーマ「CORE (TCD027)」


このブログと、書いているひとについてはこちらへどうぞ。

紹介したスポットを記事リンク付きでまとめたGoogleマイマップはこちらです。

これまでの旅行記のまとめ記事はこちらから。


当ブログでは TCDのWordPressテーマ「CORE」を使用しています。



関連記事

  1. ブログ執筆環境は続けやすさが大事
  2. WordPressブログを海外から更新するにはセキュリティ設定の…
  3. Quicklyticsはアクセス解析アプリの決定版!カスタマイズ…
  4. 新しいGoogleアナリティクス の「マイレポート」の編集方法。…
  5. 記事の追いかけ更新中。ガッツリ長い記事とショートで軽い記事、メリ…
  6. ブログタイトルにハッシュタグを入れるという試みについて。これから…
  7. ブログをやってなかったら北海道を車中泊で駆け抜けるなんてことして…
  8. Embedlyにユーザ登録したら使えるオプションが増えてちょっ…

これまでの旅行記 まとめ

travel summery

オーブン料理 チャレンジまとめ

oven challenge summery

パン屋さん巡り 記事まとめ

bread move around summery

山登り 記事まとめ

mountaineering summary

フジロック 記事まとめ

fujirock summery

ブログで紹介したスポット

mymap

twitterはこちら

PAGE TOP