How can I position social media icons below the footer menu?

Store Design
,

Topic summary

A user wants to reposition social media icons in their Shopify store footer from the center to directly below the last footer column.

Current Issue:

  • Social media icons are centered in the footer
  • User provided screenshots showing current vs. desired layout

Proposed Solution:
A responder suggested modifying the theme code:

  • Navigate to Online Store > Themes > Edit code
  • Locate footer.liquid in the sections directory
  • Add custom CSS with properties like position: absolute and bottom: 0
  • Modify HTML structure to create a separate row for social icons below footer columns

Current Status:

  • User added the CSS code but cannot locate the specific code block in footer.liquid that renders the social media icons
  • Awaiting clarification on which CSS file to use
  • Issue remains unresolved
Summarized with AI on November 20. AI used: claude-sonnet-4-5-20250929.
1

I would like to position the social media icons just below the last footer column, so the social media icons will not be located in the center.
Below the screenshot of current design and requested design.

Site URL is https://porsche-rj-8273.myshopify.com/

current design social icons centered
current design social icons centered1904×394 20.5 KB

Below is the screenshot of the requested design:

Screen Shot 2023-05-20 at 16.16.05.png
Screen Shot 2023-05-20 at 16.16.05.png1399×384 28.9 KB

2

To position the social media icons just below the last footer column in your Shopify theme, you can follow these steps:

  1. From your Shopify admin, go to Online Store > Themes.

  2. Find the theme you’re currently using and click on the “Actions” button.

  3. Select “Edit code” from the dropdown menu to access the theme’s code editor.

  4. In the code editor, navigate to the sections directory and locate the footer.liquid file.

  5. Open the footer.liquid file and find the code responsible for rendering the social media icons.

  6. Depending on the structure of your theme’s footer, you may need to adjust the HTML and CSS to achieve the desired positioning. Here’s a general approach you can try:

    a. Locate the code block that generates the social media icons, which might look similar to this:

b. Modify the HTML structure to position the social media icons below the last footer column. You can use a wrapping div to create a separate row for the social media icons. For example:

Open the CSS file and add custom CSS to position the social media icons below the last footer column. You can use CSS properties like position: absolute and bottom: 0 to achieve this. Here’s an example:

.footer-social-icons-row {
  position: absolute;
  bottom: 0;
  width: 100%;
}
3

Thank you for your reply.

Please let me know in which CSS file the code must be added, as you mentioned.

4

Added CSS code.

But couldnt find out the code responsible for rendering the social media icons infooter.liquid