Solved

Centering Text Home Page Featured Collection Section

a46128mg
Tourist
5 0 2

Hi,

 

I am trying to centre the description text on my home page, in particular under the featured collection sections. I am able to center the heading with no problem but not the description for some reason.

 

Does anyone have any suggestions for this?

截圖 2024-03-07 15.22.58.png

 

Accepted Solution (1)
Dan-From-Ryviu
Shopify Partner
7566 1461 1459

This is an accepted solution.

Hi @a46128mg 

Please add this code to your theme.liquid file after <head> in Online Store > Themes > Edit Code 

<style>
.collection__description { text-align: center; }
</style>

- Helpful? Like or Accept solution! - Buy me a codefee 🙂
- 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

View solution in original post

Replies 13 (13)

Moeed
Shopify Partner
3697 932 1166

Hey @a46128mg 

 

Welcome to Shopify Community! Can you share your Store URL so I can have a look on it? Also, if you have password enabled then please share the password as well. Your cooperation would be greatly appreciated.

 

Best Regards,
Moeed

Need a Shopify developer? Chat on WhatsApp


- For Shopify Design Changes | Shopify Custom Coding | Custom Modifications
- Your Coffee Tip and my code, A perfect blend. ❤️

Dan-From-Ryviu
Shopify Partner
7566 1461 1459

Hi @a46128mg 

Dan here from Ryviu: Product Reviews & QA app.

Could you share your store URL so I can provide the code to do that? 

- Helpful? Like or Accept solution! - Buy me a codefee 🙂
- 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

Dan-From-Ryviu
Shopify Partner
7566 1461 1459

This is an accepted solution.

Hi @a46128mg 

Please add this code to your theme.liquid file after <head> in Online Store > Themes > Edit Code 

<style>
.collection__description { text-align: center; }
</style>

- Helpful? Like or Accept solution! - Buy me a codefee 🙂
- 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

a46128mg
Tourist
5 0 2

Thanks a lot! Successed!

Dan-From-Ryviu
Shopify Partner
7566 1461 1459

You are very welcome!

- Helpful? Like or Accept solution! - Buy me a codefee 🙂
- 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

a46128mg
Tourist
5 0 2

Sorry, wanna ask more.

What can I do if we want to add a section so that we could select the description positition(left/right/center) from backend platform?

BrainStation23
Shopify Partner
276 46 44

Yes you can do it you need to add some schema code .
Like this 

BrainStation23_0-1709797420562.png

 

Brain Station 23 PLC
- Was my reply helpful? Click Like to let me know!
- Was your question answered? Mark it as an Accepted Solution
Email: js.team@brainstation-23.com
Dan-From-Ryviu
Shopify Partner
7566 1461 1459

Yes, as @BrainStation23 mentioned, it could be, but we need to add customized code. 

- Helpful? Like or Accept solution! - Buy me a codefee 🙂
- 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

a46128mg
Tourist
5 0 2

Would you mind share the customized code~ tks!

BrainStation23
Shopify Partner
276 46 44

 

 {
      "type": "select",
      "id": "text_position",
      "options": [
        {
          "value": "left",
          "label": "t:sections.multicolumn.settings.text_position.options__1.label"
        },
        {
          "value": "center",
          "label": "t:sections.multicolumn.settings.text_position.options__2.label"
        },
        {
          "value": "right",
          "label": "t:sections.multicolumn.settings.text_position.options__3.label"
        }
      ],
      "default": "left",
      "label": "t:sections.multicolumn.settings.text_position.label"
    },

Based on this code you need to change your liquid file code

 

Brain Station 23 PLC
- Was my reply helpful? Click Like to let me know!
- Was your question answered? Mark it as an Accepted Solution
Email: js.team@brainstation-23.com
Moeed
Shopify Partner
3697 932 1166

Hey @a46128mg 

 

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>
.collection__description.body.rte.scroll-trigger.animate--slide-in p {
    text-align-last: center !important;
}
</style>

RESULT:

Moeed_0-1709796864999.png

 

If I managed to help you then, don't forget to Like it and Mark it as Solution!

 

Best Regards,
Moeed

Need a Shopify developer? Chat on WhatsApp


- For Shopify Design Changes | Shopify Custom Coding | Custom Modifications
- Your Coffee Tip and my code, A perfect blend. ❤️

BrainStation23
Shopify Partner
276 46 44

Hi @a46128mg 

You can follow these steps to solve your problem 

Go to Online Store->Edit Code->Find theme.liquid file

Add the bellow code at the bottom of the file above </head> tag 

<style>
.collection__description.body.rte.scroll-trigger.animate--slide-in p {
    text-align-last: center !important;
}
</style>

Result::

Screenshot 2024-03-07 133907.png

 

Brain Station 23 PLC
- Was my reply helpful? Click Like to let me know!
- Was your question answered? Mark it as an Accepted Solution
Email: js.team@brainstation-23.com