Re: How to align only a specific text block to the left? I need the other one to stay centered

Solved

How to align only a specific text block to the left? I need the other one to stay centered

romanstanec24
New Member
9 0 0

Hello, could anyone help out? The more payment options is actually a link that redirects to a paypal checkout and it should be centered, but I want the description below (the wifi money guide contains...) to be aligned to the left.

Screenshot from 2024-04-08 14-48-16.png

 Thank you in advance

Accepted Solution (1)

Vinsinfo
Shopify Partner
351 125 118

This is an accepted solution.

@romanstanec24Please follow the below steps to update the alignment of the text block. Let me know whether it is helpful for you.

 
1. From admin, go to "Online Store" -> "Themes".
2. Click "Customize" button from the current theme.
3. Click the "More Payment Options" text block. In that text block, update the "Text style" from "Body" to "Subtitle" like in the attached screenshot.
Vinsinfo_0-1712585705002.png
4. Click the "Featured product" section and paste below code in the "Custom CSS" field like in the attached screenshot.

 

 

.featured-product p.product__text.inline-richtext {
    text-align: left !important;
}
.featured-product p.product__text.inline-richtext.subtitle {
    text-align: center !important;
    font-size: 1.6rem !important;
}

 

 

Vinsinfo_1-1712586176310.png

 

5. Then, the final output will be like.
Vinsinfo_2-1712586188917.png

 

Please provide your support by click "Like" and "Accepted" if our solution works for you. Thanks for your support.
Please reach out to bizdev@vinsinfo.com for any enquires related to Shopify.
Our Services: Custom Theme Development, Theme Customization, Custom Feature Implementation, Data Migration, Custom APP Development, Website Optimization and Google Merchant Center Support

View solution in original post

Replies 7 (7)

PageFly-Noah
Shopify Partner
1317 233 268

This is Noah from PageFly - Shopify Page Builder App

I can help you. Please can you provide the website url. Thank you.

 

Best regards,

Noah | 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.

romanstanec24
New Member
9 0 0

Sure, it's wifimoney-guide.myshopify.com

PageFly-Noah
Shopify Partner
1317 233 268

Hi @romanstanec24  You can add code here in file theme.liquid above tag </head>

<style>
.product__text.inline-richtext{
   text-align: left !important;
}
</style>

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.

romanstanec24
New Member
9 0 0

Hello, that didn't work for me. This happened 

Screenshot from 2024-04-08 15-54-33.png

I wanted the MORE PAYMENT OPTIONS (which is also a text) to stay centered like in the screenshot in the post

PageFly-Noah
Shopify Partner
1317 233 268

You want MORE PAYMENT OPTIONS stay center, please add code here:

<style>
.product__text.inline-richtext:nth-child(1){
  text-align:center !important;
}

.product__text.inline-richtext:nth-child(2){
  text-align:left !important;
}
</style>

 

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.

Vinsinfo
Shopify Partner
351 125 118

This is an accepted solution.

@romanstanec24Please follow the below steps to update the alignment of the text block. Let me know whether it is helpful for you.

 
1. From admin, go to "Online Store" -> "Themes".
2. Click "Customize" button from the current theme.
3. Click the "More Payment Options" text block. In that text block, update the "Text style" from "Body" to "Subtitle" like in the attached screenshot.
Vinsinfo_0-1712585705002.png
4. Click the "Featured product" section and paste below code in the "Custom CSS" field like in the attached screenshot.

 

 

.featured-product p.product__text.inline-richtext {
    text-align: left !important;
}
.featured-product p.product__text.inline-richtext.subtitle {
    text-align: center !important;
    font-size: 1.6rem !important;
}

 

 

Vinsinfo_1-1712586176310.png

 

5. Then, the final output will be like.
Vinsinfo_2-1712586188917.png

 

Please provide your support by click "Like" and "Accepted" if our solution works for you. Thanks for your support.
Please reach out to bizdev@vinsinfo.com for any enquires related to Shopify.
Our Services: Custom Theme Development, Theme Customization, Custom Feature Implementation, Data Migration, Custom APP Development, Website Optimization and Google Merchant Center Support
romanstanec24
New Member
9 0 0

Thank you! Shopify support is amazing