{"id":13518,"date":"2023-05-06T04:27:17","date_gmt":"2023-05-06T08:27:17","guid":{"rendered":"https:\/\/buzapps.net\/info\/?post_type=knowledgebase&#038;p=13518"},"modified":"2023-05-07T09:14:32","modified_gmt":"2023-05-07T13:14:32","slug":"how-do-i-make-the-slider-on-custom-pages-full-screen","status":"publish","type":"knowledgebase","link":"https:\/\/buzapps.net\/info\/knowledgebase\/how-to\/how-do-i-make-the-slider-on-custom-pages-full-screen\/","title":{"rendered":"How do I make the Slider on Custom Pages full screen?"},"content":{"rendered":"\n<p class=\"wp-block-paragraph\">Follow the instructions below to make the images full screen when using the Slider on Custom Pages.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>1)<\/strong>&nbsp;Log into your App Manager and&nbsp;<strong>select your app<\/strong>.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>2)<\/strong>&nbsp;Click&nbsp;<strong>Colors<\/strong>&nbsp;from the left-hand-side of the screen (or the middle of the screen).<\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>3)<\/strong>\u00a0Scroll down to the\u00a0<strong>Advanced SCSS box<\/strong>.\u00a0If there is already code in the box do not delete it!\u00a0Simply add this code \u201cbelow\u201d the last character of code in the box.<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>\/**Begin make sliders on custom pages full screen*\/\n\n.item-image-gallery {\n\nheight: 600px !important;\n\n}\n\n.sb-cms-image ul&#91;rn-carousel] li &amp;gt; div {\n\nheight: 600px;\n\nbackground-size: cover;\n\nbackground-repeat: no-repeat;\n\nbackground-position: center;\n\n}\n\n\/**End make sliders on custom pages full screen*\/<\/code><\/pre>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>4)<\/strong>Click&nbsp;<strong>Save<\/strong>.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>NOTE:<\/strong> Ensure that the images that you use are in portrait format.&nbsp;To adjust the height, edit &#8220;600px&#8221; to fit your needs.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Follow the instructions below to make the images full screen when using the Slider on Custom Pages. 1)&nbsp;Log into your App Manager and&nbsp;select your app. 2)&nbsp;Click&nbsp;Colors&nbsp;from the left-hand-side of the screen (or the middle of the screen). 3)\u00a0Scroll down to the\u00a0Advanced SCSS box.\u00a0If there is already code in the box do not delete it!\u00a0Simply add this code \u201cbelow\u201d the last character of code in the box. 4)Click&nbsp;Save. NOTE: Ensure that the images that you use are in portrait format.&nbsp;To adjust the height, edit &#8220;600px&#8221; to fit your needs.<\/p>\n","protected":false},"author":2,"featured_media":0,"comment_status":"closed","ping_status":"closed","template":"","knowledgebase_cat":[35],"class_list":["post-13518","knowledgebase","type-knowledgebase","status-publish","hentry","knowledgebase_cat-how-to"],"_links":{"self":[{"href":"https:\/\/buzapps.net\/info\/wp-json\/wp\/v2\/knowledgebase\/13518","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/buzapps.net\/info\/wp-json\/wp\/v2\/knowledgebase"}],"about":[{"href":"https:\/\/buzapps.net\/info\/wp-json\/wp\/v2\/types\/knowledgebase"}],"author":[{"embeddable":true,"href":"https:\/\/buzapps.net\/info\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/buzapps.net\/info\/wp-json\/wp\/v2\/comments?post=13518"}],"version-history":[{"count":2,"href":"https:\/\/buzapps.net\/info\/wp-json\/wp\/v2\/knowledgebase\/13518\/revisions"}],"predecessor-version":[{"id":14029,"href":"https:\/\/buzapps.net\/info\/wp-json\/wp\/v2\/knowledgebase\/13518\/revisions\/14029"}],"wp:attachment":[{"href":"https:\/\/buzapps.net\/info\/wp-json\/wp\/v2\/media?parent=13518"}],"wp:term":[{"taxonomy":"knowledgebase_cat","embeddable":true,"href":"https:\/\/buzapps.net\/info\/wp-json\/wp\/v2\/knowledgebase_cat?post=13518"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}