{"id":3820,"date":"2026-04-13T02:45:24","date_gmt":"2026-04-13T09:45:24","guid":{"rendered":"https:\/\/clone.surecookie.com\/?post_type=docs&p=3820"},"modified":"2026-04-21T04:23:29","modified_gmt":"2026-04-21T11:23:29","slug":"customizing-banner-layout","status":"publish","type":"docs","link":"https:\/\/clone.surecookie.com\/de\/docs\/customizing-banner-layout\/","title":{"rendered":"Customizing Banner Layout"},"content":{"rendered":"

The Banner Layout<\/strong> settings let you control the appearance and position of your cookie consent banner on your website. Configure the banner type, set its width, choose its position, add animations, select colors, and arrange your consent buttons exactly how you want them.<\/p>\n\n\n\n

Accessing Banner Layout <\/strong><\/h2>\n\n\n\n
    \n
  • Open your WordPress Dashboard.<\/li>\n\n\n\n
  • Go to Surecookie > Settings<\/strong>.<\/li>\n\n\n\n
  • Click on Banner Layout.<\/li>\n<\/ul>\n\n\n\n
    \"image\"<\/figure>\n\n\n\n

    Logo<\/strong><\/h2>\n\n\n\n

    Add your site’s logo or branding to the banner by uploading an image file. <\/p>\n\n\n\n

    Click Choose File<\/strong> to select an image. It will give you the option to upload images from your Media Library or from your device.<\/p>\n\n\n\n

     Leave this blank if you prefer a text-only banner.<\/p>\n\n\n\n

    \"image\"<\/figure>\n\n\n\n

    Banner Type<\/strong><\/h2>\n\n\n\n

    SureCookie offers two banner layout styles. Choose the one that works best for your site and compliance needs:<\/p>\n\n\n\n

    Floating Banner<\/h3>\n\n\n\n

    A small banner that stays fixed on your screen as you scroll. It doesn’t take up page space, so your content stays visible. You can adjust the width to fit your needs. The banner remains visible as users scroll. This is the least disruptive option and works well for most sites.<\/p>\n\n\n\n

    \"image\"<\/figure>\n\n\n\n

    Full-width Banner<\/h3>\n\n\n\n

    A horizontal bar that stretches across the full width of the page at the top or bottom. This draws more attention and is commonly used for prominent consent displays. The banner takes up space on the page and may shift your content, but provides high visibility.<\/p>\n\n\n\n

    \"image\"<\/figure>\n\n\n\n

    Banner Width<\/strong><\/h2>\n\n\n\n

    Banner Width is used to set a custom width for your floating banner in pixels. This lets you control exactly how much screen space it takes up. The default is 650 pixels, but you can adjust it to match your design. This option is only available for floating banners.<\/p>\n\n\n\n

    \"image\"<\/figure>\n\n\n\n

    Position<\/strong><\/h2>\n\n\n\n

    Banner positions lets you choose the position of your cookie banner on the site. These options help you set the position that best suits your design and visibility requirements.<\/p>\n\n\n\n

    Floating Banner Positions<\/h3>\n\n\n\n
      \n
    • Bottom Lef<\/strong>t: Subtle and out of the way. Widely used<\/li>\n\n\n\n
    • Bottom Center<\/strong>: Balanced visibility<\/li>\n\n\n\n
    • Bottom Right<\/strong>: Subtle and out of the way<\/li>\n\n\n\n
    • Middle<\/strong>: Center stage (grabs attention like a pop-up)<\/li>\n<\/ul>\n\n\n\n
      \"image\"<\/figure>\n\n\n\n

      Full-width Banner<\/h3>\n\n\n\n
        \n
      • Top<\/strong> – Right at the page entrance<\/li>\n\n\n\n
      • Bottom<\/strong> – After users scroll through your content<\/li>\n<\/ul>\n\n\n\n

        Banner Animation<\/strong><\/h2>\n\n\n\n

        Add an entrance animation to your banner so it smoothly appears rather than popping in instantly. Choose from these animation styles:<\/p>\n\n\n\n

          \n
        • Fade<\/strong>: The banner gradually fades into view.<\/li>\n\n\n\n
        • Slide<\/strong>: The banner slides into view from the edge of the screen.<\/li>\n<\/ul>\n\n\n\n

          A preview of the animation plays in the banner preview panel on the right, so you can see the effect before saving.<\/p>\n\n\n\n

          Color Palette<\/strong><\/h2>\n\n\n\n

          Change the color scheme of your banner in one click using SureCookie’s pre-built color palettes. Click on any color palette option to see an instant preview of how your banner will look. <\/p>\n\n\n\n

          The banner preview on the right updates immediately so you can compare different color combinations before saving.<\/p>\n\n\n\n

          Button Order<\/strong><\/h2>\n\n\n\n

          Customize the order and visibility of your consent buttons. The default order is:<\/p>\n\n\n\n

            \n
          • Accept All<\/li>\n\n\n\n
          • Only Essential<\/li>\n\n\n\n
          • Preferences<\/li>\n\n\n\n
          • Decline<\/li>\n<\/ul>\n\n\n\n

            You can drag and drop buttons to reorder them. This order can be overridden by the Geotargeting Rules<\/strong> if you have specific compliance requirements for different regions.<\/p>\n\n\n\n

            The help text below the button order section notes: “Drag and drop to reorder buttons. This order can be overridden per Geotargeting Rules.”<\/em><\/p>\n\n\n\n

            Preview Mode<\/strong><\/h2>\n\n\n\n

            Before making any layout changes live, use the Preview<\/strong> toggle at the top of the SureCookie dashboard to see exactly how the banner will appear to your visitors. Preview mode is only visible to administrators and does not affect your site’s actual visitors.<\/p>\n\n\n\n

            Saving Your Changes<\/strong><\/h2>\n\n\n\n

            Once you’ve configured all your banner layout settings, click the green Save<\/strong> button at the bottom of the page to apply your changes.<\/p>","protected":false},"excerpt":{"rendered":"

            […]<\/p>\n","protected":false},"author":39,"featured_media":0,"template":"","meta":{"_uag_custom_page_level_css":"","site-sidebar-layout":"default","site-content-layout":"","ast-site-content-layout":"default","site-content-style":"default","site-sidebar-style":"default","ast-global-header-display":"","ast-banner-title-visibility":"","ast-main-header-display":"","ast-hfb-above-header-display":"","ast-hfb-below-header-display":"","ast-hfb-mobile-header-display":"","site-post-title":"","ast-breadcrumbs-content":"","ast-featured-img":"","footer-sml-layout":"","ast-disable-related-posts":"","theme-transparent-header-meta":"","adv-header-id-meta":"","stick-header-meta":"","header-above-stick-meta":"","header-main-stick-meta":"","header-below-stick-meta":"","astra-migrate-meta-layouts":"set","ast-page-background-enabled":"default","ast-page-background-meta":{"desktop":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"ast-content-background-meta":{"desktop":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"_pfd_related_docs_manual":[],"pfd_doc_title":"","spectra_gs_classes":"[\"\"]","footnotes":""},"docs_category":[34],"docs_tag":[],"class_list":["post-3820","docs","type-docs","status-publish","hentry","docs_category-banner-customization"],"spectra_custom_meta":{"spectra_gs_classes":["[\"\"]"],"surerank_seo_checks":["a:14:{s:14:\"h2_subheadings\";a:3:{s:6:\"status\";s:7:\"success\";s:7:\"message\";s:38:\"Page contains at least one subheading.\";s:4:\"type\";s:4:\"page\";}s:13:\"media_present\";a:3:{s:6:\"status\";s:7:\"success\";s:7:\"message\";s:55:\"This page includes images or videos to enhance content.\";s:4:\"type\";s:4:\"page\";}s:13:\"links_present\";a:3:{s:6:\"status\";s:7:\"warning\";s:7:\"message\";s:27:\"No links found on the page.\";s:4:\"type\";s:4:\"page\";}s:10:\"url_length\";a:3:{s:6:\"status\";s:7:\"success\";s:7:\"message\";s:35:\"Page URL is short and SEO-friendly.\";s:4:\"type\";s:4:\"page\";}s:19:\"search_engine_title\";a:3:{s:6:\"status\";s:7:\"success\";s:7:\"message\";s:55:\"Search engine title is present and under 60 characters.\";s:4:\"type\";s:4:\"page\";}s:25:\"search_engine_description\";a:3:{s:6:\"status\";s:7:\"success\";s:7:\"message\";s:62:\"Search engine description is present and under 160 characters.\";s:4:\"type\";s:4:\"page\";}s:13:\"canonical_url\";a:3:{s:6:\"status\";s:7:\"success\";s:7:\"message\";s:37:\"Canonical tag is present on the page.\";s:4:\"type\";s:4:\"page\";}s:15:\"open_graph_tags\";a:3:{s:6:\"status\";s:7:\"success\";s:7:\"message\";s:40:\"Open Graph tags are present on the page.\";s:4:\"type\";s:4:\"page\";}s:16:\"keyword_in_title\";a:3:{s:6:\"status\";s:10:\"suggestion\";s:7:\"message\";s:38:\"No focus keyword set to analyze title.\";s:4:\"type\";s:7:\"keyword\";}s:22:\"keyword_in_description\";a:3:{s:6:\"status\";s:10:\"suggestion\";s:7:\"message\";s:49:\"No focus keyword set to analyze meta description.\";s:4:\"type\";s:7:\"keyword\";}s:14:\"keyword_in_url\";a:3:{s:6:\"status\";s:10:\"suggestion\";s:7:\"message\";s:36:\"No focus keyword set to analyze URL.\";s:4:\"type\";s:7:\"keyword\";}s:18:\"keyword_in_content\";a:3:{s:6:\"status\";s:10:\"suggestion\";s:7:\"message\";s:40:\"No focus keyword set to analyze content.\";s:4:\"type\";s:7:\"keyword\";}s:12:\"broken_links\";a:2:{s:6:\"status\";s:7:\"success\";s:7:\"message\";s:34:\"No broken links found on the page.\";}s:14:\"image_alt_text\";a:5:{s:6:\"status\";s:7:\"success\";s:11:\"description\";a:1:{i:0;s:48:\"Images on the post\/page have alt text attributes\";}s:7:\"message\";s:49:\"All images on this page have alt text attributes.\";s:11:\"show_images\";b:0;s:4:\"type\";s:4:\"page\";}}"],"surerank_seo_checks_last_updated":["1776839100"],"_edit_lock":["1776775562:39"],"_uag_custom_page_level_css":[""],"site-sidebar-layout":["default"],"site-content-layout":[""],"ast-site-content-layout":["default"],"site-content-style":["default"],"site-sidebar-style":["default"],"ast-global-header-display":[""],"ast-banner-title-visibility":[""],"ast-main-header-display":[""],"ast-hfb-above-header-display":[""],"ast-hfb-below-header-display":[""],"ast-hfb-mobile-header-display":[""],"site-post-title":[""],"ast-breadcrumbs-content":[""],"ast-featured-img":[""],"footer-sml-layout":[""],"ast-disable-related-posts":[""],"theme-transparent-header-meta":[""],"adv-header-id-meta":[""],"stick-header-meta":[""],"header-above-stick-meta":[""],"header-main-stick-meta":[""],"header-below-stick-meta":[""],"astra-migrate-meta-layouts":["set"],"ast-page-background-enabled":["default"],"ast-page-background-meta":["a:3:{s:7:\"desktop\";a:12:{s:16:\"background-color\";s:25:\"var(--ast-global-color-4)\";s:16:\"background-image\";s:0:\"\";s:17:\"background-repeat\";s:6:\"repeat\";s:19:\"background-position\";s:13:\"center center\";s:15:\"background-size\";s:4:\"auto\";s:21:\"background-attachment\";s:6:\"scroll\";s:15:\"background-type\";s:0:\"\";s:16:\"background-media\";s:0:\"\";s:12:\"overlay-type\";s:0:\"\";s:13:\"overlay-color\";s:0:\"\";s:15:\"overlay-opacity\";s:0:\"\";s:16:\"overlay-gradient\";s:0:\"\";}s:6:\"tablet\";a:12:{s:16:\"background-color\";s:0:\"\";s:16:\"background-image\";s:0:\"\";s:17:\"background-repeat\";s:6:\"repeat\";s:19:\"background-position\";s:13:\"center center\";s:15:\"background-size\";s:4:\"auto\";s:21:\"background-attachment\";s:6:\"scroll\";s:15:\"background-type\";s:0:\"\";s:16:\"background-media\";s:0:\"\";s:12:\"overlay-type\";s:0:\"\";s:13:\"overlay-color\";s:0:\"\";s:15:\"overlay-opacity\";s:0:\"\";s:16:\"overlay-gradient\";s:0:\"\";}s:6:\"mobile\";a:12:{s:16:\"background-color\";s:0:\"\";s:16:\"background-image\";s:0:\"\";s:17:\"background-repeat\";s:6:\"repeat\";s:19:\"background-position\";s:13:\"center center\";s:15:\"background-size\";s:4:\"auto\";s:21:\"background-attachment\";s:6:\"scroll\";s:15:\"background-type\";s:0:\"\";s:16:\"background-media\";s:0:\"\";s:12:\"overlay-type\";s:0:\"\";s:13:\"overlay-color\";s:0:\"\";s:15:\"overlay-opacity\";s:0:\"\";s:16:\"overlay-gradient\";s:0:\"\";}}"],"ast-content-background-meta":["a:3:{s:7:\"desktop\";a:12:{s:16:\"background-color\";s:25:\"var(--ast-global-color-5)\";s:16:\"background-image\";s:0:\"\";s:17:\"background-repeat\";s:6:\"repeat\";s:19:\"background-position\";s:13:\"center center\";s:15:\"background-size\";s:4:\"auto\";s:21:\"background-attachment\";s:6:\"scroll\";s:15:\"background-type\";s:0:\"\";s:16:\"background-media\";s:0:\"\";s:12:\"overlay-type\";s:0:\"\";s:13:\"overlay-color\";s:0:\"\";s:15:\"overlay-opacity\";s:0:\"\";s:16:\"overlay-gradient\";s:0:\"\";}s:6:\"tablet\";a:12:{s:16:\"background-color\";s:25:\"var(--ast-global-color-5)\";s:16:\"background-image\";s:0:\"\";s:17:\"background-repeat\";s:6:\"repeat\";s:19:\"background-position\";s:13:\"center center\";s:15:\"background-size\";s:4:\"auto\";s:21:\"background-attachment\";s:6:\"scroll\";s:15:\"background-type\";s:0:\"\";s:16:\"background-media\";s:0:\"\";s:12:\"overlay-type\";s:0:\"\";s:13:\"overlay-color\";s:0:\"\";s:15:\"overlay-opacity\";s:0:\"\";s:16:\"overlay-gradient\";s:0:\"\";}s:6:\"mobile\";a:12:{s:16:\"background-color\";s:25:\"var(--ast-global-color-5)\";s:16:\"background-image\";s:0:\"\";s:17:\"background-repeat\";s:6:\"repeat\";s:19:\"background-position\";s:13:\"center center\";s:15:\"background-size\";s:4:\"auto\";s:21:\"background-attachment\";s:6:\"scroll\";s:15:\"background-type\";s:0:\"\";s:16:\"background-media\";s:0:\"\";s:12:\"overlay-type\";s:0:\"\";s:13:\"overlay-color\";s:0:\"\";s:15:\"overlay-opacity\";s:0:\"\";s:16:\"overlay-gradient\";s:0:\"\";}}"],"pfd_doc_title":[""],"footnotes":[""],"_edit_last":["39"],"views":["529"],"helpful":["0"],"unhelpful":["0"],"redirects":["0"],"_uag_page_assets":["a:9:{s:3:\"css\";s:0:\"\";s:2:\"js\";s:0:\"\";s:18:\"current_block_list\";a:12:{i:0;s:14:\"core\/paragraph\";i:1;s:12:\"core\/heading\";i:2;s:9:\"core\/list\";i:3;s:14:\"core\/list-item\";i:4;s:10:\"core\/image\";i:5;s:11:\"core\/search\";i:6;s:10:\"core\/group\";i:7;s:17:\"core\/latest-posts\";i:8;s:20:\"core\/latest-comments\";i:9;s:13:\"core\/archives\";i:10;s:15:\"core\/categories\";i:11;s:14:\"core\/shortcode\";}s:8:\"uag_flag\";b:0;s:11:\"uag_version\";s:10:\"1789562887\";s:6:\"gfonts\";a:0:{}s:10:\"gfonts_url\";s:0:\"\";s:12:\"gfonts_files\";a:0:{}s:14:\"uag_faq_layout\";b:0;}"]},"uagb_featured_image_src":{"full":false,"thumbnail":false,"medium":false,"medium_large":false,"large":false,"1536x1536":false,"2048x2048":false,"trp-custom-language-flag":false},"uagb_author_info":{"display_name":"namratap","author_link":"https:\/\/clone.surecookie.com\/de\/author\/namratap\/"},"uagb_comment_info":0,"uagb_excerpt":"[…]","_links":{"self":[{"href":"https:\/\/clone.surecookie.com\/de\/wp-json\/wp\/v2\/docs\/3820","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/clone.surecookie.com\/de\/wp-json\/wp\/v2\/docs"}],"about":[{"href":"https:\/\/clone.surecookie.com\/de\/wp-json\/wp\/v2\/types\/docs"}],"author":[{"embeddable":true,"href":"https:\/\/clone.surecookie.com\/de\/wp-json\/wp\/v2\/users\/39"}],"version-history":[{"count":7,"href":"https:\/\/clone.surecookie.com\/de\/wp-json\/wp\/v2\/docs\/3820\/revisions"}],"predecessor-version":[{"id":5147,"href":"https:\/\/clone.surecookie.com\/de\/wp-json\/wp\/v2\/docs\/3820\/revisions\/5147"}],"wp:attachment":[{"href":"https:\/\/clone.surecookie.com\/de\/wp-json\/wp\/v2\/media?parent=3820"}],"wp:term":[{"taxonomy":"docs_category","embeddable":true,"href":"https:\/\/clone.surecookie.com\/de\/wp-json\/wp\/v2\/docs_category?post=3820"},{"taxonomy":"docs_tag","embeddable":true,"href":"https:\/\/clone.surecookie.com\/de\/wp-json\/wp\/v2\/docs_tag?post=3820"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}