Converting Single Category Query to Multiple Taxonomy Query WordPress
- SOLVED
Hello,
I'd like to add Skills taxonomy to this query.
So they will be like:
ALL | Category 1 | Category 2 | Category 3
ALL | Skills 1 | Skills 2 | Skills 3
Here is the link to the theme: theme-fusion.com/avada/3-column-text/
They should work with AND. For example user would click Category 1 and Skills 2. That will bring the posts that are both Category 1 and Skills 2. Or they could just click Category 1 that will return All skills and Cateogory 1.
I hope I made my point clear :)
The php part to be changed is below:
$pcats = get_post_meta(get_the_ID(), 'pyre_portfolio_category', true);
if($pcats && $pcats[0] == 0) {
unset($pcats[0]);
}
if($pcats){
$args['tax_query'][] = array(
'taxonomy' => 'portfolio_category',
'field' => 'ID',
'terms' => $pcats
);
}
$gallery = new WP_Query($args);
if(is_array($gallery->posts) && !empty($gallery->posts)) {
foreach($gallery->posts as $gallery_post) {
$post_taxs = wp_get_post_terms($gallery_post->ID, 'portfolio_category', array("fields" => "all"));
if(is_array($post_taxs) && !empty($post_taxs)) {
foreach($post_taxs as $post_tax) {
if(is_array($pcats) && !empty($pcats) && (in_array($post_tax->term_id, $pcats) || in_array($post_tax->parent, $pcats )) ) {
$portfolio_taxs[urldecode($post_tax->slug)] = $post_tax->name;
}
if(empty($pcats) || !isset($pcats)) {
$portfolio_taxs[urldecode($post_tax->slug)] = $post_tax->name;
}
}
}
}
}
$all_terms = get_terms('portfolio_category');
if( !empty( $all_terms ) && is_array( $all_terms ) ) {
foreach( $all_terms as $term ) {
if( $portfolio_taxs[$term->slug] ) {
$sorted_taxs[$term->slug] = $term->name;
}
}
}
$portfolio_taxs = $sorted_taxs;
$portfolio_category = get_terms('portfolio_category');
if(is_array($portfolio_taxs) && !empty($portfolio_taxs) && get_post_meta($post->ID, 'pyre_portfolio_filters', true) != 'no'):
?>
<ul class="portfolio-tabs clearfix">
<li class="active"><a data-filter="*" href="#"><?php echo __('All', 'Avada'); ?></a></li>
<?php foreach($portfolio_taxs as $portfolio_tax_slug => $portfolio_tax_name): ?>
<li><a data-filter=".<?php echo $portfolio_tax_slug; ?>" href="#"><?php echo $portfolio_tax_name; ?></a></li>
<?php endforeach; ?>
</ul>
<?php endif; ?>
Answers (3)
Arnav Joy answers:
what are these skills ? any other taxonomy ?
e_meliss comments:
Yes.
Arnav Joy comments:
try this
<code>
<?php
// Template Name: Portfolio Three Column
get_header(); ?>
<?php
$content_css = 'width:100%';
$sidebar_css = 'display:none';
if(get_post_meta($post->ID, 'pyre_portfolio_full_width', true) == 'yes') {
$content_css = 'width:100%';
$sidebar_css = 'display:none';
}
elseif(get_post_meta($post->ID, 'pyre_portfolio_sidebar_position', true) == 'left') {
$content_css = 'float:right;';
$sidebar_css = 'float:left;';
$content_class = 'portfolio-three-sidebar';
} elseif(get_post_meta($post->ID, 'pyre_portfolio_sidebar_position', true) == 'right') {
$content_css = 'float:left;';
$sidebar_css = 'float:right;';
$content_class = 'portfolio-three-sidebar';
} elseif(get_post_meta($post->ID, 'pyre_sidebar_position', true) == 'default') {
$content_class = 'portfolio-three-sidebar';
if($data['default_sidebar_pos'] == 'Left') {
$content_css = 'float:right;';
$sidebar_css = 'float:left;';
} elseif($data['default_sidebar_pos'] == 'Right') {
$content_css = 'float:left;';
$sidebar_css = 'float:right;';
}
}
?>
<div id="content" class="portfolio portfolio-three <?php echo $content_class; ?>" style="<?php echo $content_css; ?>">
<?php while(have_posts()): the_post(); ?>
<div id="post-<?php the_ID(); ?>" <?php post_class(); ?>>
<div class="post-content">
<?php the_content(); ?>
<?php wp_link_pages(); ?>
</div>
</div>
<?php $current_page_id = $post->ID; ?>
<?php endwhile; ?>
<?php
if(is_front_page()) {
$paged = (get_query_var('page')) ? get_query_var('page') : 1;
} else {
$paged = (get_query_var('paged')) ? get_query_var('paged') : 1;
}
$args = array(
'post_type' => 'avada_portfolio',
'paged' => $paged,
'posts_per_page' => $data['portfolio_items'],
);
$pcats = get_post_meta(get_the_ID(), 'pyre_portfolio_category', true);
if($pcats && $pcats[0] == 0) {
unset($pcats[0]);
}
if($pcats){
$args['tax_query'][] = array(
'taxonomy' => 'portfolio_category',
'field' => 'ID',
'terms' => $pcats
);
}
$gallery = new WP_Query($args);
if(is_array($gallery->posts) && !empty($gallery->posts)) {
foreach($gallery->posts as $gallery_post) {
$post_taxs = wp_get_post_terms($gallery_post->ID, 'portfolio_category', array("fields" => "all"));
$skil_taxs = wp_get_post_terms($gallery_post->ID, 'portfolio_skills', array("fields" => "all"));
if(is_array($post_taxs) && !empty($post_taxs)) {
foreach($post_taxs as $post_tax) {
if(is_array($pcats) && !empty($pcats) && in_array($post_tax->term_id, $pcats)) {
$portfolio_taxs[urldecode($post_tax->slug)] = $post_tax->name;
}
if(empty($pcats) || !isset($pcats)) {
$portfolio_taxs[urldecode($post_tax->slug)] = $post_tax->name;
}
}
}
if(is_array($skil_taxs) && !empty($skil_taxs)) {
foreach($skil_taxs as $post_tax) {
$skill_taxs[urldecode($post_tax->slug)] = $post_tax->name;
}
}
}
}
if(is_array($portfolio_taxs)) {
asort($portfolio_taxs);
}
if(is_array($skill_taxs)) {
asort($skill_taxs);
}
$portfolio_category = get_terms('portfolio_category');
if(is_array($portfolio_taxs) && !empty($portfolio_taxs) && get_post_meta($post->ID, 'pyre_portfolio_filters', true) != 'no'):
?>
<ul class="portfolio-tabs clearfix">
<li class="active"><a data-filter="*" href="#"><?php echo __('All', 'Avada'); ?></a></li>
<?php foreach($portfolio_taxs as $portfolio_tax_slug => $portfolio_tax_name): ?>
<li><a data-filter=".<?php echo $portfolio_tax_slug; ?>" href="#"><?php echo $portfolio_tax_name; ?></a></li>
<?php endforeach; ?>
<br>
<li><a data-filter="*" href="#"><?php echo __('All', 'Avada'); ?></a></li>
<?php foreach($skill_taxs as $portfolio_tax_slug => $portfolio_tax_name): ?>
<li><a data-filter=".<?php echo $portfolio_tax_slug; ?>" href="#"><?php echo $portfolio_tax_name; ?></a></li>
<?php endforeach; ?>
</ul>
<?php endif; ?>
<div class="portfolio-wrapper">
<?php
while($gallery->have_posts()): $gallery->the_post();
if($pcats) {
$permalink = tf_addUrlParameter(get_permalink(), 'portfolioID', $current_page_id);
} else {
$permalink = get_permalink();
}
if(has_post_thumbnail() || get_post_meta($post->ID, 'pyre_video', true)):
?>
<?php
$item_classes = '';
$item_cats = get_the_terms($post->ID, 'portfolio_category');
if($item_cats):
foreach($item_cats as $item_cat) {
$item_classes .= urldecode($item_cat->slug) . ' ';
}
endif;
$item_classes2 = '';
$item_cats = get_the_terms($post->ID, 'portfolio_skills');
if($item_cats):
foreach($item_cats as $item_cat) {
$item_classes2 .= urldecode($item_cat->slug) . ' ';
}
endif;
?>
<div class="portfolio-item <?php echo $item_classes; ?> <?php echo $item_classes2; ?>">
<?php if(has_post_thumbnail()): ?>
<div class="image">
<?php if($data['image_rollover']): ?>
<?php the_post_thumbnail('portfolio-three'); ?>
<?php else: ?>
<a href="<?php echo $permalink; ?>"><?php the_post_thumbnail('portfolio-three'); ?></a>
<?php endif; ?>
<?php
if(get_post_meta($post->ID, 'pyre_image_rollover_icons', true) == 'link') {
$link_icon_css = 'display:inline-block;';
$zoom_icon_css = 'display:none;';
} elseif(get_post_meta($post->ID, 'pyre_image_rollover_icons', true) == 'zoom') {
$link_icon_css = 'display:none;';
$zoom_icon_css = 'display:inline-block;';
} elseif(get_post_meta($post->ID, 'pyre_image_rollover_icons', true) == 'no') {
$link_icon_css = 'display:none;';
$zoom_icon_css = 'display:none;';
} else {
$link_icon_css = 'display:inline-block;';
$zoom_icon_css = 'display:inline-block;';
}
$icon_url_check = get_post_meta(get_the_ID(), 'pyre_link_icon_url', true); if(!empty($icon_url_check)) {
$icon_permalink = get_post_meta($post->ID, 'pyre_link_icon_url', true);
} else {
$icon_permalink = $permalink;
}
?>
<div class="image-extras">
<div class="image-extras-content">
<?php $full_image = wp_get_attachment_image_src(get_post_thumbnail_id($post->ID), 'full'); ?>
<a style="<?php echo $link_icon_css; ?>" class="icon link-icon" href="<?php echo $icon_permalink; ?>">Permalink</a>
<?php
if(get_post_meta($post->ID, 'pyre_video_url', true)) {
$full_image[0] = get_post_meta($post->ID, 'pyre_video_url', true);
}
?>
<a style="<?php echo $zoom_icon_css; ?>" class="icon gallery-icon" href="<?php echo $full_image[0]; ?>" rel="prettyPhoto[gallery]" title="<?php echo get_post_field('post_content', get_post_thumbnail_id($post->ID)); ?>"><img style="display:none;" alt="<?php echo get_post_field('post_excerpt', get_post_thumbnail_id($post->ID)); ?>" />Gallery</a>
<h3 class="entry-title"><?php the_title(); ?></h3>
<h4><?php echo get_the_term_list($post->ID, 'portfolio_category', '', ', ', ''); ?></h4>
</div>
</div>
</div>
<?php endif; ?>
</div>
<?php endif; endwhile; ?>
</div>
<?php themefusion_pagination($gallery->max_num_pages, $range = 2); ?>
</div>
<div id="sidebar" style="<?php echo $sidebar_css; ?>"><?php generated_dynamic_sidebar(); ?></div>
<?php get_footer(); ?>
<code>
e_meliss comments:
Almostt :)
Now they work seperately, Skill OR Category
I need them to work together. Like they could select one skill AND one category. So just items that contain both that skill and that category will be selected.
Ryan S answers:
Try using relation AND and operator in
'tax_query' => array(
'relation' => 'AND',
// first option if you'd like only to display array of categories
array(
'taxonomy' => 'movie_genre',
'field' => 'slug',
'terms' => array( 'action', 'comedy' ) // you can add as many category as you like
),
// second option
array(
'taxonomy' => 'actor',
'field' => 'id',
'terms' => array( 103, 115, 206 ), // lists of category id under actor taxonomy
'operator' => 'IN'
)
)
e_meliss comments:
Ryan, I found that information on Wordpress Codex too. But there is lot more going on in the code.
Bob answers:
To achieve this you not only have to edit php code but also jquery.
They are using http://isotope.metafizzy.co/index.html.
You have to pass class of each item to category and skill they belongs.
When any anchor tag is clicked you have to get both active anchor tags (selected skill and selected category);
According to that you have to modify the selector and pass that selector to into isotop function Ex: isotope( {filter: selector});
you will find this code in main.js file located in js folder of avada theme.
if you are using latest theme then the code that you need to modify is around line 156 to 164.
It is
jQuery('.portfolio-tabs a').click(function(e){
e.preventDefault();
var selector = jQuery(this).attr('data-filter');
jQuery(this).parents('.portfolio').find('.portfolio-wrapper').isotope({ filter: selector });
jQuery(this).parents('ul').find('li').removeClass('active');
jQuery(this).parent().addClass('active');
});