To set up and manage the Announcement Bar, navigate to Online Store > Themes > Current Theme > Customize, and select Announcement Bar. The announcement bar is an effective way to highlight important updates, promotions, or announcements, ensuring key

<h2 id="isPasted">Configuring the Announcement Bar</h2><p>To set up and manage the Announcement Bar, navigate to <strong>Online Store &gt; Themes &gt; Current Theme &gt; Customize</strong>, and select <strong>Announcement Bar</strong>. The announcement bar is an effective way to highlight important updates, promotions, or announcements, ensuring key information is prominently displayed to drive engagement and conversions.</p><p><img src="https://attachments.gorgias.help/JWE4j73qJb6ZlV9b/hc/gpGJBxpNkY2YXZA5/2024122412-73de20cf-a2ca-495c-9fe1-bb77a3e3797c-6617a3ae-95cf-43b0-b63b-fa3d2ae2d981.png" style="width: 2000px;" class="fr-fic fr-dib"></p><h2 id="managing-announcements">Managing Announcements</h2><p>You can add or remove announcements through the navigation menu on the left side of the theme editor.</p><h3 id="section-settings">Section Settings</h3><ul><li><strong>Color Scheme:</strong> Choose a color scheme for the announcement bar to match your store&#x2019;s branding.</li><li><strong>Display Mode:</strong>Select how the announcements are displayed:<ul><li><strong>Slider:</strong> Displays announcements in a vertical slider.</li><li><strong>Static:</strong> Positions blocks side by side. On smaller screens, it switches to a marquee style.</li><li><strong>Marquee:</strong> Displays announcements in a continuously repeating marquee.</li></ul></li><li><strong>Show Announcement Bar:</strong> Toggle the visibility of the announcement bar.</li><li><strong>Hide Only on Home Page:</strong> Option to hide the announcement bar exclusively on the home page.</li></ul><h3 id="block-settings">Block Settings</h3><ul><li><strong>Text:</strong> Add the text content to be displayed in the announcement bar.</li><li><strong>Link:</strong> Attach a link to the text for clickable announcements.</li></ul>

Announcement bar

To customize the header of your store, navigate to Online Store > Themes > Current Theme > Customize and select Header. The header is a key part of your store's design, providing important navigation elements and enhancing the overall user experience

<h2 id="isPasted">Configuring the Header</h2><p>To customize the header of your store, navigate to <strong>Online Store &gt; Themes &gt; Current Theme &gt; Customize</strong> and select <strong>Header</strong>. The header is a key part of your store&apos;s design, providing important navigation elements and enhancing the overall user experience.</p><p><img src="https://attachments.gorgias.help/JWE4j73qJb6ZlV9b/hc/gpGJBxpNkY2YXZA5/2024122412-ea487747-d33e-49b8-a60b-a5020ad3572f-82c96151-a8ca-499e-9a00-77238fca2d6a.png" style="width: 2000px;" class="fr-fic fr-dib"></p><h3 id="section-settings">Section Settings</h3><ul><li><strong>Color Scheme:</strong> Choose a color scheme for the header to align with your store&apos;s branding.</li><li><strong>Main Menu:</strong> Select the menu to display in the header for easy navigation.</li><li><strong>Letter Case:</strong> Set the letter case for the navigation text in the header to either <strong>uppercase</strong> or <strong>lowercase</strong>.</li><li><strong>Enable Uncollapsed Navigation Based on Active Page:</strong><ul><li>When enabled, if you are on a page included in the navigation at level 2 or level 3, the menu will automatically expanded to highlight your current location within the navigation structure.</li></ul></li></ul><p><img src="https://attachments.gorgias.help/JWE4j73qJb6ZlV9b/hc/gpGJBxpNkY2YXZA5/2024122412-059e82e5-8540-4153-96b7-6d77439322b2-3cdd6d0f-95a5-4df3-afb7-f140bdd54bf8.png" style="width: 2000px;" class="fr-fic fr-dib"></p>

Header

To customize the Header Utilities, navigate to Online Store > Themes > Current Theme > Customize and select Header Utilities. This section includes the Cart, Account, and Search links, essential for enhancing user navigation.

