こんにちは
提示のサイトにはバナー画像はないようですが、どの部分のことでしょうか？
画面上部のスライドする画像（スライドショー）の場合は、カスタマイズの「注目の投稿スライダー」より設定することができます。
投稿がグリッド状に表示されている部分の場合は、カスタマイズの「ブログ設定」で「3カラムギャラリー」を選択するとできます。
こんにちは
ご回答ありがとうございます。
提示のサイトはブログ設定のみなんですね。
プラグインでバナー画像を掲載することはできるんでしょうか？
BusinessPressのテーマは、背景が暗くなっていまい、レスポンシブもうまくできないもので・・・
いいプラグインがなければ、スライドショーではなくても画像単体でも最悪問題ないのですが、ホームのトップにバナーとしてとりあえず画像を載せたいのですが、固定ページで編集した場合どうしてもメニューと掲載した画像の間に隙間が空いているのが気になっています。
何かいい方法がありましたらご教授ください。
背景が暗くなっていまい、
下記 CSS をカスタマイズの [追加 CSS] に追加すると、暗くならなくなります。
.jumbotron-overlay {
background-color: rgba( 0, 0, 0 , 0 );
}
レスポンシブもうまくできないもので・・・
どのようにうまくいかないのでしょうか？
隙間が空いているのが気になっています。
どこの隙間でしょうか？
レスポンシブについて上手くいかないことは、画像の比率を一定に保てないことです。掲載したい画像は、どの端末でもしっかり１６：９で表示させたいと考えています。もし、CSS設定のみで一定に保つことが出来れば、そのまま使用しようと考えています。
隙間が空いている件については、もし固定ページに画像を載せた場合の話です。そのときは、上のメニューと固定ページに載せた写真の間に隙間が出来てしまうということです。
掲載したい画像は、どの端末でもしっかり１６：９で表示させたいと考えています。
下記の CSS ではどうでしょう？
.jumbotron {
background-size: 100% auto;
background-position: 0 0;
background-repeat: no-repeat;
padding-bottom: calc(100%*9/16); /* 16:9 */
}
.jumbotron-overlay {
height: 0;
}
固定ページに画像を載せた場合の話です。そのときは、上のメニューと固定ページに載せた写真の間に隙間が出来てしまうということです。
メニューと固定ページの間にはヘッダー画像があると思うのですが、ヘッダー画像と固定ページの間の隙間ということでしょうか？この場合は下記 CSS で隙間はなくなると思います。
.site-header {
margin-bottom: 0;
}
返信ありがとうございます。
教えていただいたCSSを適用したところ、ホームページヘッダーではなく通常のヘッダーに適応されていました。私の説明不足で申し訳ございません。
ホームのみ表示されるヘッダーを変更したいと考えております。
BusinessPressですと、『ビジネスサイト向け無料WordPressテーマ』と記載されている画像ヘッダーに適応させたいと考えています。
https://businesspress.jp/
WordPress編集素人のため、ご迷惑をおかけします。
ホームのみ表示されるヘッダーを変更したいと考えております。
ホームページヘッダーの場合は、
.home-header {
background-size: 100% auto;
background-position: 0 0;
background-repeat: no-repeat;
padding-bottom: calc(100%*9/16); /* 16:9 */
height: 0;
}
.home-header-overlay {
background-color: rgba( 0, 0, 0 , 0 );
}
ありがとうございます。
無事解決できました。
色々と丁寧に教えていただきありがとうございました。
