Under EU Directive 2023/2673, the link to your withdrawal page must be permanently visible and easy to find. You can't visually highlight it through Shopify's menu settings alone – for that, you need a few lines of custom CSS. This step is optional, but recommended.

In the Shopify footer menu, all links look the same by default: same color, same weight. Your withdrawal link blends in next to imprint, terms, and privacy policy. A few lines of CSS give it a different color and/or more weight.

Prerequisite

You've already linked the withdrawal page in your footer menu. If not yet: How to set up a dedicated withdrawal page.

Important to know: You'll need the URL slug of your withdrawal page. If your page is reachable at yourshop.com/pages/withdrawal-form, the slug is withdrawal-form. This slug goes into the CSS code shortly.

Step 1 · Open Custom CSS in the theme editor

1. In your Shopify admin, go to Online Store → Themes → Customize.
2. Click the gear icon in the top left (Theme settings).
3. Scroll down in the sidebar to Custom CSS.

Step 2 · Insert the CSS code

Copy the following code and paste it into the Custom CSS field:

a[href*="withdrawal-form"],
a[href*="withdrawal-form"]:hover {
  color: #e51c23 !important;
  font-weight: bold;
}

Important: In both lines, replace the word withdrawal-form with the URL slug of your own withdrawal page. Examples:

• Your page is yourshop.com/pages/cancel-order → cancel-order
• Your page is yourshop.com/pages/withdraw-contract → withdraw-contract

Click Save in the top right to activate the changes.

Step 3 · Choose your own color

The example code uses #e51c23 (bold red) as a placeholder color. You can adapt it to your shop design:

• Your shop's accent color – feels integrated
• Contrast color like red, orange, or purple – stands out instantly
• Black (#000000) combined with font-weight: bold – subtle but noticeable

You'll need the color code in HEX format (e.g. #e51c23). If you're unsure which color to pick: Check your shop designs (e.g. the button color on your product pages) – you'll often find suitable tones there.

More customization options

If you want to go beyond color and weight, here are a few more options:

Increase font size

a[href*="withdrawal-form"],
a[href*="withdrawal-form"]:hover {
  color: #e51c23 !important;
  font-weight: bold;
  font-size: 1.1em;
}

Add an underline

a[href*="withdrawal-form"],
a[href*="withdrawal-form"]:hover {
  color: #e51c23 !important;
  font-weight: bold;
  text-decoration: underline;
}

As a button (boxed style)

a[href*="withdrawal-form"],
a[href*="withdrawal-form"]:hover {
  color: #ffffff !important;
  background-color: #e51c23;
  padding: 6px 12px;
  border-radius: 4px;
  font-weight: bold;
}

Step 4 · Check the result

After saving:

1. Open your shop in an incognito window (to bypass the browser cache).
2. Scroll to the footer.
3. The withdrawal link should now clearly stand out from the other links.

Something not as expected? Go through the Common Issues below.

Common Issues

The link looks the same as before

• Clear your browser cache or check in incognito mode
• Verify you've used the correct URL slug in the code (typos in withdrawal-form are common)
• Did you click Save in the top right of the theme editor?

Multiple links are being highlighted

The selector a[href*="..."] reacts to all links that contain the specified word in their URL. If you use withdrawal as the slug for example, a link to withdrawal-policy would also be highlighted.

Solution: Use a more unique URL slug for your withdrawal page (e.g. withdrawal-form instead of just withdrawal).

The code affects other areas of my shop

If you have additional links to the withdrawal page on other pages (e.g. in your withdrawal instructions), those will also be highlighted – this is normal and usually desired.

If you only want it in the footer, you can make the selector more specific:

footer a[href*="withdrawal-form"],
footer a[href*="withdrawal-form"]:hover {
  color: #e51c23 !important;
  font-weight: bold;
}

Works in most themes, but may vary depending on theme structure.

Next steps

• Set up form branding to match your shop design
• Go through the Go-Live Checklist

Updated on: 22/05/2026