My experience with Prismic as a headless CMS has been mostly positive, but I recently encountered an issue that surprised me - the lack of support for a simple blockquote. It's baffling to me that such a basic HTML element is not natively supported by Prismic. Although they are considering adding it to their editor in the future, the current workaround involves using labels and applying them to text, resulting in <span> tags rather than a standard <blockquote> tag.
The problem arises when trying to quote multiple paragraphs within a larger body of text in the Rich Text editor. Instead of a single cohesive blockquote, each paragraph is wrapped in individual <span> tags, making it challenging to style them as one coherent block with CSS.
<p><span class="my-label">Paragraph 1 text</span></p>
<p><span class="my-label">Paragraph 2 text</span></p>
<p><span class="my-label">Paragraph 3 text</span></p>
<p><span class="my-label">Paragraph 4 text</span></p>
As a Nuxt app user utilizing v-html, navigating these labeled items within a larger text body can be cumbersome without having to resort to complex code manipulations or switching to a different CMS or markdown system.
When attempting to target these spans with CSS, achieving a seamless look for the entire block becomes quite tricky.
- Is there any way for a Prismic user to include a
<blockquote>tag directly in the content through the Prismic editor? - Can CSS help unify these multiple paragraphs into a singular block appearance with ease? As someone not well-versed in CSS intricacies, I find adjusting padding and line heights for this purpose quite daunting.