Parcurge categoriile și creează un tab pentru fiecare

17 iul. 2014, 00:19:09
Vizualizări: 20K
Voturi: 2

Încerc să creez o pagină care să conțină toate categoriile tipului meu personalizat de postare sub formă de taburi, fiecare cu conținutul său.

Reușesc să afișez numele tuturor categoriilor ca taburi, dar trebuie să execut o interogare în zona de conținut a fiecărui tab pentru categoria corespunzătoare.

Astfel, când dau click pe tabul numit "1", zona de conținut ar trebui să afișeze doar postările din categoria aparținând tabului numit "1".

Codul meu până acum:

<?php
echo '<ul class="nav nav-tabs" role="tablist">';

 $args = array(
 'hide_empty'=> 1,
 'orderby' => 'name',
 'order' => 'ASC'
 );

$categories = get_categories($args);

  foreach($categories as $category) { 

    echo '<li><a href="#' . $category->name.'" role="tab" data-toggle="tab">' .      
    $category->name.'</a></li>';
    $cat_name = $category->name;

    } 
    echo '</ul>';
    echo '<div class="tab-content">';
      foreach($categories as $category) { 
        echo '<div class="tab-pane" id="' . $category->name.'">';


        ?>

 <?php 

     $the_query = new WP_Query(array(
      'post_type' => 'acme_product',
      'posts_per_page' => 100,
      'category_name' => $category->slug
        )); 
     while ( $the_query->have_posts() ) : 
     $the_query->the_post();
     ?>

            <h1><?php the_title(); ?></h1>

                   <?php 
    endwhile; 
   wp_reset_postdata();
   ?>   


    <?php } 
    echo '</div>';
     ?>

Problema este că fiecare zonă de conținut afișează toate postările din fiecare categorie.

Output-ul HTML:

<div class="container">

               <ul class="nav nav-tabs" role="tablist"><li><a href="#Audi" role="tab" data-toggle="tab">Audi</a></li><li><a href="#Skoda" role="tab" data-toggle="tab">Skoda</a></li></ul><div class="tab-content"><div class="tab-pane" id="Audi">

        <h1>fffffffffffff</h1>




<div class="tab-pane" id="Skoda">

        <h1>qqqqqqqqqqqqqqqqqqq</h1>




</div>                       
    </div>

Aveți sugestii?

0
Toate răspunsurile la întrebare 3
5

Încearcă 'category_name' => $category->slug în loc de 'category_name' => $cat_name.

De asemenea, îți lipsește wp_reset_postdata(); imediat după endwhile;.

17 iul. 2014 01:39:17
Comentarii

Am adăugat wp_reset_postdata(); și am schimbat numele în slug. Tot primesc toate articolele sub fiecare filă. După cum înțeleg, ar trebui să adauge doar articolele din categoria respectivă pentru fiecare categorie. Sunt complet blocat aici.

TietjeDK TietjeDK
17 iul. 2014 01:48:29

Am actualizat răspunsul meu. Am observat o altă mică eroare care pur și simplu repeta aceeași categorie. Totuși, asta nu explică de încarcă toate articolele. Poți să ne dai un link la rezultat?

deflime deflime
17 iul. 2014 01:53:47

Din păcate lucrez pe local host, așa că nu pot furniza un link. Am aplicat și modificările tale. Tot nu merge.

TietjeDK TietjeDK
17 iul. 2014 02:04:07

Poți să editezi întrebarea ta și să postezi codul HTML generat?

deflime deflime
17 iul. 2014 02:13:57

S-a dovedit a fi o etichetă de închidere lipsă. Nu pot să cred că am pierdut 5 ore pe asta. Îmi pare rău că ți-am irosit timpul - și apreciez ajutorul tău. Mulțumesc mult!

TietjeDK TietjeDK
17 iul. 2014 02:28:42
3

Încercați acest cod

<?php
echo '<ul class="nav nav-tabs" role="tablist">';
$args = array(
    'hide_empty'=> 1,
    'orderby' => 'name',
    'order' => 'ASC'
);
$categories = get_categories($args);
foreach($categories as $category) { 
    echo 
        '<li>
            <a href="#'.$category->slug.'" role="tab" data-toggle="tab">    
                '.$category->name.'
            </a>
        </li>';
}
echo '</ul>';

echo '<div class="tab-content">';
foreach($categories as $category) { 
    echo '<div class="tab-pane" id="' . $category->slug.'">';
    $the_query = new WP_Query(array(
        'post_type' => 'acme_product',
        'posts_per_page' => 100,
        'category_name' => $category->slug
    ));

    while ( $the_query->have_posts() ) : 
    $the_query->the_post();
    echo '<h1>';
        the_title();
    echo '</h1>';
    endwhile;

    echo '</div>';
} 
echo '</div>';
?>
8 nov. 2014 23:48:10
Comentarii

Te rog să adaugi o explicație la răspunsul tău: de ce ar putea rezolva problema?

fuxia fuxia
9 nov. 2014 02:38:47

Salut! Am editat codul și l-am aranjat într-un format frumos. Am adăugat doar $category->slug în unele părți ale codului. Sunt sigur că acest cod funcționează 100/100, îl folosesc în bara mea de navigare cu file.

Shwan Namiq Shwan Namiq
9 nov. 2014 22:56:32

Te rog să explici în răspunsul tău (nu într-un comentariu), ce face codul tău și de ce funcționează.

fuxia fuxia
9 nov. 2014 23:42:32
0
-1
<?php
echo '<ul class="nav nav-tabs" role="tablist">';
$args = array(
    'taxonomy' => 'annualreports_category',
    'hide_empty'=>0,
    'orderby' => 'name',
    'order' => 'ASC'
);
$categories = get_categories($args);
foreach($categories as $category) { 
    echo 
        '<li>
            <span data-href="'.$category->slug.'" role="tab" data-toggle="tab">    
                '.$category->name.'
            </span>
        </li>';
}
echo '</ul>';

echo '<div class="investors-content">';
foreach($categories as $category) { 
    echo '<div class="tab-pane" id="' . $category->slug.'">';
    $catslug = $category->slug;
    $the_query = new WP_Query(array(
        'post_type' => 'annualreports_post',
        'posts_per_page' => -1,
        'tax_query' => array(
                        array(
                            'taxonomy' => 'annualreports_category',
                            'field'    => 'slug',
                            'terms'    => array( $catslug ),
                            'operator' => 'IN'
                        ),
                    ),
    ));                 
    while ( $the_query->have_posts() ) : 
    $the_query->the_post();
        echo '<h1>';
        the_title();
        echo '</h1>';
    endwhile; 
    echo '</div>';
} 
echo '</div>';
?>

jQuery

$(".investors-content .tab-pane").each(function(){
    $(this).hide();
    $('.investors-content .tab-pane:first-child()').show();
});

$('.nav-tabs li>span').on( "click", function(e) {
    e.preventDefault();
    var id = $(this).attr('data-href');
    $(".investors-content .tab-pane").each(function(){
        $(this).hide();
        if($(this).attr('id') == id) {
            $(this).show();
        }
    });
});
10 mai 2021 14:18:27