Summary
Learn how to add faq-item like elements to your documents. faq-item element contain a question.header and an answer/body to the question. While the question should always be a text, the answer to the question can be simple text or any rich content that is allowed in markdown. Any Docaroo component can be used to render the answer to a question, including importing content from external sources, at build time or run time.
Simple FAQ item
In a simple FAQ item both question and answer are simple texts. Markdown syntax for text format can be used to enrich the annswer.
{% assign q = "This is a question" %}
{% assign a = "This is the answer to " | append: q %}
{% include elements/faq-item.html q=q a=a %}
SIMPLE FAQ ITEM
This is a question
This is the answer to This is a question
END SIMPLE FAQ ITEM
Rich content FAQ item
In a rich content FAQ item the question is always simple texts. Markdown syntax for text format can be used. The answer to the question (the content of the FAQ item) is a rich media content. Any Docaroo component can be used to render the answer to a question, including importing content from external sources, at build time or run time.
{% assign q = "How was rock invented?" %}
{% capture vid %}
{% include elements/youtube.html id="_IVyPi5-t1s" center=true %}
{% endcapture %}
{% include elements/faq-item.html q=q a=vid %}
RICH CONTENT FAQ ITEM
END RICH CONTENT FAQ ITEM
External content FAQ item
Faq items can contain imported content too, but only in the body. The question (header) shall be always simple text.
{% assign q = "External content here" %}
{% capture ec %}
{%
ExternalSiteContent {
"markdown": true,
"file_path":"partials/external-content-demo/faq-demo.md",
"ignore_wp_shortcodes": true,
"start_marker": "fullFile",
"include_start_marker": false,
"end_marker": "fullFile",
"include_end_marker": false,
"needAuth": false
}
%}
{% endcapture %}
{% include elements/faq-item.html q=q a=ec %}
EXTERNAL CONTENT FAQ ITEM
External content here
Docaroo suports 2 types of text search:
- Native search
- Algolia Docs search
Additionally, we provide an advanced search based on different parameters such as the taxonomies.
END EXTERNAL CONTENT FAQ ITEM
FAQ section
Adding FAQ items one after the other will result in a FAQ section.
{% assign q = "This is a question" %}
{% assign a = "This is the answer to " | append: q %}
{% include elements/faq-item.html q=q a=a %}
{% assign q = "External content here" %}
{% capture ec %}
{%
ExternalSiteContent {
"markdown": true,
"file_path":"partials/external-content-demo/faq-demo.md",
"ignore_wp_shortcodes": true,
"start_marker": "fullFile",
"include_start_marker": false,
"end_marker": "fullFile",
"include_end_marker": false,
"needAuth": false
}
%}
{% endcapture %}
{% include elements/faq-item.html q=q a=ec %}
FAQ SECTION
This is a question
This is the answer to This is a question
External content here
Docaroo suports 2 types of text search:
- Native search
- Algolia Docs search
Additionally, we provide an advanced search based on different parameters such as the taxonomies.
END FAQ SECTION
Observe that the FAQ item question/header will be included in the page ToC
Take a look to the FAQ page of this site to understand better the layout of multiple FAQ items. We do not recommend to overuse this component. It is always better to alternate regular content and FAQ items and to not have more than 5 such items in one section because the readibility of the document may be affected.
On this page