ヨメレバ・カエレバのデザインをCSSで変更するカスタマイズ！ - Yukihy Life
はてなブログだけでなく、アマゾンや楽天・ヤフーショッピングの商品を紹介する際にはブロガーのかん吉さんが作ってくださったサービス「ヨメレバ・カエレバ」を使うことで 簡単にリンクを作成することができます。 それらを綺麗に表示させるカスタマイズはもう出ているのですが、先日あるブロガーさんに会ったときにカスタマイズをしたら喜んでいただけたので、紹介したいと思います！ 参考リンク 実装図 カスタマイズの注意点 カスタマイズ PC スマホ レスポンシブ その他のカスタマイズ 最後に 参考リンク 今回のカスタマイズはほとんど今までやってこられていた方をちょっと変更したような形になっているため、あらかじめ参考リンクを貼っておきます。ありがとうございます！ shufulife.com 実装図 実際に導入した様子はこんな感じになります。 PC スマホ PCでバランスよく表示させたのと、スマホではなるべくコンパ
Table of Contents Plusの目次表示が崩れる時の対処方法
WordPress(ワードプレス)を使ってブログに「目次」を表示してくれる便利なプラグイン「Table of Contents Plus」と言うのがあります。 僕のブログでも使っていたのですが、表示が崩れると言う問題があったため最近は使用せずにいました。しかし、そのまま放置するのも良くないので原因を確認して修正しました。 その方法を書いておきますので良ければお役立てください。 Table of Contents Plusが崩れる 僕のブログはWordPress(ワードプレス)を使用しているのですが、記事の上の方に目次を設置しているのですが、ある時から表示が崩れています。 目次の表示には「Table of Contents Plus」と言うプラグインを使用しています。 目次の項目をクリックすると該当箇所にジャンプするし、「隠す」をクリックすれば目次が非表示になります。 動作は正常なので、スタ
CSSでリンク横に「参考・LINK」バッジをつけてみよう | vdeep
こんにちは、okutani(@okutani_t)です。今回は、リンク横にCSSでかわいいバッジをつける方法を解説いたします。 バッジを作るだけなので拍子抜けするぐらいかんたんです。CSSがあんまりよく分からない方でもコピペで作れますので、お気軽に試してみてください。 HTML+CSSで作っていくので、WordPress等のCMSでも同じように表示されるはずです。WordPressで運営している当サイトでも、本記事の方法でバッジを設置しています。 ではさっそくCSSでバッジをレイアウトしてみましょう。 スポンサーリンク バッジを並べるにはspanタグを使おう！ 文字の横に並べて何かを表示したいときは、spanタグを使うと良いです。 CSSでレイアウトできるように、classもつけておきましょう。 <span class="sankou-badge">参考</span> この右隣にテキストリ
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