<h2 id="isPasted">Configuring Header Utilities</h2><p>To customize the <strong>Header Utilities</strong>, navigate to <strong>Online Store &gt; Themes &gt; Current Theme &gt; Customize</strong> and select <strong>Header Utilities</strong>. This section includes the <strong>Cart</strong>, <strong>Account</strong>, and <strong>Search</strong> links, essential for enhancing user navigation.</p><p><img src="https://attachments.gorgias.help/JWE4j73qJb6ZlV9b/hc/gpGJBxpNkY2YXZA5/2024122413-97ce7b81-3ce3-4d5e-889b-305a167e0596-fca13663-be43-4887-86f9-604907f4ea5d.png" style="width: 2000px;" class="fr-fic fr-dib"></p><h3 id="features-of-header-utilities">Features of Header Utilities</h3><ul><li><strong>Cart:</strong><ul><li>Links to the <strong>Cart Page</strong> or triggers the <strong>Cart Drawer</strong>, depending on your settings.</li></ul></li><li><strong>Search:</strong><ul><li>Triggers the <strong>Search Drawer</strong> for convenient product searches.</li></ul></li><li><strong>Account:</strong><ul><li>Links to the <strong>Account Page</strong>, allowing customers to manage their accounts.</li></ul></li></ul><h3 id="section-settings">Section Settings</h3><ul><li><strong>Color Scheme:</strong> Select a color scheme for the header utilities to match your store&#x2019;s branding.</li><li><strong>Letter Case:</strong> Set the text in the header utilities to <strong>lowercase</strong> or <strong>uppercase</strong>, based on your preference.</li></ul>

Header Utilities

Go to Online store > Navigation. Here you have to option to edit already existing menus or create a new menu. You have currently existing menus such as:. Main menu is the menu that will be visible in the header on the left side of the logo. Footer me

