キャリコ

WordPress や STINGER5 のカテゴリを中心に徒然なるままに綴る個人ブログ「 Calico 」です。

SIMPLESTER の誰にも気づかれない自己満足カスタマイズ

   

SIMPLESTER の誰にも気づかれない自己満足カスタマイズ

あまりカスタマイズするところがなかった、キャリコ( @calicocatxyz )です。

それだけ SIMPLESTER が素晴らしいってことになるんだと思うけど、誰にも気づかれない自己満足カスタマイズシリーズは継続していきます。今回は SIMPLESTER というよりも STINGER5 のカスタマイズに近いです。

それじゃあラテ、よろしくね♪

ラテ

こんにちは、ラテにゃ。

ブログデザインを変更する前にやっていたカスタマイズを、SIMPLESTER に適用させたのがほとんどにゃ。大きな変更点はないけど細かい部分でカスタマイズしたところを紹介していくにゃ。

Ads by Google

SIMPLESTER カスタマイズ

スマホ表示の padding 変更

これは先日やったばかりだけど予想外のリアクションがあって、SIMPLESTER の導入を見送っていた人が意外といたみたいにゃ。キャリコはスマホからのアクセスが50%を超えるから、すぐに対応する必要があったにゃ。

STINGER5 の子テーマ「 SIMPLESTER 」を導入する時の注意点

これからのカスタマイズが楽しみ、キャリコ( @calicocatxyz )です。 …

calico.xyz

ぱんくずリストの余白調整

ぱんくずリストの余白調整

スマホ表示の padding を変更したときに気になったのが、ぱんくずリストの余白にゃ。カテゴリの子孫が多くなると2行になって上下がくっついてしまうにゃ。これはカテゴリリンクの下部に margin を設定して調整したにゃ。

詳細に関してはスマホ表示の padding を変更した記事に書いてあるから、気になる人は参考にしてみるといいにゃ。

記事のホバーエフェクトのアイコン変更

記事のホバーエフェクトのアイコン変更

トップページの新着記事、サイドバーの新着記事、単一記事の下部にある関連記事のホバーエフェクトのハートのアイコンを肉球にしたにゃ。メインカラーは赤から青に変更して、ブログデザインを変更する前の雰囲気を引き継いだにゃ。

カテゴリのデザイン変更

元々のデザインもカッコよかったんだけど子孫カテゴリが増えてしまうと、ホバーエフェクトが大変なことになっちゃうから変更したにゃ。これもブログデザインを変更する前の仕様を導入しただけにゃ。

STINGER5 のカテゴリ名と件数をカスタマイズする方法

ちょいちょい英語の勉強をしてるキャリコ( @calicocatxyz )です。 …

calico.xyz

タグのデザイン変更

これは CSS の適用を外してとりあえずの見た目を整えてあるだけにゃ。良いアイディアが思い浮かばずに放置してるんだけど、何か閃いたらそのうちカスタマイズしようと思っているにゃ。

STINGER5 カスタマイズ

ヘッダー画像の削除

これはブログデザインを変更する前と同じ理由で削除したにゃ。削除する前は画像がなくて違和感があったけど、ないのに慣れると今度は表示されているのが変な感じがしたにゃ。理由はこちらを参考にしてほしいにゃ。

キャリコのこれはさすがに気づかれる自己満足カスタマイズ

