How can I adjust spacing and text size in my collections?

Store Design
1

Hello

I would like to customize some things.

  1. no space between collections

  2. bigger collection title and caption like the photo on each image.

  3. Collection header → center

Screen Shot 2022-12-12 at 6.20.23 PM.png
Screen Shot 2022-12-12 at 6.20.23 PM.png2484×1072 241 KB

I want to make it like this photo below

Screen Shot 2022-12-12 at 6.20.04 PM.png
Screen Shot 2022-12-12 at 6.20.04 PM.png2482×906 612 KB

1 Like
2

HI @oscaroline
Which theme you are using for your store?
Can you share the collection section code, then we will help you.

3

Hello @oscaroline ,

Glad to support you to day.

According to my understanding, you want customize like this:

GemPages_0-1670900323453.png
GemPages_0-1670900323453.png1910×706 147 KB

If I’m correct, you can check out my suggestion below to make it:

  1. Go to Edit code on Online Store:

GemPages_1-1670900382450.png
GemPages_1-1670900382450.png399×194 24.3 KB

  1. Add my code above the tag on file Theme.liquid:

GemPages_2-1670900469344.png
GemPages_2-1670900469344.png1465×869 49.2 KB

*Note: you can replace the number 15, 65 with another number to be able to move the collection title you want. I added code to make text shadow because the Text have color white so it’s hard to see

I hope you find the answer helpful. If you need further support, do not hesitate to reach out to us.

Kind & Best regards,
GemPages Support Team.

4

Thank you,

Is there anyway I can make the collection list full length with no space on each side? and add a caption on top of each title?

like this?

Screen Shot 2022-12-12 at 6.20.04 PM.png
Screen Shot 2022-12-12 at 6.20.04 PM.png2482×906 612 KB

5

@oscaroline

yes, please try this code css file

  1. Go to Online Store->Theme->Edit code
  2. Asset->/base.css ->paste below code at the bottom of the file.
#shopify-section-template--16736191480130__874e45f2-6e61-496e-bf8e-abef837469ef .collection-list-wrapper .collection-list{
	column-gap: unset !important;
}
#shopify-section-template--16736191480130__874e45f2-6e61-496e-bf8e-abef837469ef .collection-list-wrapper .title-wrapper-with-link {
	justify-content: center !important;
}
#shopify-section-template--16736191480130__874e45f2-6e61-496e-bf8e-abef837469ef .collection-list-wrapper .card.card--standard.card--media .card__content {
	top: 65% !important;
    transform: translateY(65%) !important;
	left: 15% !important;
}
#shopify-section-template--16736191480130__874e45f2-6e61-496e-bf8e-abef837469ef .collection-list-wrapper .card.card--standard.card--media .card__content .full-unstyled-link {
	font-size: 25px;
    text-shadow: 0px 2px 4px #000;
}
6

Hello @oscaroline
Please share your website URL.

7

www.sundaypaloma.com