How can I place a header and description on an image CTA using the Dawn theme?

Store Design
, ,
1

I’m trying put my header and description on top of an image as a CTA but currently I can only have it under the image using the Multicolumn block. Is there a work around for this? The design I want to achieve is below:

Screen Shot 2023-02-16 at 11.34.26 am.jpg
Screen Shot 2023-02-16 at 11.34.26 am.jpg1078×577 93 KB

This is how it looks in the theme editor right now:

Screen Shot 2023-02-16 at 11.36.04 am.png
Screen Shot 2023-02-16 at 11.36.04 am.png1211×807 212 KB

I am currently using the Dawn theme.

Thanks in advance :slightly_smiling_face:

2

Hello @victorying

To provide you with the most precise solution in this case, could you please share your page URL ( with pass if your store password is enabled )?

Thank you and hope to hear from you.
Best regards,
GemPages Support Team

3

Hi! The url is https://www.killercondiments.com.au/

There’s no password

4

Hi @victorying

Thanks for your reply. Kindly follow steps below:

  1. Go to your Online store > Themes > Edit code
  2. Open your theme.liquid file
  3. Paste the below code before

I hope the above is useful to you.
Best regards,
GemPages Support Team

5

Hi @victorying ,

Please go to Actions > Edit code > Assets > base.css file and paste this at the bottom of the file:

#shopify-section-template--16039232700589__b10f152a-043a-4315-850f-0054bb070e7c .multicolumn-card__info {
    position: absolute;
    left: 0;
    text-align: center;
    top: 50%;
    transform: translateY(-50%);
}

Hope it helps!

6

Thank you so much!

7

Thank you so much! I will probably use your solution but both solutions work well :slightly_smiling_face: