{"id":5229,"date":"2022-02-14T19:28:41","date_gmt":"2022-02-14T19:28:41","guid":{"rendered":"https:\/\/d-themes.com\/wordpress\/udesign\/documentation\/?p=5229"},"modified":"2022-12-07T20:03:08","modified_gmt":"2022-12-07T20:03:08","slug":"banner","status":"publish","type":"post","link":"https:\/\/d-themes.com\/wordpress\/udesign\/documentation\/2022\/02\/14\/banner\/","title":{"rendered":"Banner"},"content":{"rendered":"\n<p>UDesign offers <strong>Banner<\/strong> element. With this widget, you can build page beautifully.<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img fetchpriority=\"high\" decoding=\"async\" width=\"1024\" height=\"397\" src=\"https:\/\/d-themes.com\/wordpress\/udesign\/documentation\/wp-content\/uploads\/sites\/17\/2022\/02\/banner-1-1024x397.jpg\" alt=\"\" class=\"wp-image-8329\" srcset=\"https:\/\/d-themes.com\/wordpress\/udesign\/documentation\/wp-content\/uploads\/sites\/17\/2022\/02\/banner-1-1024x397.jpg 1024w, https:\/\/d-themes.com\/wordpress\/udesign\/documentation\/wp-content\/uploads\/sites\/17\/2022\/02\/banner-1-768x298.jpg 768w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<h4 class=\"wp-block-heading\">How to create Banner widget element?<\/h4>\n\n\n\n<p><strong>Step 1<\/strong>. Create, or choose the Column into which you want to add your element. Click on Add New Element.<\/p>\n\n\n\n<p><strong>Step 2<\/strong>. Drag UDesign <strong>Banner <\/strong>Element from the Element List.<\/p>\n\n\n\n<p><strong>Step 3<\/strong>. Add and edit the content item in banner content.<\/p>\n\n\n\n<p>In <strong>Content Items<\/strong>, there are Text, Button, Image, hotspot, Divider. With Section Banner, you can&#8217;t build hotspot type.  But with this widget, you can do easily.<\/p>\n\n\n\n<h4 class=\"wp-block-heading\">Banner Widget Options<\/h4>\n\n\n\n<p><strong><strong>Min Height<\/strong><\/strong>&nbsp;\u2013<strong> <\/strong>Control the min height of banner. You can set this value for various unit \u2013 px, rem, %, vh.<\/p>\n\n\n\n<p><strong><strong>Max Height<\/strong><\/strong>&nbsp;\u2013 Control the max height of banner.<\/p>\n\n\n\n<p><strong>Wrap with <\/strong>\u2013 Choose wrapper class. <strong>Container<\/strong>, <strong>Container Fluid<\/strong> or <strong>None<\/strong>.<\/p>\n\n\n\n<p><strong>Background Color <\/strong>\u2013 Set background color of banner content.<\/p>\n\n\n\n<p><strong>Image Position <\/strong>\u2013 Control image position when image is larger than render area.<\/p>\n\n\n\n<p><strong>Alignment <\/strong>\u2013 Select the content&#8217;s alignment. <\/p>\n\n\n\n<p><strong>Inline Item <\/strong>\u2013 Decide which display type to take. <strong>Inline<\/strong> or <strong>Block<\/strong><\/p>\n\n\n\n<h4 class=\"wp-block-heading\">Banner Content<\/h4>\n\n\n\n<p><strong><strong>Stretch height as Parent&#8217;s<\/strong><\/strong>&nbsp;\u2013<strong> <\/strong>You can make your banner height full of its parent.<\/p>\n\n\n\n<p><strong><strong>Width <\/strong><\/strong>\u2013<strong> <\/strong>Changes banner content width.<\/p>\n\n\n\n<p><strong>Origin X, Y<\/strong> \u2013<strong> <\/strong>Set base point of banner content to determine content position.<\/p>\n\n\n\n<p><strong>Banner Effect<\/strong> &#8211; Set Hover, Filter, Background, Particle effects.<\/p>\n\n\n\n<p><strong>Enable Parallax<\/strong> &#8211; Set to enable parallax effect for banner.<\/p>\n\n\n\n<p><strong>Content Effect<\/strong> &#8211; Set entrance animation for entire banner content.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>UDesign offers Banner element. With this widget, you can build page beautifully. How to create Banner widget element? Step 1. Create, or choose the Column into which you want to add your element. Click on Add New Element. Step 2. Drag UDesign Banner Element from the Element List. Step 3. Add and edit the content [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_monsterinsights_skip_tracking":false,"_monsterinsights_sitenote_active":false,"_monsterinsights_sitenote_note":"","_monsterinsights_sitenote_category":0,"footnotes":""},"categories":[32],"tags":[],"class_list":["post-5229","post","type-post","status-publish","format-standard","hentry","category-udesign-elements"],"_links":{"self":[{"href":"https:\/\/d-themes.com\/wordpress\/udesign\/documentation\/wp-json\/wp\/v2\/posts\/5229","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/d-themes.com\/wordpress\/udesign\/documentation\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/d-themes.com\/wordpress\/udesign\/documentation\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/d-themes.com\/wordpress\/udesign\/documentation\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/d-themes.com\/wordpress\/udesign\/documentation\/wp-json\/wp\/v2\/comments?post=5229"}],"version-history":[{"count":2,"href":"https:\/\/d-themes.com\/wordpress\/udesign\/documentation\/wp-json\/wp\/v2\/posts\/5229\/revisions"}],"predecessor-version":[{"id":8330,"href":"https:\/\/d-themes.com\/wordpress\/udesign\/documentation\/wp-json\/wp\/v2\/posts\/5229\/revisions\/8330"}],"wp:attachment":[{"href":"https:\/\/d-themes.com\/wordpress\/udesign\/documentation\/wp-json\/wp\/v2\/media?parent=5229"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/d-themes.com\/wordpress\/udesign\/documentation\/wp-json\/wp\/v2\/categories?post=5229"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/d-themes.com\/wordpress\/udesign\/documentation\/wp-json\/wp\/v2\/tags?post=5229"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}