グローバルメニューの幅を自動調整する方法

ブログのコンテンツがまだ少なくてグローバルメニューの

文字が左 に片寄って見えてしまっていたので、

自動的に各項目の幅を調節して均等になる様に

これを

こうゆう風に・・・

カスタマイズしてみました。

 

• 作業は簡単ですので皆様にもおすすめです。

今回は賢威6.2のヘルシー版で説明しています。

 

それではレッツポジティブではなくて(゜∀。)ﾜﾋｬﾋｬﾋｬﾋｬﾋｬ
レッツカスタマイズです。　

 

まず、ワードプレスの管理画面から

外観→テーマ編集をクリックします。

 

画面を下にスクロールしていくと右側にスタイルシートという文字

がありますので、それのもう少し下にある

design.css （でざいん　どっと　しーえすえす）という
項目をクリックします。

 

すると、
プログラムの書かれたページが表示されますので
すべてをコピーしてメモ帳などに貼り付けて
バックアップをとっておきます。

 

ポイント

コピーする部分のどこでもいいので
一度クリックしてからCTRL＋Ａを
押すとすべてが選択されますので
コピー漏れが防げます。

 

もし間違ってプログラムの一部を
消去してしまうとブログがうまく表示
されなくなりますので必ず
バックアップをとるようにしましょう。

 

バックアップがとれたら一番下までスクロールして
このタグをコピペで貼り付けてください。

#global-nav ul{

display: flex; /*フレキシブルボックス*/

text-align: center; /*センタリングするかどうか*/

}

#global-nav ul li{

width: 300px; /*幅の最大値*/

}


貼り付けられたらファイルを更新をクリックします。


 

 

 

 

 

どうでしょう？うまくカスタマイズできたでしょうか？

 

他にも文字の大きさや色を変えたり背景の色を変えたりと
自分ごのみに変えることができますので

 

簡単なとこから自分だけのブログ作りに
挑戦してみてはいかがでしょか。

 

いつもあなたを応援しています。
最後まで読んで頂きありがとうございました。