How To Move Footer Link To The Bottom Right On PC Version

Topic summary

A user wants to reposition footer links to the bottom right on desktop view, aligned with the country/region selector, while keeping mobile layout unchanged.

Two solutions provided:

Solution 1 (BSSCommerce-HDL - Initial):

  • Navigate to: Shopify Admin → Online Store → Theme → Edit code
  • Locate theme.liquid file
  • Insert markup code above the </body> tag
  • Note: The actual code snippet appears corrupted/reversed in the original post

Solution 2 (BSSCommerce-HDL - Revised CSS approach):

  • Access the same code editor path
  • Find base.css, theme.css, styles.css, custom.css, or theme.scss.liquid
  • Add CSS at bottom of file:
    • Media query targeting screens 750px+ width
    • Styles for .footer-block__details-content, .footer__column.footer__localization, and .localization-form
    • Uses flexbox alignment and margin adjustments

One responder offered direct assistance with store access. The CSS solution appears most practical for desktop-only positioning without affecting mobile layout.

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

Thanks in advance!

I am looking to move my footer links to the bottom right only for pc version. I would like it to align with the country/region selector. Example shown below.

https://decemberschild.com/

password: dc

Hello @MMast

To change the placement of footer links in your site, you need to make changes in code side so the links are placed align with the country selector.

Without changing code, its not possible.

if you want me to do this. then you need to give access of your site so i can make changes in your site. I will not charge anything for this.

Hi @MMast ,

Step 1: Go to Shopify Admin → Online Store ->Theme → Edit code

Step 2: Search file theme.liquid

Step 3: Insert this code above tag:


Hope this can help you :heart_eyes:

1 Like

Hi [email removed] @MMast , i modify a bit css:

Step 1: Go to Shopify Admin → Online Store ->Theme → Edit code

Step 2: Search file base.css, theme.css, styles.css, custom.css or theme.scss.liquid

Step 3: Insert the below code at the bottom of the file → Save

@media screen and (min-width: 750px) {
    .footer-block__details-content {
        display: flex;
        align-items: center;
    }
    localization-form {
       margin-right: auto;
    }
    .footer__column.footer__localization {
      align-items: center !important;
    }
}

Hope this can help you,

If our suggestions are useful, please let us know by giving it a like or marking it as a solution. Thank you :heart_eyes:

1 Like