ワードプレスのヘッダー設定において、cocoonを使用していますが、左寄せにヘッダー画像を配置する方法が容易にわかりました(ヘッダー設定から配置します)。しかし、もう一つ別の画像をヘッダーと並行に右寄せで入れたいです。その方法を教えていただけますか?

ワードプレスのヘッダー設定において、cocoonを使って左寄せにヘッダー画像を配置する方法については理解されたようですね。別の画像をヘッダーと並行に右寄せで配置する方法を教えます。

1. ワードプレスのダッシュボードにログインし、コンテンツ→カスタマイズを選択します。
2. カスタマイザーが表示されたら、テーマのオプションをクリックします。
3. オプションの中に「ヘッダーイメージ右寄せ」という項目がある場合は、それを選択し、右寄せにしたい画像をアップロードします。この方法で設定できない場合は、別の方法を試してください。
4. もしヘッダーイメージ右寄せのオプションがない場合は、カスタムCSSを使って画像を右寄せにすることもできます。カスタムCSSに次のコードを追加します。

“`css
.site-branding {
display: flex;
justify-content: space-between;
}

.site-branding img:nth-child(2) {
margin-left: auto;
}
“`

このコードは、「site-branding」というクラスが付いた要素内の画像を右寄せにするためのものです。もしクラス名が異なる場合は、適宜修正してください。

上記の手順を実行することで、ワードプレスのヘッダーに複数の画像を左右に配置することができます。どうでしょうか?ご質問があればお知らせください。

コメントを残す