Www.pakistanfashionshop.com

Store Design
, , ,

Topic summary

A Shopify store owner is experiencing footer layout issues on their newly launched site, www.pakistanfashionshop.com. The problem involves misaligned footer elements, particularly with the newsletter subscription section.

Solutions Provided:

Multiple community members offered CSS-based fixes:

  • Option 1: Add custom CSS to theme.liquid file (above tag) to adjust footer block width to 80% and align content using flexbox for screens 768px and wider

  • Option 2: Use Theme Settings > Custom CSS with code that sets footer blocks to 60% width and newsletter section to 40% width for screens 750px and wider

Current Status:

One responder noted the subscribe section appears to have been removed or the design changed since the original post, though the new design looks improved. The issue may already be resolved, but alternative CSS solutions remain available if needed.

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

New opened to new store , have settings problems in footer
please how to correct this settings in footer

MENU 1
MENU 1890×394 44.2 KB

2

Hey @Pakistanpowerto

Follow these Steps:

  1. Go to Online Store
  2. Edit Code
  3. Find theme.liquid file
  4. Add the following code in the bottom of the file above </ body> tag
<style>
@media screen and (min-width: 768px) {
.footer__blocks-wrapper.grid.grid--1-col.grid--2-col.grid--4-col-tablet {
    width: 80% !important;
}
.footer__content-top.page-width {
    display: flex !important;
    align-items: self-start !important;
}
.footer-block--newsletter {
    margin-top: 0 !important;
}
}
</style>

RESULT:

image
image1375×396 13.8 KB

If I managed to help you then a Like would be truly appreciated.

Best,
Moeed

3

Hi @Pakistanpowerto ,
It seems that you’ve changed the design and the subscribe section is no longer visible.
However, the new design looks quite nice.
If you have any further questions, I’m happy to help. :slightly_smiling_face:

4

Hi @Pakistanpowerto,

Please go to Customize > Theme settings > Custom CSS and add code:

@media screen and (min-width: 750px) {
.footer__content-top {
    display: flex;
    width: 100%;
    column-gap: var(--grid-desktop-horizontal-spacing);
}
.footer__content-top .footer__blocks-wrapper {
    width: 60%;
}
.footer__content-top .footer-block--newsletter{
    width: 40%;
    align-items: flex-start;
    margin-top: 0;
}
}