Filtro Select de Cidades/Bairro dinamico – Pafe Piotnet, WordPress

Reproduzir vídeo

Descrição

Neste vídeo, você vai aprender a criar uma funcionalidade incrível no WordPress usando o construtor Elementor Page Builder, Pafe Piotnet, Jet Engine e Jet smartfilter da crocoblocks. Mostro como criar um select de postagens dinâmico, onde é possível salvar a pesquisa no cookie e exibir os resultados corretamente. Utilizamos códigos jQuery e as seguintes funções do tema: bairro_terms_shortcode, get_bairro_cookie e get_unidades_ids_by_bairro. Essa funcionalidade é perfeita para quem quer criar sites avançados no WordPress, como por exemplo, um catálogo de imóveis, onde é possível filtrar por bairro. Além disso, você também vai aprender a trabalhar com taxonomias e cookies, o que é fundamental para o desenvolvimento de sites no WordPress.

Códigos

jQuery - Seta o valor do Select no Cookie e da um refresh na div
<script>
	jQuery(document).ready(function(){
  jQuery("#form-field-bairro").on('change', function(){
    var bairro = this.value;
    var d = new Date();
    d.setTime(d.getTime() + (30*24*60*60*1000));
    var expires = "expires="+ d.toUTCString();
    document.cookie = "bairroselect=" + bairro + ";" + expires + ";path=/";
    jQuery('.conteudo').load(window.location.href + " .conteudo");
  });
});
</script>
Shortcode - Retorna todos os bairros no select do Piotnet
function bairro_terms_shortcode() {
    $args = array(
        'taxonomy' => 'bairro',
        'hide_empty' => true,
    );
    $terms = get_terms($args);
    $output = '';
    foreach ($terms as $term) {
        $output .= $term->name . '|' . $term->name .'
		';
    }
    return $output;
}
add_shortcode('bairro_terms', 'bairro_terms_shortcode');
Shortcode - Retorna o valor do cookie "bairroselect"
// LER O VALOR DO COOKIE "bairroselect"
function get_bairro_cookie() {
    $bairro = '';
    if(isset($_COOKIE['bairroselect'])){
        $bairro = $_COOKIE['bairroselect'];
    }
    return $bairro;
}

add_shortcode('bairro_cookie', 'get_bairro_cookie');
Shortcode - Retorna os id dos post vinculado a taxonomia Bairro do Cookie
//RETORNA OS ID DOS POST VINCULADOS A TAXONOMIA BAIRRO DO COOKIE
function get_unidades_ids_by_bairro(){
    $bairro = '';
    if(isset($_COOKIE['bairroselect'])){
        $bairro = $_COOKIE['bairroselect'];
    }
    $args = array(
        'post_type' => 'unidade',
		'posts_per_page' => -1,
        'tax_query' => array(
            array(
                'taxonomy' => 'bairro',
                'field'    => 'name',
                'terms'    => $bairro,
            ),
        ),
        'fields' => 'ids',
    );
    $unidades_ids = get_posts( $args );
    return implode(",", $unidades_ids);
}
add_shortcode('unidades_ids_by_bairro', 'get_unidades_ids_by_bairro');