How do I get spaces between my paragraphs on my collections page?

Solved
AlexTheGreatest
Tourist
3 0 1

Hello all,

I'm trying to figure out how to get spaces between paragraphs on my collection pages.

for example when I type it out like this:

Test Space.jpg

It shows on the site like this:

Test Space 2.jpg

 

Notice that there isn't any return space between the two paragraphs?! I've tried just hitting enter, shift eneter, <p></p>, <br>, <pre>, nothing seems to be adding space to the text! 

Anyone have any solutions or help?

0 Likes
iDoThemes
Trailblazer
137 29 51

What's the CSS display behavior of the parent element? If it's something like flex it might be doing this. Hard to say without a store link.

Developer of Liquify Chrome Extension -- Enhance the Shopify Theme Code Editor

Theme Developer -- Drop me a line
0 Likes
AlexTheGreatest
Tourist
3 0 1

I have no idea what any of that means aha.

Here is a link to one of the collections though.

https://1584miniatures.ca/collections/artisan-guild

There should be a paragraph break right here:

Screenshot_20210925-223404_Chrome.jpg

 

 

 

0 Likes
iDoThemes
Trailblazer
137 29 51

This is an accepted solution.

In your theme code there should be a file called pre_theme.scss

If you add this to the bottom of that file it should work:

.mg__0 {
  white-space: pre-wrap;
}

iDoThemes_0-1632643546719.png

 

 

Developer of Liquify Chrome Extension -- Enhance the Shopify Theme Code Editor

Theme Developer -- Drop me a line
iDoThemes
Trailblazer
137 29 51

If the above causes any issues, you can use a more specific selector like this instead:

.template-collection .page-head .mg__0 {
    white-space: pre-wrap;
}

 

Developer of Liquify Chrome Extension -- Enhance the Shopify Theme Code Editor

Theme Developer -- Drop me a line
0 Likes
AlexTheGreatest
Tourist
3 0 1

It worked! Thank you so much!