Questions & Answers
Styling Question & Answers

Styling Questions & Answers

This is the HTML structure of Questions & Answers translated into CSS rules for easy modification.

dl.rekai-accordion__list {
 
}
 
dt.rekai-accordion__header {
 
}
 
button.rekai-accordion__button {
 
}
 
button.rekai-accordion__button svg {
 
}
 
span.rekai-accordion__question-text {
 
}
 
dd.rekai-accordion__body {
 
}
 
p.rekai-accordion__answer-text {
 
}
 
p.rekai-accordion__answer-page {
 
}
 
a.rekai-accordion__link {
 
}

Data parameters custom texts in Question and Answers

Some data parameters are dedicated to creating the links to the pages with the answer.

Parameter with default value
data-text_read_about_answer="Read more about the answer: "
data-text_read_about_answer_no_title="Read more about the answer "
data-text_read_about_answer_link="here"

Example of how to use the parameters in the HTML code:

<div class="rek-prediction" data-entitytype="rekai-qna" data-nrofhits="3" data-text_read_about_answer="Curious? Read more: " ></div>

Use these texts in autocomplete

<script>
    __rekai.ready(function() {
      var rekAutocomplete = rekai_autocomplete('#search-input', {
        params: {
          text_read_about_answer: 'Read more;',
        }
      });
    });
</script>