refining and developping faq
This commit is contained in:
parent
5c1748482d
commit
6616c511da
|
|
@ -1,4 +1,5 @@
|
|||
<?php
|
||||
$theme_namespace = 'homegrade-theme__texte-fonctionnel';
|
||||
function getThematiqueFamilySlug($thematique_slug)
|
||||
{
|
||||
if (!$thematique_slug) {
|
||||
|
|
|
|||
|
|
@ -72,3 +72,4 @@
|
|||
@import './pages/template-archive-conseils.css';
|
||||
@import './pages/template-archive-questions.css';
|
||||
@import './pages/single-conseils.css';
|
||||
@import './pages/questions-thematiques-(faq).css';
|
||||
|
|
|
|||
|
|
@ -8,7 +8,28 @@ body {
|
|||
font-size: 20px;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
details {
|
||||
@apply bg-white shadowed rounded-2xl mb-4 px-8 py-6;
|
||||
summary {
|
||||
margin: 10px;
|
||||
/* display: inline-block; */
|
||||
@apply font-bold list-none flex justify-between items-center cursor-pointer;
|
||||
.open-close-icon {
|
||||
transition: transform 0.3s ease-in-out;
|
||||
transform: translate(0, 0%);
|
||||
display: flex;
|
||||
border: 2px solid black;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
border-radius: 50%;
|
||||
height: 26px;
|
||||
width: 26px;
|
||||
}
|
||||
}
|
||||
.content {
|
||||
@apply mt-4;
|
||||
}
|
||||
}
|
||||
|
||||
details[open] summary .open-close-icon {
|
||||
transform: translate(0, 0%) rotate(180deg);
|
||||
}
|
||||
|
|
|
|||
49
resources/css/pages/questions-thematiques-(faq).css
Normal file
49
resources/css/pages/questions-thematiques-(faq).css
Normal file
|
|
@ -0,0 +1,49 @@
|
|||
.post-question-page {
|
||||
ul.checkboxes {
|
||||
list-style: none;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
padding-left: 1em;
|
||||
}
|
||||
|
||||
ul.checkboxes li {
|
||||
list-style: none;
|
||||
margin: 1px;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
[role='checkbox'] {
|
||||
display: inline-block;
|
||||
padding: 4px 8px;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
[role='checkbox']::before {
|
||||
position: relative;
|
||||
top: 1px;
|
||||
left: -4px;
|
||||
content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='16' width='16' style='forced-color-adjust: auto;'%3E%3Crect x='2' y='2' height='13' width='13' rx='2' stroke='currentcolor' stroke-width='1' fill-opacity='0' /%3E%3C/svg%3E");
|
||||
}
|
||||
|
||||
[role='checkbox'][aria-checked='true']::before {
|
||||
position: relative;
|
||||
top: 1px;
|
||||
content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='16' width='16' style='forced-color-adjust: auto;'%3E%3Crect x='2' y='2' height='13' width='13' rx='2' stroke='currentcolor' stroke-width='1' fill-opacity='0' /%3E%3Cpolyline points='4,8 7,12 12,5' fill='none' stroke='currentcolor' stroke-width='2' /%3E%3C/svg%3E");
|
||||
}
|
||||
|
||||
[role='checkbox']:focus,
|
||||
[role='checkbox']:hover {
|
||||
padding: 2px 6px;
|
||||
border: 2px solid #005a9c;
|
||||
border-radius: 5px;
|
||||
background-color: #def;
|
||||
}
|
||||
|
||||
[role='checkbox']:hover {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
&__accordeons-container {
|
||||
@apply max-w-screen-lg mx-auto px-4 py-12;
|
||||
}
|
||||
}
|
||||
3
resources/img/graphic-assets/chevron_down.svg
Normal file
3
resources/img/graphic-assets/chevron_down.svg
Normal file
|
|
@ -0,0 +1,3 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" width="11.668" height="7.885" viewBox="0 0 11.668 7.885">
|
||||
<path id="Tracé_3614" data-name="Tracé 3614" d="M0,8.855,5.478,4.427,0,0" transform="translate(10.261 1.406) rotate(90)" fill="none" stroke="#000" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 322 B |
|
|
@ -1,42 +1,36 @@
|
|||
<?php get_header();
|
||||
<?php
|
||||
|
||||
$thematique = get_queried_object();
|
||||
$thematique_generale = get_queried_object()->parent ? get_term(get_queried_object()->parent, 'thematiques') : get_term(get_queried_object(), 'thematiques');
|
||||
$thematiqueColorSlug = getThematiqueFamilySlug($thematique_generale->slug);
|
||||
/************/
|
||||
/* PAGE FAQ */
|
||||
/************/
|
||||
?>
|
||||
<?php get_header(); ?>
|
||||
|
||||
|
||||
$current_children_thematique = get_queried_object()->parent != 0 ? get_queried_object() : null;
|
||||
|
||||
|
||||
$args = array(
|
||||
'posts_per_page' => 1,
|
||||
'post_type' => 'conseils',
|
||||
'tax_query' => array(
|
||||
array(
|
||||
'slug' => 'locations',
|
||||
<?php
|
||||
$currentThematique = get_queried_object();
|
||||
$mainThematique = getMainThematique($currentThematique);
|
||||
$thematiqueColorSlug = getThematiqueFamilySlug($mainThematique->slug);
|
||||
$sousThematiques = get_terms(array(
|
||||
'child_of' => $mainThematique->term_id,
|
||||
'taxonomy' => 'thematiques',
|
||||
'field' => 'slug',
|
||||
'terms' => get_queried_object()->slug,
|
||||
// 'include_children' => false,
|
||||
)
|
||||
)
|
||||
);
|
||||
$query_current_thematique_posts = new WP_Query($args);
|
||||
$thematique_related_page = $query_current_thematique_posts->posts[0];
|
||||
|
||||
|
||||
|
||||
$archiveQuestions = get_page_by_template('template-archive-questions.php')[0];
|
||||
'hide_empty' => true,
|
||||
));
|
||||
?>
|
||||
|
||||
|
||||
|
||||
<nav class="breadcrumbs_navigation" aria-label="breadcrumbs">
|
||||
<?php
|
||||
$current_children_thematique = get_queried_object()->parent != 0 ? get_queried_object() : null;
|
||||
$archiveQuestions = get_page_by_template('template-archive-questions.php')[0];
|
||||
?>
|
||||
<ol>
|
||||
<li><a href="<?php echo home_url() ?>">Home</a></li>
|
||||
<li><a href="<?php echo get_post_permalink($archiveQuestions) ?>"><?php echo $archiveQuestions->post_title ?></a></li>
|
||||
|
||||
<li>
|
||||
<a href="<?php echo get_term_link($thematique_generale) ?>" aria-current='location'><?php echo $thematique_generale->name ?></a>
|
||||
<a href="<?php echo get_term_link($mainThematique) ?>" aria-current='location'><?php echo $mainThematique->name ?></a>
|
||||
</li>
|
||||
<?php if ($current_children_thematique) : ?>
|
||||
<li>
|
||||
|
|
@ -47,24 +41,7 @@ $archiveQuestions = get_page_by_template('template-archive-questions.php')[0];
|
|||
</ol>
|
||||
</nav>
|
||||
|
||||
<div class="list_filters">
|
||||
<?php if ($thematique->parent) : ?>
|
||||
<?php
|
||||
$sousThematiques = get_terms(array(
|
||||
'child_of' => $thematique_generale->term_id,
|
||||
'taxonomy' => 'thematiques',
|
||||
'hide_empty' => true,
|
||||
));
|
||||
|
||||
?>
|
||||
<?php foreach ($sousThematiques as $sousThematique) : ?>
|
||||
<button data-filter="<?php echo $sousThematique->slug ?>"><?php echo $sousThematique->name ?></button>
|
||||
<?php endforeach; ?>
|
||||
<?php endif; ?>
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
<div class="post-question-page <?php echo $thematiqueColorSlug ? "post-question-page--" . $mainThematique->slug : "" ?>"">
|
||||
|
||||
<?php get_template_part(
|
||||
'template-components/posts-components/chapter-header',
|
||||
|
|
@ -72,17 +49,33 @@ $archiveQuestions = get_page_by_template('template-archive-questions.php')[0];
|
|||
array(
|
||||
'ID' => get_queried_object_id(),
|
||||
'title' => __("Les questions les plus fréquentes sur ", "homegrade-theme__texte-fonctionnel__faq-archive-questions") . get_queried_object()->name,
|
||||
'sub-title' => $thematique->name,
|
||||
'thematique' => $thematique,
|
||||
'thematique_generale' => $thematique_generale,
|
||||
'sub-title' => $currentThematique->name,
|
||||
'thematique' => $currentThematique,
|
||||
'thematique_generale' => $mainThematique,
|
||||
'thematiqueColorSlug' => $thematiqueColorSlug,
|
||||
)
|
||||
|
||||
); ?>
|
||||
<section class=" post-question-page__accordeons-container ">
|
||||
<?php if ($mainThematique && $sousThematiques) : ?>
|
||||
<div class=" thematiques_filters">
|
||||
<h3><?php echo __("Filtrer par catégories", $theme_namespace) ?></h3>
|
||||
|
||||
|
||||
<ul class="thematiques_filters__list">
|
||||
<?php foreach ($sousThematiques as $sousThematique) : ?>
|
||||
<li data-filter="<?php echo $sousThematique->slug ?>">
|
||||
<input type="checkbox" title="<?php echo $sousThematique->name ?>" name="veggy01" id="veggy01" />
|
||||
<label for="veggy01"><?php echo $sousThematique->name ?></label></p>
|
||||
|
||||
<!-- <div role="checkbox" aria-checked="false" tabindex="0"><?php echo $sousThematique->name ?></div> -->
|
||||
</li>
|
||||
<?php endforeach; ?>
|
||||
</ul>
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
|
||||
<div class="post-question-page-container <?php echo $thematiqueColorSlug ? "post-question-page--" . $thematiqueColorSlug : "" ?>"">
|
||||
<?php
|
||||
|
||||
$query_args = array(
|
||||
'post_type' => 'questions',
|
||||
'posts_per_page' => -1,
|
||||
|
|
@ -90,34 +83,37 @@ $archiveQuestions = get_page_by_template('template-archive-questions.php')[0];
|
|||
array(
|
||||
'taxonomy' => 'thematiques',
|
||||
'field' => 'term_id',
|
||||
'terms' => $thematique_generale->term_id,
|
||||
|
||||
'terms' => $mainThematique->term_id,
|
||||
)
|
||||
)
|
||||
);
|
||||
$questions = new WP_Query($query_args);
|
||||
$relatedTaxQuestions = new WP_Query($query_args);
|
||||
|
||||
|
||||
?>
|
||||
|
||||
<?php if ($questions->have_posts()) : while ($questions->have_posts()) : $questions->the_post(); ?>
|
||||
<h2 aria-live=" polite"><?php echo __("Nombre de résultats", 'homegrade-theme__texte-fonctionnel') . " : " . count($relatedTaxQuestions->posts) ?></h2>
|
||||
<?php if ($relatedTaxQuestions->have_posts()) : while ($relatedTaxQuestions->have_posts()) : $relatedTaxQuestions->the_post(); ?>
|
||||
|
||||
<details class=" question">
|
||||
<summary>
|
||||
<?php the_title(); ?>
|
||||
<!-- <h2><?php the_title(); ?></h2> -->
|
||||
<div class="open-close-icon">
|
||||
<img src="<?php echo get_template_directory_uri() . '/resources/img/graphic-assets/chevron_down.svg' ?>" class="open-close-cta" alt="" />
|
||||
</div>
|
||||
</summary>
|
||||
<div class="content">
|
||||
<div class="content entry-content">
|
||||
<?php the_content(); ?>
|
||||
</div>
|
||||
|
||||
</details>
|
||||
|
||||
<?php endwhile ?>
|
||||
<?php endif; ?>
|
||||
</section>
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
<?php
|
||||
get_footer();
|
||||
|
|
|
|||
Loading…
Reference in New Issue
Block a user