I keep getting "All top level nodes must be '<p>' tags" when I try to use richtext

Technical Q&A
1

Here’s the full error message:

This file contains the following errors:

  • Error: Invalid block ‘text’: setting with id=“description” default is invalid richtext. All top level nodes must be ‘

    ’ tags

And here’s the code for the file:


  

    
      
      

        {% for block in section.blocks %}          
          ##### {{ block.settings.title }}
          
            

              {{ block.settings.description }}
            

          
        
        {% endfor %}           
    
     
      
  

{% schema %}
{
	"name": "FAQs",
	"max_blocks": 50,
	"settings": [],
	"blocks" : [
		{
			"type": "text",
			"name": "FAQ",
			"settings": [
				{
					"type": "text",
					"id": "title",
					"default": "Question",
					"label": "Question"
				},
				{
					"type": "richtext",
					"id": "description",
					"default": "Answer goes here...",
					"label": "Text"
				}
			]
		}
	]	
}
{% endschema %}
2

Hi @cedrichadjian

Aibek is here from Speedimize.io

For richtext, you need to wrap the default value in the

tag
Change it like here:

{
					"type": "richtext",
					"id": "description",
					"default": "

Answer goes here...

",
					"label": "Text"
				}
8 Likes
3

Awesome, thank you so much!

4

Glad you like it!

If it was useful and helpful, please don’t forget to LIKE or ACCEPT THE SOLUTION

5

I know this already has an answer, but I’ll explain why and the gotcha with richtext.

Richtext injects

tags for text entered into the widget, but doesn’t when a default is set. If someone was trying to be clever and used this in their liquid code:


{{ section.settings.richtext_content }}

, it will still inject a new p element for the default and set the empty

element in the above code to display:none.

Like the error mentions, the outer tags for richtext have to be

elements. Any W3C-mandated valid elements for use inside

tags can also be used in the default, as long as they’re wrapped in an outer

tag. Example valid schema:

{
      "type": "richtext",
      "id": "top_level_description",
      "label": "Description",
      "default": "

So here's a sample **description** of some *FAQ* items

",
      "info": "Leave empty to disable description"
}
6

Hello, where do I paste this code?

7

Where do u find it?

8

where do i go to be able to make this change i am not good with codes and i dont see where to change the code

1 Like
9

What i see that works for me is typing text. Not copying. Try typing text instead of copy-paste :flushed_face: