Skip to content
Grav 2.0 is officially stable. Read the announcement →
Archive

How to change CSS class of page.content() paragraphs?

Started by Muut Archive 9 years ago · 1 replies · 445 views
9 years ago

Here is the problem: Suppose I have :

  1. a CSS with formatting rules defined both in a "blog-item" class and in the "p" element.
  2. A blog post with three paragraphs and a standard item.html.twig template with these lines:
    ------------ <div class="blog-item"> {{ page.content }} </div> -----------------

Now Grav will (correctly) produce the following HTML:
--------------- <div class="blog-item"> <p>Lorem ipsum dolor sit amet, ....</p> <p>Lorem ipsum dolor sit amet, ....</p> <p>Lorem ipsum dolor sit amet, ....</p> </div> ---------------

which will not apply my blog-item rules, as they will be overridden by the more specific "p" rules. I think I need the template to produce HTML as:
--------------- <div > <p class="blog-item">Lorem ipsum dolor sit amet, ....</p> <p class="blog-item">Lorem ipsum dolor sit amet, ....</p> <p class="blog-item">Lorem ipsum dolor sit amet, ....</p> </div> ---------------

Question: what's the Twig/Grav magic that will allow me to do that?

9 years ago

You probably just need to tweak the css to target .blog-item > p rather than just .blog-item

Suggested topics

Topic Participants Replies Views Activity
Archive · by Deleted User, 9 years ago
0 1332 9 years ago
Archive · by Muut Archive, 9 years ago
2 923 9 years ago
Archive · by Muut Archive, 9 years ago
2 4053 9 years ago
Archive · by Muut Archive, 9 years ago
1 2931 9 years ago
Archive · by Muut Archive, 9 years ago
3 1109 9 years ago