賢威７でスマホ表示時の記事投稿欄に枠線を付ける方法

こんにちわ！ひでゆきです^^(dehichan0728)

賢威の基本CSSでは、スマホ表示時に投稿記事一覧では枠なしで表示されます。

 

枠あった方が見やすいでしょ！

 

ということ個人的な考えで、カスタマイズしてみました！

 

あっ、別にそのままでいいでしょ、興味なし。という方は読まないでOKです。

時間の無駄です。笑

 

 

賢威の別のカスタマイズはこちらにもあります。

→賢威7にしたらGoogleアナリティクスに異変が起きた理由と解決策

→賢威7で記事の更新日を表示させる方法

 

 

カスタマイズする前にバックアップを取っておくことをオススメします。

WordPressにログインできなくなった！画面が真っ白になった！！

なんてこともカスタマイズしていると起きることなのでバックアップしてからにしましょう！！

 

 

賢威7でスマホ表示時の枠なしVer

 

続きを読む。があるので一応、記事との境目はあるのですが

 

個人的には枠で仕切ってあった方が見栄えがいいんじゃない？？

 

ということで、カスタマイズも30秒でできちゃうのでやってみました！！

 

賢威7でスマホ表示時の枠ありVer

 

どうでしょうか。

 

記事一覧に枠があった方が方が見やすくないですか？？

個人の好みによりますが、私は記事に枠あった方がいい派です。

 

では、30秒でできちゃうカスタマイズコードを紹介します！！

コピペでOKなので、初心者でも安心よ。

 

賢威7でスマホ表示の記事に枠を付ける手順

ダッシュボード「外観」→「テーマの編集」

 

一番下までスクロール「rwd.css」クリック！！

 

「rwd.css」の中からこのコードを探します。

上から下までスクロールして探すのでもいいけど、1発で見つける機能を紹介します。

 

「Ctrl+F」で単語検索機能が発動されます。

コードを探すときはこの機能を使えば時間短縮&イライラしなくて済みます！！

 

先ほどのコードを「rwd.css」の中から探して、以下のコードに変更します。

 

それだけで、この記事枠を設定することができます！！

はい、めちゃくちゃ簡単です。

 

カスタマイズの一例なので、枠や余白の調整はそれぞれのサイトで違うかもしれませんので、調整しながらやってみてください！

 

 

まとめ

賢威は時代の変化があっても変化をしていってくれるので、使っていて不便はあまり感じません。

導入しただけの状態でも使えるクオリティなのも、初心者には嬉しいです。

 

細かい変更も、今回紹介したような簡単な手順でできるのでチャレンジしてみてください！