Hi, I’m using Dawn theme and I want to make the section “image with text” full width.
Is there any way to do it?
Thanks
If you do not want them all being full-width then I would recommend adding a checkbox input setting to the section for toggling the width size.
Anyway you will want to remove the “page-width” class from the element with the class “image-with-text”.
The checkbox would use a conditional to determine if it is checked and if so either apply or remove the “page-width” class so that way you have the option of having it full-width or matching the width of the page content.
Hope that helps!
Hi @RobDukarski
Thanks, I figured it out by copy-paste the part of “rich text” section which has that full-width check box
Awesome! I am glad to know that you were able to make it work!
Hi @RobDukarski
Can you please explain how do i add the checkbox?
I deleted the “page width” and it worked, but it will be much better if i can have both options.
how did you manage to fix this?
Thanks
Hi @Shauletay
If you are using Dawn 2.0 theme or any theme that is similar to it (e.g. Sense, Craft, Crave), go to the file of the rich-text (rich-text.liquid) and copy and paste the code lines with “full_width” to the right places to the other section you want.
You will want to add a conditional around the page width class. I believe there is another section set up with one and the checkbox in the section schema. Maybe it was the rich text section if I recall correctly…
Once you find the section you can just copy-and-paste the part of the section schema and the conditional with the class to the other section and it should work.
Hope that helps!
Hi @Ben1000
Thank you for the swift response.
So i found this code in the rich-text.liquid:
is this what you referring to? if so, where do i paste it inside the image-with-text.liquid?
Thanks!
Hi @Shauletay
It requires a bit developing skills, so I hope my explanation is good for you.
I’m not sure if that is all you need to copy from the rich-text, I think that if you would search the keywords I mentioned you will find more.
Take all the sentences by the logic I explained in my last message in the rich-text section. Try to see where they are located in the image-text. If some lines not exist in the image-text, add them in the right spots. How do you know where exactly? You can see that there is a bit of similarity with the structure. These files holding not a lot of rows of codes, so I would recommand duplicating your theme and do all the experiments on a backup version until you nailed that.
Good luck!
For everyone, who has been struggling with this issue just like me, here is the SOLUTION:
Go to “Edit code” > “base.css” and change the “padding” to “0 0rem;” twice (inserted images)
If this didn’t work for you, try to change the padding in the following “@media screen” atributes for different “min-width” sizes.
Hope this will help.
