Faq template, how to make just one?

[franciccio-ITALIANO]

Hi, I would like to create a template for an UNPREPARETERMINED number of faqs.
Each faq contains 2 variable fields, the question and the answer. I don't know how to proceed.
The simplest idea is to create 10 Templates, first template with 1 faq, second template with 2 faq, third template with 3 faq etc. 
But I think that with processwire there should be a method to create a single template...

[bernhard]

Your usecase FAQ sounds like it would be a good fit for a repeater field. Add two fields to the repeater "question" and "answer" then you can add 1 to n items of FAQs to your page.

[ottogal]

Salve, @franciccio-ITALIANO
I think you don't need several templates. Just create one template and add the two fields (of type Textarea). Then for each FAQ you create a page that is using this template.

[aagd]

Like @bernhard said, a repeater works well for this. The output in the template could look like this:

<ul>
<?php foreach($page->repeater_faq as $faq):?>
  <li>
    <h2><?=$faq->question?></h2>
    <p><?=$faq->answer?></p>
  </li>
<?php endforeach;?>
</ul>

If you want to optimize the FAQ page for Google SEO you could additionally add the content in JSON format (not visible on the page).

More Info: https://developers.google.com/search/docs/advanced/structured-data/faqpage

This is what I usually use:

<script type="application/ld+json">
{
  "@context": "https://schema.org",
  "@type": "FAQPage",
  "mainEntity": [
<?php
$items = $page->repeater_faq;
$item_count = count($items);
foreach($items as $key => $value):?>
    {
      "@type": "Question",
      "name": <?=json_encode($value->question)?>,
      "acceptedAnswer": {
        "@type": "Answer",
        "text": <?=json_encode($value->answer)?>
      }
    }<?php if ($key === $item_count - 1){echo "\n";} else {echo ",\n";} ?>
<?php endforeach;?>
  ]
}
</script>

 

[franciccio-ITALIANO]

8 hours ago, aagd said:

Like @bernhard said, a repeater works well for this. The output in the template could look like this:

<ul>
<?php foreach($page->repeater_faq as $faq):?>
  <li>
    <h2><?=$faq->question?></h2>
    <p><?=$faq->answer?></p>
  </li>
<?php endforeach;?>
</ul>

Ok thanks but 2 problems have arisen.
The html code of each faq is as follows:

<li>
				   
	<a class="uk-accordion-title" href="#"><div class="fa fa-comments"></div><h2 class="perh2faq"><?=$faq->faq_question?></h2></a>
				   
		<div class="uk-accordion-content">
				
          	<p style="color: white;">
							
				<?=$faq->faq_answer?>
								
			</p>
          
		</div>				   
				   
</li>

So, what you need to repeat is not only the question and the answer, but also the html graphic frame that contains the question and the answer.
I added an html texarea to the repeater field, but the block repeat doesn't work. I add repeating blocks (html codes + question + answer), but processwire always shows me one, specifically, the last one added. And so the faq page always remains with only one question and one answer, even if I add 5 blocks.

To display the repeater blocks I used only this code:

<?php foreach($page->faq_ripetitor as $faq):?>
<?php endforeach;?>

What did I do wrong?

 

[johndoe]

13 hours ago, franciccio-ITALIANO said:

What did I do wrong?

My guess would be that you have nothing in your foreach loop. You should put html code in your faq template file, not in the repeater field. Repeater field should only have question and answer.

<?php foreach($page->faq_ripetitor as $faq):?>

<li>
				   
	<a class="uk-accordion-title" href="#"><div class="fa fa-comments"></div><h2 class="perh2faq"><?=$faq->faq_question?></h2></a>
				   
		<div class="uk-accordion-content">
				
          	<p style="color: white;">
							
				<?=$faq->faq_answer?>
								
			</p>
          
		</div>				   
				   
</li>

<?php endforeach;?>

[franciccio-ITALIANO]

 thanks now it works!

But there is a problem with the text-answer.
The code is as follows:

<p style="color: white;">
							
	<?=$faq->faq_answer?>
								
</p>

In front-end it appears to me: 

<p>my faq-answer</p>

In the "Edit Field" -> "Details" section, I tried changing the "HTML Entity Encoder" options, but it doesn't work. The html code (<p></p>) always appears...

 

 

 

 

 

[johndoe]

@franciccio-ITALIANO If you have an HTML Entity Encoder in Text Formatters you need to remove it, because that is causing the issue you're describing.

[bernhard]

On 3/30/2022 at 4:50 PM, franciccio-ITALIANO said:

In front-end it appears to me: 

<p>my faq-answer</p>

In the "Edit Field" -> "Details" section, I tried changing the "HTML Entity Encoder" options, but it doesn't work. The html code (<p></p>) always appears...

That <p> tags come from ckeditor: https://processwire.com/talk/topic/10999-ckeditor-remove-wrapping-from-in-source-code/

 

The easiest solution would be to change your code to this:

<div style="color: white;">	
	<?=$faq->faq_answer?>							
</div>

 

[franciccio-ITALIANO]

 I changed the html code from <p></p> to <div></div> but that doesn't work either.

[franciccio-ITALIANO]

Then I removed CKE and replaced it with simple "textarea", but <p></p> always appears on the sides of the text. It's amazing. I don't know what I'm doing wrong...