# Use rich text editor without adding extra \<p\> tags

**URL:** <https://community.hubspot.com/t/use-rich-text-editor-without-adding-extra-p-tags/21187>\
**Category:** CMS Development\
**Tags:** content\
**Created:** [May 27, 2020, 8:06am UTC](https://community.hubspot.com/t/use-rich-text-editor-without-adding-extra-p-tags/21187 "2020-05-27T08:06:19Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![ezraassj](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/ezraassj/32/41549_2.png) [@ezraassj](https://community.hubspot.com/u/ezraassj)\
**Post date:** [May 27, 2020, 8:06am UTC](https://community.hubspot.com/t/use-rich-text-editor-without-adding-extra-p-tags/21187/1 "2020-05-27T08:06:19Z")

</div>

Hello,

I’m currently creating a blog for one of my client. I created a blog post template with custom modules.

For the main content of the article I created a module where the users can add different style of paragraph (like full text, quote text, image left text right, etc.).

When the user picks full text, a rich text editor appears (full\_text is the variable name) where he can start writting his long text.

In my HTML + HUBL it is shown like this

```auto
{% if style == "full_text" %}
 <div class="articleblock_fulltext">
 <h2 class="title">{{ item.full_text_title }}</h2>
 <p class="text">{{ item.full_text }}</p>
 </div>

{% elif style == "quote_text" %}
 <div class="block_quote">
 <p class="quote">"{{ item.quote_text }}"</p>
 </div>

{% endif %}

```

My issue is after the rich text editor has been used, in creates a new \<p\> tags inside my \<p class=“text”\> resulting then in the wrong design because it isn’t using the “text” class.

Is there a way to apply to automatically add the class=“text” when rich text editor is used ?

I could modify directly the \<p\> tag styling in the css but since some other \<p\> tags on the page are using different class I can’t do that.

---

<div class="post-metadata">

**Author:** ![Kevin-C](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/kevin-c/32/34570_2.png) [@Kevin-C](https://community.hubspot.com/u/Kevin-C)\
**Post date:** [May 27, 2020, 2:48pm UTC](https://community.hubspot.com/t/use-rich-text-editor-without-adding-extra-p-tags/21187/2 "2020-05-27T14:48:38Z")

</div>

Hey @ezraassj

In your case you can anticipate the output structure and handle it using css exclusively IMO. Specifically using the [Child Combinator](https://developer.mozilla.org/en-US/docs/Web/CSS/Child_combinator) “\>” or the [Adjacent Sibiling Combinator](https://developer.mozilla.org/en-US/docs/Web/CSS/Adjacent_sibling_combinator)

```auto
.text > p {
 /* your styles here */
}

```

Or remove the paragraph with the “text” class all together and work with the the paragraphs generated. _It important to remember that hard returns in a rich text module generate a new paragraph tags._

```auto
.articleblock_fulltext > p {
 /* style for all p tags directly under the parent */
}

or

h2.title + p {
 /* will select the first p sibling following the h2.title */
}orh2.title ~ p { /* all Ps that are siblings of h2.title */}

```

---

<div class="post-metadata">

**Author:** ![ezraassj](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/ezraassj/32/41549_2.png) [@ezraassj](https://community.hubspot.com/u/ezraassj)\
**Post date:** [May 28, 2020, 12:42pm UTC](https://community.hubspot.com/t/use-rich-text-editor-without-adding-extra-p-tags/21187/3 "2020-05-28T12:42:06Z")

</div>

Thanks @Kevin-C !

I went for the second solution you proposed and it works like a charm 🙂
