{"id":5477,"date":"2019-07-26T11:34:25","date_gmt":"2019-07-26T05:49:25","guid":{"rendered":"https:\/\/docs.blossomthemes.com\/docs\/blossom-pinthis-documentation\/homepage-settings\/how-to-configure-banner-section\/"},"modified":"2020-09-01T16:29:46","modified_gmt":"2020-09-01T10:44:46","slug":"how-to-configure-banner-section","status":"publish","type":"docs","link":"https:\/\/docs.blossomthemes.com\/blossom-pinthis\/homepage-settings\/how-to-configure-banner-section\/","title":{"rendered":"How to Configure Banner Section?"},"content":{"rendered":"<p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-5482\" src=\"https:\/\/docs.blossomthemes.com\/wp-content\/uploads\/2019\/07\/bannrt.png\" alt=\"Site Banner\" width=\"1246\" height=\"918\" srcset=\"https:\/\/docs.blossomthemes.com\/wp-content\/uploads\/2019\/07\/bannrt.png 1246w, https:\/\/docs.blossomthemes.com\/wp-content\/uploads\/2019\/07\/bannrt-300x221.png 300w, https:\/\/docs.blossomthemes.com\/wp-content\/uploads\/2019\/07\/bannrt-768x566.png 768w, https:\/\/docs.blossomthemes.com\/wp-content\/uploads\/2019\/07\/bannrt-1024x754.png 1024w\" sizes=\"(max-width: 1246px) 100vw, 1246px\" \/><\/p>\n<p>You can choose a static image, video, or a slider as your banner. The banner will be displayed at the top of your website.<\/p>\n<p class=\"blue note\"><strong>Note<\/strong>: If you have added a video, the image will not be displayed. You can either use an image or a video in the banner section at a time. In the mobile view, the video will not be displayed to save bandwidth, instead, the fallback image will be displayed. So we recommend you to add a banner image as well.<\/p>\n<p>To set up your banner:<\/p>\n<ul>\n<li>Log in to WordPress Admin Panel<\/li>\n<li>Go to\u00a0<strong>Appearance &gt; Customize &gt; General Settings &gt; Banner Section<\/strong><\/li>\n<li>Choose either\u00a0<strong>Banner as Slider, Static\/Video Banner, or Disable Banner<\/strong>\u00a0(if you do not want banner at all)<\/li>\n<\/ul>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-5481\" src=\"https:\/\/docs.blossomthemes.com\/wp-content\/uploads\/2019\/07\/banner-settings.png\" alt=\"choose the banner \" width=\"275\" height=\"407\" srcset=\"https:\/\/docs.blossomthemes.com\/wp-content\/uploads\/2019\/07\/banner-settings.png 275w, https:\/\/docs.blossomthemes.com\/wp-content\/uploads\/2019\/07\/banner-settings-203x300.png 203w\" sizes=\"(max-width: 275px) 100vw, 275px\" \/><\/p>\n<h2><span id=\"Banner_as_Slider\"><strong>Banner<\/strong> as<strong> Slider<\/strong><\/span><\/h2>\n<ul>\n<li>Log in to WordPress Admin Panel<\/li>\n<li>Go to\u00a0<strong>Appearance &gt; Customize &gt; General Settings &gt; Banner Section<\/strong><\/li>\n<li>Choose\u00a0<strong>Banner as Slider<\/strong><\/li>\n<\/ul>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-5479\" src=\"https:\/\/docs.blossomthemes.com\/wp-content\/uploads\/2019\/07\/banner-as-slider.png\" alt=\"Banner as slider\" width=\"344\" height=\"436\" srcset=\"https:\/\/docs.blossomthemes.com\/wp-content\/uploads\/2019\/07\/banner-as-slider.png 344w, https:\/\/docs.blossomthemes.com\/wp-content\/uploads\/2019\/07\/banner-as-slider-237x300.png 237w\" sizes=\"(max-width: 344px) 100vw, 344px\" \/><\/p>\n<ul>\n<li>Select either\u00a0<strong>Latest Posts or Category<\/strong>\u00a0to be displayed in your Banner section<\/li>\n<li>Enter the Number of Slides that you want to display<\/li>\n<li>Click on\u00a0<strong>Publish<\/strong><\/li>\n<\/ul>\n<p class=\"blue note\">Note: Before you choose <strong>Latest Posts or Category<\/strong> to be displayed in the Banner section, you have to create enough posts and categories. You can add posts and category via <strong>Posts &gt; New Post<\/strong> and <strong>Posts &gt; Category<\/strong>. If there are not enough posts or categories, a grey image will be displayed in the banner section.<\/p>\n<h2><span id=\"Static_Image_or_Video_Banner\"><strong>Static Image or Video Banner<\/strong><\/span><\/h2>\n<ul>\n<li>Log in to WordPress Admin Panel<\/li>\n<li>Go to\u00a0<strong>Appearance &gt; Customize &gt; General Settings &gt; Banner Section<\/strong><\/li>\n<li>Choose\u00a0<strong>Static\/Video Banner<\/strong><\/li>\n<\/ul>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-5480\" src=\"https:\/\/docs.blossomthemes.com\/wp-content\/uploads\/2019\/07\/banner-as-video.png\" alt=\"Banner as video\" width=\"341\" height=\"745\" srcset=\"https:\/\/docs.blossomthemes.com\/wp-content\/uploads\/2019\/07\/banner-as-video.png 341w, https:\/\/docs.blossomthemes.com\/wp-content\/uploads\/2019\/07\/banner-as-video-137x300.png 137w\" sizes=\"(max-width: 341px) 100vw, 341px\" \/><\/p>\n<ul>\n<li>Click on\u00a0<strong>Select Video<\/strong>\u00a0to upload the video of your choice to the banner section or you can also\u00a0<strong>enter a YouTube URL<\/strong>\u00a0of the video.<\/li>\n<li>If you want to display a static image, click on\u00a0<strong>Add new image<\/strong>\u00a0to upload the desired picture as a banner image<\/li>\n<li>Enter the\u00a0<strong>Title\u00a0<\/strong>and\u00a0<strong>Subtitle\u00a0<\/strong>for Banner section<\/li>\n<li>Enter the\u00a0<strong>Banner Label\u00a0<\/strong>and\u00a0<strong>Banner Link<\/strong><\/li>\n<li>Click on\u00a0<strong>Publish<\/strong><\/li>\n<\/ul>\n","protected":false},"excerpt":{"rendered":"<p>You can choose a static image, video, or a slider as your banner. The banner will be displayed at the top of your website. Note: If you have added a video, the image will not be displayed. You can either use an image or a video in the banner section at a time. In the [&hellip;]<\/p>\n","protected":false},"featured_media":0,"parent":5472,"menu_order":1,"comment_status":"open","ping_status":"closed","template":"","doc_tag":[],"class_list":["post-5477","docs","type-docs","status-publish","hentry"],"comment_count":0,"_links":{"self":[{"href":"https:\/\/docs.blossomthemes.com\/wp-json\/wp\/v2\/docs\/5477"}],"collection":[{"href":"https:\/\/docs.blossomthemes.com\/wp-json\/wp\/v2\/docs"}],"about":[{"href":"https:\/\/docs.blossomthemes.com\/wp-json\/wp\/v2\/types\/docs"}],"replies":[{"embeddable":true,"href":"https:\/\/docs.blossomthemes.com\/wp-json\/wp\/v2\/comments?post=5477"}],"version-history":[{"count":0,"href":"https:\/\/docs.blossomthemes.com\/wp-json\/wp\/v2\/docs\/5477\/revisions"}],"up":[{"embeddable":true,"href":"https:\/\/docs.blossomthemes.com\/wp-json\/wp\/v2\/docs\/5472"}],"next":[{"title":"How to Change Pagination Style?","link":"https:\/\/docs.blossomthemes.com\/blossom-pinthis\/homepage-settings\/how-to-change-pagination-style\/","href":"https:\/\/docs.blossomthemes.com\/wp-json\/wp\/v2\/docs\/5484"}],"prev":[{"title":"How to set up the Front\/Landing\/Home page?","link":"https:\/\/docs.blossomthemes.com\/blossom-pinthis\/homepage-settings\/how-to-set-up-the-front-landing-home-page\/","href":"https:\/\/docs.blossomthemes.com\/wp-json\/wp\/v2\/docs\/5473"}],"wp:attachment":[{"href":"https:\/\/docs.blossomthemes.com\/wp-json\/wp\/v2\/media?parent=5477"}],"wp:term":[{"taxonomy":"doc_tag","embeddable":true,"href":"https:\/\/docs.blossomthemes.com\/wp-json\/wp\/v2\/doc_tag?post=5477"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}