ワードプレスcocoonをスマホでも綺麗に見せるccs追加

テンプレcocoon

2021.10.23

スマホも編集しなくては、タイトルやスタイルがはみ出てしまう！

これは覚えておかないと後でおかしなことになったときに消せなくなってしまうので、覚書！

ともみ

忘れっぽいし、メモしても無くしちゃうし！

やっぱりブログに残しておくのが一番だ💛

①ダッシュボードの中のテーマエディタを選択

②画面が移行したら右上の編集するテーマを選択で『cocoon child』を選択。ここ大事！

③スタイルシートの「@charset “UTF-8”;」から始まる部分は残して最下部に移動に下記をコピペ

/************************************
**モバイル表示　ヘッダーメニュー・検索アイコン
************************************/
.mobile-menu-buttons{
height:50px;
}
.mobile-menu-buttons > li {
padding-top:0;
}
.menu-button{
color: #90C31F!important;
margin: auto;
}
.mobile-menu-buttons .menu-button:hover{
background-color:white;
}
span.fas.fa-search::before{
margin-left:1em;
}
span.fas.fa-bars::before{
margin-right:1em;
}
.navi-menu-caption.menu-caption,.home-menu-caption.menu-caption,.search-menu-caption.menu-caption,.top-menu-caption.menu-caption,.sidebar-menu-caption.menu-caption{
display:none;
}