皆さん、三が日をどのようにお過ごしでしょうか?

僕は今日数時間かけて、このサイトのデザインを一新し、新規にTwitterとFacebookのアカウントを開設しました。

よかったらフォローしてください。

Twitter:https://twitter.com/tyu2_sem

Facebook:https://www.facebook.com/tyu2marketing/

Twitterは今の所アドテクからゲーム動画まで幅広く呟きますが、いずれはゲーム関連アカウントは別で運用します。

Facebookに関しては、基本的に自分のサイト上の投稿を連動させます。(Twitterもですが。)

スポンサーリンク

WordPressのテーマをSimplicityからStinger6へ変えたよ!

Stinger6の方がシンプルなデザインでやっぱり好きでした。

年始ということもあり、以前からやろうやろう思っていたデザインの変更を行いました。

以前(Simplicity)

スクリーンショット 2016-01-02 19.58.49

 

変更後(Stinger6)

スクリーンショット 2016-01-02 20.00.17

 

…よく比べたらあんま変わんねぇ…ww

でも、下の方がシンプルで僕は好きです。

また、ソースコード(phpとcss)がStingerの方が綺麗に書かれていて読みやすく、カスタマイズしやすいという点も合わさって変更に至りました。

心なしかSimplicityよりStinger6の方が軽い気がする

以前からStinger愛用していましたが、Simplicityより動作が軽いのが体感で分かります。

Stinger6のカスタマイズでやったこと

アコーディオンメニュー(ナビゲーションバー)への変更

Stinger6の場合、メニューを入れ子にしていると表示が崩れます。

そのため、以下のようにアコーディオンで表示できるようにカスタマイズしました。

スクリーンショット 2016-01-02 22.36.41

 

こちらのサイトを参考に作成しました。(というか、丸コピ)

http://creatorheart.com/web/stinger/stinger5-dropdownmenu/

フォントをGoogle webフォントに。(Roboto)

僕は見にくいフォントが大嫌いなので、最近流行りのGoogle fontsを導入しました。

参考:http://www.masalog.me/google-fonts/

この”Roboto”というフォントはlig.incでも使われているもので、細い繊細な感じが好きで選びました。

文字サイズ大きめに(17px)

Stinger6の元々のフォントサイズは13pxなので、見やすく変更しました。

行間広めに(30px)

行間も広めに取ってあります。

スマホで行間狭いと見にくく感じるので。

文字間隔広めに(2px)

文字間隔も広めにしました。

広告の位置をカスタマイズ

Simplicityを導入していた時はあまり意識していませんでした。(というか、カスタマイズが面倒で放置していました。)

Stinger6は簡単に広告(Google AdSense)の位置を変えられるので、変更しました。

今後Stinger6のカスタマイズでやること

各種SNSボタンの設置

せっかく各種SNSのアカウントを取得したので、今後の運用をより活発に行うためにもSNSボタンを実装してフォローしやすくします。

追尾SNSボタンの実装

サイドバーにシェアのためのSNSボタンを設置します。

 

カスタマイズ方法はほぼコピペです。

TechAcademyでWordPressを学ぶ

スポンサーリンク
dc10cb976749c0b7ee6399e332644afd_s

この記事が役に立ったらいいね!をしよう