Forum

Thread tagged as: Question, Problem

Regions textblock vs codeblock

Hello,

I'm trying to make a paragraph and a ul dynamic. When creating the region, if I select 'Textblock, this will output all the HTML markup and tags (it treats all the content as plain text). If I charge the region by selecting 'code block' the content output does not contain the markup.

Is there a way of making a textblock region accept HTML markup without converting this to plain text ? or should I continue using the code block region?

below is my content that I paste into the region

   <p> 
      Hello this is a test 
    </p>

    <ul class="listgfx">
      <li><span class="icon-coggreen"></span>item1.</li>
      <li><span class="icon-coggreen"></span>item2. </li>
      <li><span class="icon-coggreen"></span>item3.</li>        
    </ul>

Many thanks,
p k

p k 0 points

  • 5 years ago
Drew McLellan

Drew McLellan 2638 points
Perch Support

5 years ago

I would create a template like this:

<perch:content id="para" type="textarea" markdown="true" editor="markitup" label="Paragraph" size="m" />

<perch:repeater id="listitems" label="List items">
    <perch:before><ul class="listgfx"></perch:before>
        <li><span class="icon-coggreen"></span>
            <perch:content type="text" id="listitem" label="Item" required="true" />
        </li>
    <perch:after></ul></perch:after>
</perch:repeater>
p k

p k 0 points

5 years ago

Thanks Drew,

1) I created a new template by copying and pasting the code from your reply and called this 'new template'.

2) I created a region and selected the 'new template'

3) I pasted the following into the text area,

  <p>
      This is a test 
    </p>    

    <ul>
      <li>test1 </li>
      <li>test2 </li>
    </ul>

However, the Web page still treats this as plain text and displays all the markup

Am I missing something obvious, have I misunderstood how templates work ?

Can i continue using the code block template? this seems to work well. it keeps my markup aligned as it was pasted and is much easier to edit. I assume there aren't any negative outcomes of using this region?

Thanks,
Drew McLellan

Drew McLellan 2638 points
Perch Support

5 years ago

When editing your regions, you should see a text field and a repeater.

In the test field, enter:

This is a test

On the repeater, click the Add button and enter

test1

Click the Add button again and enter

test2

Save the region.
p k

p k 0 points

5 years ago

thanks drew, that works

my final question is , if I want to add a class to the paragraph , I assume I can amend the temple?

<perch:content id="para" class="myclass" type="textarea" markdown="true" editor="markitup" label="Paragraph" size="m" />
John Rose

John Rose 6 points

5 years ago

You would add the class to the <p> tag:

<p class="myclass">
<perch:content id="para" type="textarea" markdown="true" editor="markitup" label="Paragraph" size="m" />
</p>
p k

p k 0 points

5 years ago

Thanks John,

is there any reason not to use the code region ? seems much easier and the markup stays aligned when you inspect source
Drew McLellan

Drew McLellan 2638 points
Perch Support

5 years ago

You can't actually do that, as you'll end up with one p tag nested inside the other.

Better to go with:

<div class="myclass">
<perch:content id="para" type="textarea" markdown="true" editor="markitup" label="Paragraph" size="m" />
</div>