CookieScript allows you to customize the order of buttons on both the Initial banner (first layer) and the Detailed banner (second layer).
You can change the button order directly through the banner settings without using Custom CSS. If you prefer to customize the buttons manually, Custom CSS is also available.
1. How to change the button order on the Initial banner (first layer)
The Initial banner is the first cookie consent banner visitors see when they open your website. Depending on your configuration, it can display Accept all, Decline all, and Customize buttons.
With the new Initial banner button order setting, you can change the order of these buttons directly from the CookieScript dashboard.
Follow these steps:
Log in to your CookieScript account and select the banner you want to edit.
Navigate to Settings → Banner elements.
Find the Initial banner button order setting.
Open the dropdown menu and select your preferred button order.
Check the banner preview to see how the buttons will appear.
Click Save to apply your changes.
For example, you can arrange the buttons in the following order:
Accept all → Decline all → Customize
You can also select a different available arrangement to match your preferred banner layout.
Note: The Initial banner button order setting controls the order of the Accept all, Decline all, and Customize buttons. If any of these buttons are hidden, they are automatically skipped. The displayed button labels may vary depending on your banner configuration.
You no longer need to use Custom CSS to change the button order on the Initial banner.
2. How to change the button order on the Detailed banner (second layer)
The Detailed banner allows visitors to review cookie information, manage cookie categories, and adjust their consent preferences.
When the cookie declaration is displayed in a large popup, you can also change the order of its buttons directly from your CookieScript settings.
Follow these steps:
Log in to your CookieScript account and select the banner you want to edit.
Navigate to Settings → Banner elements.
Enable Show Cookie Declaration if it is not already enabled.
Enable Open Cookie Declaration in a Big Popup.
Find the Button order dropdown and select your preferred button arrangement.
If needed, use the Middle button alignment setting to adjust the position of the middle button or stretch the buttons to full width.
Check the banner preview and click Save.
The Detailed banner can display buttons such as Accept all, Decline all, and Save & Close, depending on your configuration.
Note: The Button order setting for the large cookie declaration popup applies to that popup. To change the button order on the Initial banner, use the separate Initial banner button order setting described in Section 1.
For more information about configuring the cookie declaration popup, see Show cookie declaration.
3. Alternative method: Change the button order using Custom CSS
If you prefer to customize the button order manually, you can also use Custom CSS.
Follow these steps:
Log in to your CookieScript account and select the banner you want to edit.
Navigate to Settings → Colors.
Scroll down to the Custom CSS Styles section.
Add the following CSS code:
#cookiescript_accept,
#cookiescript_save {
order: 1;
}Click Save to apply your changes.
This CSS example targets the Accept and Save buttons and uses the order property to adjust their visual positioning. The result depends on your banner's layout.
Check the banner preview and test the changes on your website.
Note: Custom CSS is available only with paid CookieScript plans.
For more information on adding and managing custom CSS, see How to add custom styles to cookie consent banner?.