Add text to footer

Store Design
, ,

Topic summary

A user wants to add “We accept” text above payment method icons in their store’s footer.

Solution provided:

  • Navigate to Admin → Online Store → Themes
  • Open the theme’s main CSS file (main.css, base.css, style.css, or theme.css) under the Asset folder
  • Add custom CSS code at the bottom of the file

CSS approach:

  • Uses the :before pseudo-element to insert “We accept” text
  • Targets the payment methods section with .shopify-section-footer > div .l4pm:before
  • Includes responsive styling for mobile devices (screens under 749px)
  • Adjusts positioning and spacing with margins and padding

The solution includes visual examples showing the expected result with the text appearing above the payment icons.

Summarized with AI on November 5. AI used: claude-sonnet-4-5-20250929.
1

Hi, how can I add “we accept” text just above my payment methods in the footer like in the image?

https://nagerteppich.de/

Daniel19901_0-1726762802419.png
Daniel19901_0-1726762802419.png756×113 6.8 KB

1 Like
2

Hi @Daniel19901

Check this one.

From you Admin page, go to Online Store > Themes

Select the theme you want to edit

Under the Asset folder, open the main.css(base.css, style.css or theme.css)

Then place the code below at the very bottom of the file.

.shopify-section-footer > div .l4pm:before {
    content: 'We accept';
    margin: 0 var(--dist) 10px 0;
}
@media only screen and (max-width: 749px){
.shopify-section-footer > div .l4pm:before {
    content: 'We accept';
    position: absolute;
    left: 50%;
    transform: translate(-50%);
    top: 5px;
}
.shopify-section-footer > div .l4pm {
    padding-top: 30px;
}
}

And Save.

Result:

Made4uoRibe_0-1726763766045.png

Made4uoRibe_1-1726763779237.png
Made4uoRibe_1-1726763779237.png441×191 13.3 KB

Please don’t forget to Like and Mark Solution to the post that helped you. Thanks!

1 Like