Solved

Dawn - Image Banner - Add line breaker

Dabou
Pathfinder
118 2 16

Hello everyone, im trying to add a line breaker to both heading and text in the image banner sections in my store

I've seen two discussions concerning this feature here on the forums, but they don't seem to work, probably cause the image-banner.liquid has been updated since they were posted.

 

https://community.shopify.com/c/shopify-design/dawn-theme-line-break-image-banner-text/m-p/1722919

https://community.shopify.com/c/shopify-design/dawn-theme-image-banner-section-how-to-create-line-br...

Thank you.

Website: Dazzilia.com

Rate my website
https://community.shopify.com/c/shopify-design/rate-my-website/td-p/2439579
Accepted Solutions (2)

Ahsan_ANC
Shopify Partner
1362 246 312

This is an accepted solution.

Hi @Dabou in the image-banner.liquid file find the blocks settings and inside that increase the limit for heading and  text blocks, currently it is set to one by default, just change that to 2 or 3 as per your need.

Ahsan_ANC_0-1708324829569.png

 

 

then you can add headings and text that will be on new line. to reduce the space between headings add this css to the section custom css box on customizer

.banner__heading{
margin-top:0;
}

 

Contact for any custom design? Skype : ahsananc
>Was your question answered? Mark it as an Accepted Solution!
Feel Free to Contact Me at my Email: anc2277@gmail.com


To enhance and customize Shopify search and filter, I use Boost Product Filter & Search

View solution in original post

Ahsan_ANC
Shopify Partner
1362 246 312

This is an accepted solution.

add this for subheadings

Ahsan_ANC_0-1708351848920.png

 

 

.banner__text:not(:first-child) {
  margin-top: 0;
}

 

 

Contact for any custom design? Skype : ahsananc
>Was your question answered? Mark it as an Accepted Solution!
Feel Free to Contact Me at my Email: anc2277@gmail.com


To enhance and customize Shopify search and filter, I use Boost Product Filter & Search

View solution in original post

Replies 4 (4)

Ahsan_ANC
Shopify Partner
1362 246 312

This is an accepted solution.

Hi @Dabou in the image-banner.liquid file find the blocks settings and inside that increase the limit for heading and  text blocks, currently it is set to one by default, just change that to 2 or 3 as per your need.

Ahsan_ANC_0-1708324829569.png

 

 

then you can add headings and text that will be on new line. to reduce the space between headings add this css to the section custom css box on customizer

.banner__heading{
margin-top:0;
}

 

Contact for any custom design? Skype : ahsananc
>Was your question answered? Mark it as an Accepted Solution!
Feel Free to Contact Me at my Email: anc2277@gmail.com


To enhance and customize Shopify search and filter, I use Boost Product Filter & Search
Dabou
Pathfinder
118 2 16

@Ahsan_ANC that worked thanks.

Website: Dazzilia.com

Rate my website
https://community.shopify.com/c/shopify-design/rate-my-website/td-p/2439579
Ahsan_ANC
Shopify Partner
1362 246 312

This is an accepted solution.

add this for subheadings

Ahsan_ANC_0-1708351848920.png

 

 

.banner__text:not(:first-child) {
  margin-top: 0;
}

 

 

Contact for any custom design? Skype : ahsananc
>Was your question answered? Mark it as an Accepted Solution!
Feel Free to Contact Me at my Email: anc2277@gmail.com


To enhance and customize Shopify search and filter, I use Boost Product Filter & Search
Dabou
Pathfinder
118 2 16

@Ahsan_ANC thank you.

Website: Dazzilia.com

Rate my website
https://community.shopify.com/c/shopify-design/rate-my-website/td-p/2439579