How to change the collection list design so the text is in the middle of the picture | Dawn theme

[petitlaurierco]

Hello.

I would like my collection list on the home page to go from this

to this

Thank you !

[Tech_Coding · Accepted solution]

Hello @petitlaurierco 

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>
  .collection-list-wrapper slider-component .card--media .card__content {
       justify-content: center !important;
       top: 50% !important;
       bottom: 0 !important;
   }
</style>

my reply helpful? Click Like to let me know!
your question answered? Mark it as an Accepted Solution.

[petitlaurierco]

It worked! thank you very much!

[BSS-TekLabs]

- Here is the solution for you
- Please follow these steps:
1. Go to Online Store --> Theme --> Edit code.
2. Open your theme.liquid file
3. In theme.liquid, paste the below code before </head> and press 'Save' to save it

<style>
.collection-list-wrapper slider-component .card--media .card__content {
    justify-content: center !important;
    bottom: 60px !important;
}
</style>

- Here is the result you will achieve:

- Please press 'Like' and mark it as 'Solution' if you find it helpful. Thank you.

[BSSCommerce-B2B]

@petitlaurierco,
Step 1: Go to Admin -> Online store -> Theme > Edit code:

Step 2: Search for the file theme.liquid. And add this code before </head>

<style>
.collection-list-wrapper .card__content {
  justify-content: center!important
}
</style>

Step 3: Save and reload home page.