もうないかなって思ったけど意外とすぐの更新、キャリコ( @calicocatxy …

calico.xyz

トップページのサイドバーの新着非表示

トップページには新着記事が表示されているけど、サイドバーにも同じ内容のものが表示されるから非表示にしたにゃ。これはブログを開設してから早い段階で導入したんだけど、今でも必要はないと思っているにゃ。

STINGER5 の新着記事をトップページだけ非表示にする方法

イギリスの寒さが厳しくなってきました、キャリコ( @calicocatxyz ) …

calico.xyz

現在表示中の記事を新着記事一覧から非表示にする

トップページのみサイドバーの新着記事を非表示にしたから、もちろん単一記事では表示されるんだけど、今見ている記事が新着記事だった場合に同じものが表示されていても重複してしまって意味がないにゃ。

【STINGER5】現在表示中の記事は新着記事一覧へは非表示にする

STINGER5ではサイドバーに新着記事が表示されるようになっていますね。図のようにデフォルトでは記事と新着一覧が重複してしまいます。今回ご紹介するのは今現在見ている記事は、New … more

shufulife.com

ページトップのアイコンを肉球に変更

これもブログデザインを変更する前からやっていて、右下にあるページトップに戻るボタンのアイコンが肉球になっているにゃ。もうこの場所にあるアイコン = ページトップに戻るっていうのは広く認識されていると、、思うにゃ。

キャリコの誰にも気づかれないこっそり自己満足カスタマイズ

いつの間にかシリーズ化、キャリコ( @calicocatxyz )です。 自己満 …

calico.xyz

コメント欄を削除

コメントがついてもそのほとんどがピンバックだし、一時期スパムに悩まされたっていうのもあるけど、キャリコではだいぶ前からコメント欄を非表示にしているにゃ。でもスパムはプラグインで解決することも出来るみたいにゃ。

検索ボタンの色変更

これもデザインの変更をする前からやっているカスタマイズで、検索ボタンの色をメインカラーにしているにゃ。今ブログを確認してみたら開設してすぐに書いた記事で紹介してあったにゃ。懐かしいにゃ~

STINGER5 の原型を崩さずに細かい部分をカスタマイズしてみた

1日に心電図と血圧と採血が3回もあって、げんなり中のキャリコ( @calicoc …

calico.xyz

次の記事と前の記事のデザイン

次の記事と前の記事のデザイン

これは前からずっとやりたかったカスタマイズにゃ。今のところパソコン表示のみ実装したけど、近いうちにスマホにも適用させるつもりにゃ。せっかくだから SIMPLESTER のホバーエフェクトを採用しているにゃ。

【WordPress】前の記事・次の記事にサムネイル画像を表示する

画像のように前の記事と次の記事のナビゲーションにサムネイル画像を表示する方法のご紹介です。最新の記事と最古の記事には【ホームへ戻る】のボタンを設置しています。少しでもサイトを訪れて … more

shufulife.com

アドセンスのダブルレクタングル

SIMPLESTER は 336px × 250px のアドセンスを記事下に2つ並べて表示が出来る横幅になっているにゃ。だから前に書いた記事のソースをコピペするだけで、超カンタンにダブルレクタングルにすることが出来たにゃ。

STINGER5 の記事下にダブルレクタングルをキレイに表示させる方法

絶賛求職中のキャリコ( @calicocatxyz )です。 就職難なんて言葉ど …

calico.xyz

関連リンク
収益力向上に役立つアドセンスの最適化は公式ブログに全部書いてあった
アドセンスの最適なレイアウトはサイトのジャンル別でヘルプページに全部書いてあった
Google アドセンスが公式ブログでオススメするスマホ向けサイトに最も合った設定の仕方

シェアボタンの変更

シェアボタンの変更

これもちゅんこ( @shufulife )さんのカスタマイズを参考に、、っというか真似させてもらったにゃ。キャリコでは float を使わずに table-cell を使って配置してあるにゃ。今は試験的に Pocket のボタンを採用してないんだけど、不便かにゃ?どうかにゃ??

まとめ

以上が SIMPLESTER を導入してからの自己満足カスタマイズになるにゃ。今後は細かい部分をさらに修正して、スマホのデザインに集中していこうと思うにゃ。

今日はここまで、じゃあにゃ~

ライター紹介

ラテ Web 担当、SNS 広報、イメージキャラクター

スコティッシュフォールドの女の子。主に Web 系のネタを中心にお届けする IT にゃんこです。

 - SIMPLESTER

この記事が気に入ったら
いいね!しよう

キャリコの最新情報をお届けします

Twitter でキャリコをフォローしよう!

【キ】 アドセンス用336px

【キ】 アドセンス用336px

  関連記事

STINGER5 の子テーマ「 SIMPLESTER 」を導入する時の注意点
STINGER5 の子テーマ「 SIMPLESTER 」を導入する時の注意点

これからのカスタマイズが楽しみ、キャリコ( @calicocatxyz )です。 …

STINGER5 を手軽にデザインするなら SIMPLESTER がオススメ!
STINGER5 を手軽にデザインするなら SIMPLESTER がオススメ!

装いを新たに、キャリコ( @calicocatxyz )です。 さて、ご覧の通り …