Solved

How to make the heading of collection list centre? Also multicolumn how to set link for photo?

Nailtheland
Visitor
3 0 0

I would like to make the heading of "OUR COLLECTION" centre and make the entire section of "OUR COLLECTION" full width, under the theme DAWN. Can anyone please advise?

Also, how to make the photo under multicolumn clickable and linked?

Thanks in advance.

 

Here is the screenshot and website:

nailtheland.com

 

Screenshot 2023-04-14 at 22.00.22.png

Screenshot 2023-04-14 at 22.00.27.png

Accepted Solutions (2)

PaulNewton
Shopify Partner
6339 580 1350

This is an accepted solution.

Related search: https://community.shopify.com/c/forums/searchpage/tab/message?advanced=false&allow_punctuation=false...

 

Try the following CSS in that sections custom CSS setting(new feature)

https://help.shopify.com/en/manual/online-store/themes/theme-structure/extend/add-css 

.title-wrapper-with-link {
    justify-content: center;
    /* text align for non-flex fallback */
    text-align: center;
}

 


@Nailtheland wrote:

Also, how to make the photo under multicolumn clickable and linked?

Screenshot 2023-04-14 at 22.00.27.png


That is an advanced customization. If you need that customization you can contact me directly for services; please provide context: store url, theme name, post url and any additional requirements. Contact info in signature.

 

Search for related DIY topics:

https://community.shopify.com/c/forums/searchpage/tab/message?filter=location&q=dawn%20multicolumn%2... 

 

 

Save time & money ,Ask Questions The Smart Way


Confused? Busy? Get the solution you need paull.newton+shopifyforum@gmail.com


Problem Solved? ✔Accept and Like solutions to help future merchants

Answers powered by coffee Buy Paul a Coffee for more answers or donate to eff.org


View solution in original post

ErayBarslan
Shopify Partner
32 9 15

This is an accepted solution.

Hello @Nailtheland ,

 

To center your collection heading and make the section full width follow:

  • Admin dashboard > Themes > Customize > Click on the Section > Custom CSS
  • Into the Custom CSS field of collection section, copy:
.collection-list-wrapper {
  max-width: 100%;
  padding-left: 0;
  padding-right: 0;
}

.title-wrapper-with-link {
  justify-content: center;
  text-align: center;
}

a {
  text-align: center;
}​

 

 

I have additionally added the code to center the link text so it won't be sticked to the left of the screen. I hope it helps and good luck! If you get stuck with editing the collection or changing multicolumn image to link, feel free to reach out for further assistance.

Best regards,
Eray Barslan | Shopify Developer & Designer

• You can reach me at: My website
• I provide Shopify solutions that meet your unique business needs.
• Was my answer helpful? Like & Mark as solution to let me know.

View solution in original post

Replies 4 (4)

PaulNewton
Shopify Partner
6339 580 1350

This is an accepted solution.

Related search: https://community.shopify.com/c/forums/searchpage/tab/message?advanced=false&allow_punctuation=false...

 

Try the following CSS in that sections custom CSS setting(new feature)

https://help.shopify.com/en/manual/online-store/themes/theme-structure/extend/add-css 

.title-wrapper-with-link {
    justify-content: center;
    /* text align for non-flex fallback */
    text-align: center;
}

 


@Nailtheland wrote:

Also, how to make the photo under multicolumn clickable and linked?

Screenshot 2023-04-14 at 22.00.27.png


That is an advanced customization. If you need that customization you can contact me directly for services; please provide context: store url, theme name, post url and any additional requirements. Contact info in signature.

 

Search for related DIY topics:

https://community.shopify.com/c/forums/searchpage/tab/message?filter=location&q=dawn%20multicolumn%2... 

 

 

Save time & money ,Ask Questions The Smart Way


Confused? Busy? Get the solution you need paull.newton+shopifyforum@gmail.com


Problem Solved? ✔Accept and Like solutions to help future merchants

Answers powered by coffee Buy Paul a Coffee for more answers or donate to eff.org


RUUJIGLOBAL
Tourist
4 0 0

Thank you this worked

 

ErayBarslan
Shopify Partner
32 9 15

This is an accepted solution.

Hello @Nailtheland ,

 

To center your collection heading and make the section full width follow:

  • Admin dashboard > Themes > Customize > Click on the Section > Custom CSS
  • Into the Custom CSS field of collection section, copy:
.collection-list-wrapper {
  max-width: 100%;
  padding-left: 0;
  padding-right: 0;
}

.title-wrapper-with-link {
  justify-content: center;
  text-align: center;
}

a {
  text-align: center;
}​

 

 

I have additionally added the code to center the link text so it won't be sticked to the left of the screen. I hope it helps and good luck! If you get stuck with editing the collection or changing multicolumn image to link, feel free to reach out for further assistance.

Best regards,
Eray Barslan | Shopify Developer & Designer

• You can reach me at: My website
• I provide Shopify solutions that meet your unique business needs.
• Was my answer helpful? Like & Mark as solution to let me know.
Nailtheland
Visitor
3 0 0

Thank you so much for your reply. It is super helpful. Cheers.