記事ページの更新マークに丸い背景をつける

マークに丸い背景をつける

Before

マーク変更前

After

マーク変更後

カスタマイズは自己責任でやろう!

「自己責任」の意味がわからない方、初めてカスタマイズする方はこちら

カスタマイズは自己責任。ぼくはこんな風に思っています。

カスタマイズをする準備

追加方法難しさ
追加CSS
テーマエディター
FTPソフト

はじめてカスタマイズをする方におすすめなのは追加CSSです。

カスタマイズを加速させる追加CSSブログのカスタマイズを加速させる「追加CSS」の使い方

カスタマイズのコード

コメントあり

コメントなし

うまくいったか確認

確認の手順

  1. カスタマイズコードを保存
  2. カスタマイズしたページを開く
  3. cntrl+F5を押す

いわゆるキャッシュ削除ですね。詳しい手順はこちらの記事で書いています。

カスタマイズはキャッシュ削除をマスターしてからです

MEMO
投稿日マークを変更する場合.updatedの部分を.pubdateに変更してください。PORIPUで表示される砂時計マークの場合は.fa-hourglass-halfに変更してください。

まとめ・雑談

まとめ

くま3号
なぁなぁ、このカスタマイズもあれやろ?
MENくん
はい!!サルワカさんを参考にしました!!!!

2 COMMENTS

なかたく

くまさんはじめまして!なかたくと申します。
記事を参考に更新マークに丸い背景をつけようと試みましたが、CSS編集で「padding: 3px;」の横に「!マーク」が表示されます。

それが原因なのか不明ですが丸い背景もつけれませんでした。

返信する
くまさん

オレンジ色の「!マーク」でしたら、幅を指定してるのに内側の余白を追加しちゃうとはみ出ちゃうよ!的な警告なので問題はないはずです。
ただ、丸い背景自体が出てこないのはちょっと見てみないとわからないですね…非公開サイトで無ければURLを教えていただけると嬉しいです。

よろしくお願いいたします。

返信する

コメントを残す

メールアドレスが公開されることはありません。