読者です 読者をやめる 読者になる 読者になる

いつかギャフンと言わせたい

平凡な会社員が、いつか周りをギャフンと言わせるために日々スキルを磨くための記録。

【はてなブログ】「続きを読む」をよく見る感じに。

実はこのブログもちょくちょくカスタマイズしてます。自分が見やすいようにやっているのですが、まだまだたくさんやりたいことありますね。今回は「続きを読む」についてカスタマイズしてみました。デフォルトの続きを読むリンクは単なる文字リンクなのでわかりにくいし、味気ないのでね。

参考記事はこちら
blog.sumaho-design.com


こんな感じ↓になります。続きを読めば設定コードが!

以下のコードを「デザインcss」の中に貼り付けます。

/*続きを読むボタン*/
a.entry-see-more {
    word-wrap:break-word;
    border: solid 1px darkcyan;
    padding: 5px 20px;
    color:darkcyan;
    background:white;
    border-radius: 5px; 
}

/*続きを読むボタンのマウスオーバー*/
a.entry-see-more:hover {
    word-wrap:break-word;
    border: solid 1px darkcyan;
    padding: 5px 20px;
    color:white;
    background:darkcyan;
    border-radius: 5px; 
}


通常時
f:id:demacassette:20160121000128p:plain
マウスオーバー時
f:id:demacassette:20160121000138p:plain


どうすかね。ターコイズ(ダークシアン)という色が個人的に好きなので基調色にしてみてます。

他にも色はたくさんあり、コード内でどう入れていいかわからない時にはこちらを参照
www.tagindex.com


またカスタマイズしたらメモします。


はてなブログカスタマイズ一覧