<p data-renderer-start-pos="3169" id="isPasted" style="margin-top: 0.75rem; margin-right: ; margin-bottom: 0px; margin-left: ; padding: 0px; font-size: 16px; line-height: 1.714; font-weight: 400; letter-spacing: -0.005em; color: rgb(23, 43, 77); font-family: -apple-system, &quot;system-ui&quot;, &quot;Segoe UI&quot;, Roboto, Oxygen, Ubuntu, &quot;Fira Sans&quot;, &quot;Droid Sans&quot;, &quot;Helvetica Neue&quot;, sans-serif; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; white-space: pre-wrap; background-color: rgb(255, 255, 255); text-decoration-thickness: initial; text-decoration-style: initial; text-decoration-color: initial;">Go to <code data-renderer-mark="true" style="font-family: SFMono-Medium, &quot;SF Mono&quot;, &quot;Segoe UI Mono&quot;, &quot;Roboto Mono&quot;, &quot;Ubuntu Mono&quot;, Menlo, Consolas, Courier, monospace; background-color: var(--ds--code--bg-color,var(--ds-background-neutral, #F4F5F7)); overflow: auto; font-size: 0.875em; font-weight: normal; color: var(--ds-text, #172B4D); border-style: none; border-radius: var(--ds-border-radius, 3px); display: inline; padding: 2px 0.5ch; -webkit-box-decoration-break: clone; overflow-wrap: break-word; white-space: pre-wrap; --ds--code--bg-color: var(--ds-background-neutral, rgba(9, 30, 66, 0.08));">Online store &gt; Navigation</code></p><p data-renderer-start-pos="3202" style="margin-top: 0.75rem; margin-right: ; margin-bottom: 0px; margin-left: ; padding: 0px; font-size: 16px; line-height: 1.714; font-weight: 400; letter-spacing: -0.005em; color: rgb(23, 43, 77); font-family: -apple-system, &quot;system-ui&quot;, &quot;Segoe UI&quot;, Roboto, Oxygen, Ubuntu, &quot;Fira Sans&quot;, &quot;Droid Sans&quot;, &quot;Helvetica Neue&quot;, sans-serif; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; white-space: pre-wrap; background-color: rgb(255, 255, 255); text-decoration-thickness: initial; text-decoration-style: initial; text-decoration-color: initial;">Here you have to option to edit already existing menus or create a new menu. You have currently existing menus such as:</p><ul data-indent-level="1" style="margin: 0px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px;
    ); list-style-type: disc; box-sizing: border-box; display: flow-root; color: rgb(23, 43, 77); font-family: -apple-system, &quot;system-ui&quot;, &quot;Segoe UI&quot;, Roboto, Oxygen, Ubuntu, &quot;Fira Sans&quot;, &quot;Droid Sans&quot;, &quot;Helvetica Neue&quot;, sans-serif; font-size: 16px; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: 400; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; white-space: pre-wrap; background-color: rgb(255, 255, 255); text-decoration-thickness: initial; text-decoration-style: initial; text-decoration-color: initial;"><li><p data-renderer-start-pos="3325" style="margin-top: 0px; margin-right: ; margin-bottom: 0px; margin-left: ; padding: 0px; font-size: 1em; line-height: 1.714; font-weight: normal; letter-spacing: -0.005em;"><strong data-renderer-mark="true">Main menu</strong> is the menu that will be visible in the header on the left side of the logo.</p></li><li style="margin-top: var(--ds-space-050, 4px);"><p data-renderer-start-pos="3573" style="margin-top: 0px; margin-right: ; margin-bottom: 0px; margin-left: ; padding: 0px; font-size: 1em; line-height: 1.714; font-weight: normal; letter-spacing: -0.005em;"><strong data-renderer-mark="true">Footer menu</strong> is currently used in a column within the footer</p></li><li style="margin-top: var(--ds-space-050, 4px);"><p data-renderer-start-pos="3636" style="margin-top: 0px; margin-right: ; margin-bottom: 0px; margin-left: ; padding: 0px; font-size: 1em; line-height: 1.714; font-weight: normal; letter-spacing: -0.005em;"><strong data-renderer-mark="true">Footer bottom</strong> is currently used to add links in the bottom of the footer</p></li></ul><div data-layout-section="true" style="margin-top: var(--ds-space-250, 20px); margin-right: 0px; margin-bottom: 0px; margin-left: 0px; padding: 0px; position: relative; display: flex; flex-direction: row; clear: both; color: rgb(23, 43, 77); font-family: -apple-system, &quot;system-ui&quot;, &quot;Segoe UI&quot;, Roboto, Oxygen, Ubuntu, &quot;Fira Sans&quot;, &quot;Droid Sans&quot;, &quot;Helvetica Neue&quot;, sans-serif; font-size: 16px; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: 400; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; white-space: pre-wrap; background-color: rgb(255, 255, 255); text-decoration-thickness: initial; text-decoration-style: initial; text-decoration-color: initial;"><div data-column-width="50" data-layout-column="true" style="margin: 0px; padding: 0px; flex: 1 1 50%; min-width: 0px;"><div style="margin: 0px; padding: 0px; position: relative; width: 364px;"><div style="margin: 0px; padding: 0px; display: block; width: 364px; position: absolute;"><br></div><div style="margin: 0px; padding: 0px;"><br></div><div data-layout="center" data-node-type="mediaSingle" data-width-type="percentage" style="margin-top: 0px !important; margin-right: auto; margin-bottom: 24px; margin-left: auto; padding: 0px; width: 364px; max-width: 100%; float: none; transition: width 100ms ease-in 0s; clear: both;"><div style="margin: 0px; padding: 0px; position: relative;"><div data-alt data-collection="contentId-655163434" data-context-id="655163434" data-file-mime-type data-file-name="file" data-file-size="1" data-height="1131" data-id="182dea3c-f295-4d34-b5dd-efde4d3176d2" data-node-type="media" data-type="file" data-width="1782" style="margin: 0px; padding: 0px; position: static !important; height: 0px; width: 364px;"><div data-testid="media-card-view" style="margin: 0px; padding: 0px; transition: all 0.3s ease 0s; box-sizing: border-box; position: absolute; font-family: -apple-system, BlinkMacSystemFont, &quot;Segoe UI&quot;, Roboto, Oxygen, Ubuntu, &quot;Fira Sans&quot;, &quot;Droid Sans&quot;, &quot;Helvetica Neue&quot;, sans-serif; width: 364px; max-width: 100%; height: 231.016px; max-height: 100%; border-radius: 3px; cursor: pointer; font-size: 11px; line-height: 14px;"><div data-test-media-name="image-20230828-120437.png" data-test-progress="1" data-test-status="complete" data-testid="media-file-card-view" style="margin: 0px; padding: 0px; display: flex; position: relative; max-width: 100%; width: 364px; height: 231.016px; max-height: 100%; overflow: hidden; border-radius: 3px; box-sizing: border-box;"><img data-fr-image-pasted="true" data-testid="media-image" draggable="false" alt="image-20230828-120437.png" src="blob:https://radikal-io.atlassian.net/8e1958b0-78fa-4e6e-9b62-9ead12ded2f9#media-blob-url=true&amp;id=182dea3c-f295-4d34-b5dd-efde4d3176d2&amp;collection=contentId-655163434&amp;contextId=655163434&amp;height=1131&amp;width=1782&amp;alt=" style="padding: 0px; border: 0px; box-sizing: border-box; left: 182px; top: 115.5px; object-fit: contain; image-orientation: none; transform: translate(-50%, -50%); width: 364px;" class="fr-fil fr-dib"></div></div></div></div></div></div></div><div data-column-width="50" data-layout-column="true" style="margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: var(--ds-space-400, 32px); padding: 0px; flex: 1 1 50%; min-width: 0px;"><div style="margin: 0px; padding: 0px; position: relative; width: 364px;"><div style="margin: 0px; padding: 0px; display: block; width: 364px; position: absolute;"><br></div><div style="margin: 0px; padding: 0px;"><br></div><div data-layout="center" data-node-type="mediaSingle" data-width-type="percentage" style="margin-top: 0px !important; margin-right: auto; margin-bottom: 24px; margin-left: auto; padding: 0px; width: 364px; max-width: 100%; float: none; transition: width 100ms ease-in 0s; clear: both;"><div style="margin: 0px; padding: 0px; position: relative;"><div data-alt data-collection="contentId-655163434" data-context-id="655163434" data-file-mime-type data-file-name="file" data-file-size="1" data-height="1056" data-id="f058b9d8-fdfc-499d-8127-52bf32784c55" data-node-type="media" data-type="file" data-width="1776" style="margin: 0px; padding: 0px; position: static !important; height: 0px; width: 364px;"><div data-testid="media-card-view" style="margin: 0px; padding: 0px; transition: all 0.3s ease 0s; box-sizing: border-box; position: absolute; font-family: -apple-system, BlinkMacSystemFont, &quot;Segoe UI&quot;, Roboto, Oxygen, Ubuntu, &quot;Fira Sans&quot;, &quot;Droid Sans&quot;, &quot;Helvetica Neue&quot;, sans-serif; width: 364px; max-width: 100%; height: 216.422px; max-height: 100%; border-radius: 3px; cursor: pointer; font-size: 11px; line-height: 14px;"><div data-test-media-name="image-20230828-120449.png" data-test-progress="1" data-test-status="complete" data-testid="media-file-card-view" style="margin: 0px; padding: 0px; display: flex; position: relative; max-width: 100%; width: 364px; height: 216.422px; max-height: 100%; overflow: hidden; border-radius: 3px; box-sizing: border-box;"><img data-fr-image-pasted="true" data-testid="media-image" draggable="false" alt="image-20230828-120449.png" src="blob:https://radikal-io.atlassian.net/6feb7db9-7f13-4be0-9482-2e314753a65d#media-blob-url=true&amp;id=f058b9d8-fdfc-499d-8127-52bf32784c55&amp;collection=contentId-655163434&amp;contextId=655163434&amp;height=1056&amp;width=1776&amp;alt=" style="padding: 0px; border: 0px; box-sizing: border-box; left: 182px; top: 108.203px; object-fit: contain; image-orientation: none; transform: translate(-50%, -50%); width: 364px;" class="fr-fil fr-dib"></div></div></div></div></div></div></div></div>

