課題

CocoonテーマでMade in Heavenスキンを利用していますが、メインビジュアルのタイトルテキストの位置が背景の中央に置かれるために背景とタイトルテキストと重なってしまって醜い。

解決方法

css-custom.phpのhvn-header.messageを変更。

~/Local Sites/xxxxxx/app/public/wp-content/themes/cocoon-master/skins/skin-made-in-heaven/tmp/css-custom.php

変更前

.hvn-header .message {
color: #fff;
font-weight: bold;
display: grid;
inset: 0;
padding: 0 10px;
place-content: center;
position: absolute;
text-align: center;
z-index: 1;
}

変更後

.hvn-header .message {
color: #fff;
font-weight: bold;
display: grid;
inset: 0;
padding: 0 10px;
place-content: start center;
position: absolute;
top: 50px;
text-align: center;
z-index: 1;
}

style.css追加

直接css-custom.phpを直接変更することはバージョンアップ等で変更がリセットされてしまうのでStyle.cssに下記を追加する事に変更。

.hvn-header .message {
place-content: start center;
top: 50px;
}