ヘッダー右上に電話番号や画像を設置
functions.php
/* ロゴの横に表示 */
function my_lightning_header_logo_after() {
echo <<<EOM
<div class="logo-after">
<img src="http://xxx.jpg">
</div>
EOM;
}
add_action('lightning_header_logo_after', 'my_lightning_header_logo_after');
CSS
/* ロゴ右側のブロック */
.logo-after {
display: block;
width: 200px;
float: right;
}
.logo-after img {
max-height: 60px;
}
/* ヘッダー幅を100%に */
.navbar-header {
width: 100%;
}
@media (max-width: 991px) {
.logo-after {
width: 100%;
margin-top: 10px;
margin-bottom: 10px;
text-align: center;
}
}
/* 最新Verで追記 */
@media (min-width: 1200px) {
.gMenu_outer,
.gMenu,
.gMenu > li {
width: 100%;
}
}
@media (max-width: 1199.98px) {
.siteHeader_logo {
width: unset;
}
}