Navigation

To customize your store's footer, navigate to Online Store > Themes > Current Theme > Customize and select Footer.

<h2 id="isPasted">Configuring the Footer</h2><p>To customize your store&apos;s footer, navigate to <strong>Online Store &gt; Themes &gt; Current Theme &gt; Customize</strong> and select <strong>Footer</strong>.</p><h3 id="adding-or-editing-a-column">Adding or Editing a Column</h3><ul><li>Select an existing column or add a new one within the footer.</li><li>Within the column settings, you can enable the <strong>Country &amp; Language Selector</strong>, allowing customers to choose their preferred country and language directly from the footer.</li></ul><p><img src="https://attachments.gorgias.help/JWE4j73qJb6ZlV9b/hc/gpGJBxpNkY2YXZA5/2024122413-599f0e38-26f0-494e-b7a0-2329dc029c7b-f860ce17-9416-4af1-bb2a-0d54a36aa374.png" style="width: 2000px;" class="fr-fic fr-dib"></p><p><br></p>

Languages & currencies

Please feel free to reach out to our Support Team via email anytime!

Privacy policy

Support terms

Contact us

Main website

Customizations

Help center

RAD Theme by Radikal

Explore the versatile header options in RAD, a Radikal Shopify theme. Learn how to personalize your store's first impression with easy-to-follow instructions on layout, design, and navigation customization.

Header group in RAD by Radikal

The Header Group consists of elements that remain fixed within your webshop, providing consistent functionality and navigation across all pages.