Olá todo mundo hoje eu venho aqui para mostrar como criar uma página de FAQ no WordPress, eu vou ensinar de uma forma simples e rápida, existe varias maneiras desde usando a Category até a utilização de Custom Post Type, mas eu vou ensinar pela Category para que não fique muito complexa a explicação, vamos lá então.

Antes de tudo entre na página de Categorias “Post > Categorias” e adicione um nova categoria chamada “FAQ” e depois clique em “Adicionar”, pós disso cadastre seu FAQ “post” ou até mesmo uns testes na categoria que acabamos de criar.

Agora vamos criar um novo arquivo chamado “category-faq.php” dentro da pasta “themes” do seu WordPress, após de criá-la vamos colocar o mesmo código que se encontra dentro do tema padrão do ‘twentytwelve’ somente com uma alteração na parte do WHILE:

<?php get_header(); ?>

<section id="primary" class="site-content">
    <div id="content" role="main">

     <?php if ( have_posts() ) : ?>
        <header class="archive-header">
           <h1 class="archive-title"><?php printf( __( 'Category Archives: %s', 'twentytwelve' ), '<span>' . single_cat_title( '', false ) . '</span>' ); ?></h1>
           <?php if ( category_description() ) : // Show an optional category description ?>
           <div class="archive-meta"><?php echo category_description(); ?></div>
           <?php endif; ?>
        </header>

        <?php while ( have_posts() ) : the_post(); ?>

        <?php endwhile; ?>

     <?php endif; ?>

      </div><!-- #content -->
</section><!-- #primary -->

<?php get_sidebar(); ?>
<?php get_footer(); ?>

Depois de criarmos a nossa categoria personalizada, vamos adicionar uma function dentro do arquivo functions.php, para nós colocarmos um limite de posts. Eu vou determinar que ele mostre todos os “posts” cadastrados dentro da categoria “FAQ”:

function limit_posts_per_page() {
   if ( is_category('faq') )
     return -1;
   }
add_filter('pre_option_posts_per_page', 'limit_posts_per_page');

Na linha 2 eu coloquei o slug da categoria que é ‘faq’, mas se vocês desejarem pode colocar o ID da categoria, mas teria que tirar da aspas simples e deixar somente o ID.

Já na linha 3 eu determinei que irá mostrar todos os post, porque eu adicionei o valor “-1”, mas nas outras categorias que não sejam a FAQ iram continuar com a listagem normal, o padrão do WordPress é 5 posts por página.

Agora vamos montar o nosso loop para mostrar os posts, mas antes precisamos instalar um plugin que eu desenvolvi para que fica com um efeito de toggle em JQuery.

Plugin: Function showAnswer

Para instalá-lo é simples:

1 – Coloque a pasta ‘function-showanswer’  dentro do diretório ‘/wp-content/plugins/’
2 – Ative o plugin na aba ‘Plugins’ no menu do WordPress.

Após de ativa-ló para vamos adicionar o seguinte código dentro do WHILE do arquivo category-faq.php:

<div class="loop-posts">
 <a href="javascript:void(0);" class="showAnswer" ident="<?php echo $post->post_name ;?>"><?php the_title() ;?></a>
 <div class="answers" id="answers-<?php echo $post->post_name;?>" style="display: none; ">
 <?php the_content();?>
 </div>
</div>

Após essa etapa ele já vai estar funcionando com essa aparência, mas lembrem que irá depende de cada template e css para ter uma aparência desejável:

Página Demo

Espero que vocês tenham gostado deste post e até breve, por favor se gostou compartilha o post e se tiver dúvida ou sugestão, por favor deixe um comentário. Até Mais

César Ribeiro
Written by

Hi, my name’s Cesar H. Ribeiro, I’m Brazilian and I live in São Paulo country town. I’ve been working with Web Development since 2006, I’m Web Developer Freelancer, my main specialty is deploying custom Web Sites using the WordPress platform with base, transforming PSD/Layouts for Custom Themes. In feel years with Developer Freelancer, I worked with many agencies around the world like: Brazil, Australia, USA, Germany and Austria.

Related Posts