Solved

Center Newsletter Box on Craft Theme — Keep Footer Newsletter Same

jmd92
Excursionist
29 0 7

Hello,

 

Seeking to have my newsletter box centered only for this page, it appears to be left aligned. The footer newsletter is fine where it is. If anyone could help me that would be greatly appreciated. Thank you so much. 

 

https://thetypefella.com/pages/newsletter

Accepted Solution (1)

techlyser_web
Shopify Partner
1483 274 293

This is an accepted solution.

Hello @jmd92 

You can add code by following these steps

1. Go to Online Store -> Theme -> Edit code.
2. Open your theme.liquid file

3. Paste the below code before </body> on theme.liquid

<style>
@media only screen and (min-width: 750px){
    .newsletter-form {
        margin: 0 auto !important;
     }
}
</style>

techlyser_web_0-1708676332954.png

 

Techlyser || Shopify Partner || Helping eCommerce Stores
- Was my reply helpful? Click Like to let me know!
- Was your question answered? Mark it as an Accepted Solution.
- For further discussion contact: Email ID- info@techlyser.com

View solution in original post

Replies 8 (8)

PageFly-Henry
Astronaut
1069 306 260

Hi @jmd92 

This is Henry from PageFly - Landing Page Builder App

 

You can try this code by following these steps: 

Step 1: Go to Online Store->Theme->Edit code.

Step 2: Search file base.css

Step 3: Paste the below code at bottom of the file -> Save


form#contact_form {

    flex-direction: row !important;

    max-width: 100% !important;

}

 

Hope that my solution works for you.

Best regards,

Henry | PageFly

Please let me know if it works by giving it a Like or marking it as a solution!


PageFly - #1 Page Builder for Shopify merchants.


All features are available from Free plan. Live Chat Support is available 24/7.

jmd92
Excursionist
29 0 7

Thank you! 

techlyser_web
Shopify Partner
1483 274 293

This is an accepted solution.

Hello @jmd92 

You can add code by following these steps

1. Go to Online Store -> Theme -> Edit code.
2. Open your theme.liquid file

3. Paste the below code before </body> on theme.liquid

<style>
@media only screen and (min-width: 750px){
    .newsletter-form {
        margin: 0 auto !important;
     }
}
</style>

techlyser_web_0-1708676332954.png

 

Techlyser || Shopify Partner || Helping eCommerce Stores
- Was my reply helpful? Click Like to let me know!
- Was your question answered? Mark it as an Accepted Solution.
- For further discussion contact: Email ID- info@techlyser.com
jmd92
Excursionist
29 0 7

Worked perfect thank you! 

techlyser_web
Shopify Partner
1483 274 293

welcome @jmd92 😃

Techlyser || Shopify Partner || Helping eCommerce Stores
- Was my reply helpful? Click Like to let me know!
- Was your question answered? Mark it as an Accepted Solution.
- For further discussion contact: Email ID- info@techlyser.com

Dan-From-Ryviu
Shopify Partner
7711 1498 1503

Hi @jmd92 

I'm Dan from Ryviu: Product Reviews & QA

 

Please add this code to your theme.liquid file after <head> in Online Store > Themes > Edit code to change the newsletter box for this page only

{% if page.id == 95100567715 %}
<style>
.newsletter .newsletter-form {
flex-direction: row;
max-width: 100%;
}
</style>
{% endif %}


Best Regards,

Dan from Ryviu

- Helpful? Like or Accept solution! or Buy me a coffee
- Ryviu - Product Reviews app, collect product reviews, import reviews from AliExpress, Amazon, Etsy, Shopee and Walmart and CSV.
- Lookfy app: Easy and fast to create Photo Gallery, Lookbook, Shop The Look
- Enjoy 1 month of Shopify for $1. Sign up now

jmd92
Excursionist
29 0 7

Thank you!

Dan-From-Ryviu
Shopify Partner
7711 1498 1503

Very welcome

- Helpful? Like or Accept solution! or Buy me a coffee
- Ryviu - Product Reviews app, collect product reviews, import reviews from AliExpress, Amazon, Etsy, Shopee and Walmart and CSV.
- Lookfy app: Easy and fast to create Photo Gallery, Lookbook, Shop The Look
- Enjoy 1 month of Shopify for $1. Sign up now