Add a custom taxonomy to Wordpress post loop? - php

I'm building a page where i want to display posts from the category, 'Recycled Aggregates' in a Bootsrap Accordion. I've managed to display each post in a new Panel which is great but now i need to display a custom taxonomy on each of these which is called 'Stock levels'.
What i've got so far... (which doesn't output the value)
Can anyone shed any light to why this isn't working?
Kind Regards,
Shaun
<div class="panel-group" id="accordion" role="tablist" aria-multiselectable="true">
<?php foreach(get_the_terms($wp_query->post->ID, ‘stock-levels’) as $term);?>
<?php $catquery = new WP_Query( 'cat=10&posts_per_page=10' ); while($catquery->have_posts()) : $catquery->the_post(); ?>
<div class="panel panel-default">
<div class="panel-heading" role="tab" id="headingOne">
<div class="container">
<a data-toggle="collapse" class="collapsed" data-parent="#accordion" href="#collapse<?php echo $i; ?>" aria-expanded="true" aria-controls="collapseOne">
<h4 class="panel-title">
<?php the_title(); ?><div class="stock-level"><?php echo $term;?></div>
</h4></a>
</div>
</div>
<div id="collapse<?php echo $i; ?>" class="panel-collapse collapse in" role="tabpanel" aria-labelledby="headingOne">
<div class="panel-body">
<div class="container">
<div class="row">
<div class="col-xs-12 col-sm-7 col-md-7 col-lg-7 recycled-image">
<?php echo the_post_thumbnail(); ?>
</div>
<div class="col-xs-12 col-sm-5 col-md-5 col-lg-5">
<h1><?php the_title(); ?></h1>
<p><?php the_content(); ?></p>
</div>
</div>
</div>
</div>
</div>
</div>
<?php $i++; endwhile; ?>
</div>
</div>
</div>
</div>

Although this is not the right way of doing it, but for a quick fix just add the parameters below to the wp_query, replace TAXONOMY_NAME By the name of the taxonomy and TAXONOMY_TERM by the term within that taxonomy
new WP_Query( 'cat=10&posts_per_page=10&TAXONOMY_NAME=TAXONOMY_TERM' )
EDIT:
Well then add $args array before the query and replace wp_query with the one below.
$args = array(
'post_type' => 'post',
'posts_per_page' => 10,
'tax_query' => array(
array(
'taxonomy' => 'TAXONOMY_NAME',
),
),
);
$catquery = new WP_Query( $args );

Related

Wordpress - template part break wordpress columns layout

I think that some help will be appreciated. I have this code that will load two template part for a wordpres custom theme:
<div class="row m-0">
<?php get_template_part('assets/main', 'news'); ?>
<?php get_template_part('assets/side', 'news'); ?>
</div>
As you can see under the hood I'm using bootstrap 4 so it's supposed that the content will align itself inside the same row.
I have a col-8 inside the main-news.php and a col-4 inside the side-news.php so I supposed that I will have the contents aligned, but this will not happen and my layout will break.
this is the code inside the main.news.php teplate part:
<?php $main_news = new WP_Query( array( 'post_type' => 'post', 'category_name' => 'main-news', 'posts_per_page' => 4) ); ?>
<!-- main -->
<div class="col-sm-12 col-md-8 col-lg-8 mt-2">
<p class="text-uppercase font-weight-bold mb-0 section-title"><?php _e('Last news') ?></p>
</div>
<?php if( $main_news->have_posts() ): while( $main_news->have_posts() ): $main_news->the_post(); ?>
<div class="col-sm-12 col-md-8 col-lg-8 mt-2 mb-2">
<div class="card rounded-0 p-0">
<img class="card-img-top w-100 h-100 rounded-0" src="<?php echo the_post_thumbnail_url(); ?>" />
<div class="card-img-overlay news-overlay">
<a class="h4 stretched-link" href="<?php the_permalink(); ?>"><?php the_title(); ?></a>
</div>
</div>
</div>
<?php endwhile; endif; wp_reset_postdata() ?>
this is the content of side-news.php
<?php $middle_news = new WP_Query( array( 'post_type' => 'post', 'category_name' => 'market-news', 'posts_per_page' => 4 ) ); ?>
<div class="col-sm-12 col-md-4 col-lg-4">
<p class="text-uppercase font-weight-bold mb-0 section-title"><?php _e('Side news') ?></p>
</div>
<?php if( $middle_news->have_posts() ): while( $middle_news->have_posts() ): $middle_news->the_post(); ?>
<div class="col-sm-12 col-md-4 col-lg-4 mt-2 mb-2">
<img class="img-fluid w-100" src="<?php echo the_post_thumbnail_url(); ?>" />
<a class="h4 stretched-link" href="<?php the_permalink(); ?>"><?php the_title(); ?></a>
</div>
<?php endwhile; endif; wp_reset_postdata(); ?>
How I can fix the layout to have the col-8 and the col-4 on the same row line?Maybe I need to nest the loops or what?
See the scree to understand what's happening now
your mistake is inside the main-news.php file.
look, you defined these (col-sm-12 col-md-8 col-lg-8 ) for your first div tag in the main-news.php file so your div takes those columns and then you defined these (col-sm-12 col-md-8 col-lg-8 ) columns for the div tag inside of the loop at the same file so both divs take more than 12 columns just inside the main-news.php file whereas you defined (col-sm-12 col-md-4 col-lg-4) for the div inside of the side-news.php file again so these definitions break your code.
Solution: You should delete the columns definition from one of the divs inside the main-news.php file.
GOOD LUCK!!!

Wordpress - Custom loop query for displaying custom post type

I'm messing around with my code. My goal is to display 4 custom post type on the homepage in the HTML layout I've created. Here's my code. Actually I can get the href but I can't loop the code not even achieve my scope.
<div class="roundedframe ">
<div class="container-fluid">
<div class="row">
<div class="col-lg-4 col-sm-6">
<a class="portfolio-box" href="<?php the_permalink(); ?>" title="<?php the_title(); ?>">
<div class="portfolio-box-caption">
<div class="portfolio-box-caption-content">
<div class="project-category text-faded">
Category
</div>
<div style="background-image: url('<?php the_post_thumbnail_url(); ?>');">
<div class="project-name"> <?php // WP_Query arguments
$args = array(
'name' => 'case-studies',
'nopaging' => true,
'posts_per_page' => '4',
);
// The Query
$query = new WP_Query( $args );
while ( $query->have_posts() ) : $query->the_post();
?>
Project Name
</div>
</div>
</div>
</a>
</div>
</div>
</div>
</div>
Assuming the post type you want is case-studies you should name the key post_type and not name. You also have to place the column inside the loop and close it afterwards. You also missed a </div> tag.
<?php $query = new WP_Query( [
'post_type' => 'case-studies',
'nopaging' => true,
'posts_per_page' => '4',
] ); ?>
<?php if ( $query->have_posts() ) : ?>
<div class="roundedframe ">
<div class="container-fluid">
<div class="row">
<?php while ( $query->have_posts() ) : $query->the_post(); ?>
<div class="col-lg-4 col-sm-6">
<a class="portfolio-box" href="<?php the_permalink(); ?>" title="<?php the_title(); ?>">
<div class="portfolio-box-caption">
<div class="portfolio-box-caption-content">
<div class="project-category text-faded">
Category
</div>
<div style="background-image: url('<?php the_post_thumbnail_url(); ?>');">
<div class="project-name">
<h2><?php the_title(); ?></h2>
</div>
</div>
</div>
</div>
</a>
</div>
<?php endwhile; ?>
</div>
</div>
</div>
<?php endif; ?>
<?php wp_reset_postdata(); ?>
You should put your code in the looping area. What i can see, you missed the endwhile also.
<div class="roundedframe ">
<div class="container-fluid">
<div class="row">
<?php // WP_Query arguments
$args = array(
'name' => 'case-studies',
'nopaging' => true,
'posts_per_page' => '4'
);
// The Query
$query = new WP_Query($args);
while ($query->have_posts()):
$query->the_post(); ?>
<div class="col-lg-4 col-sm-6">
<a class="portfolio-box" href="<?php
get_the_permalink();
?>" title="<?php
get_the_title();
?>">
<div class="project-category text-faded">
Category
</div>
<div style="background-image: url('<?php
the_post_thumbnail_url();
?>');">
<div class="project-name">
Project Name
</div>
</div>
</a>
</div>
<?php
endwhile;
?>
</div>
</div>
</div><!--.roundedframe-->
Try this and let me know. It may help you. Before that you should learn about wp_query
https://codex.wordpress.org/Class_Reference/WP_Query

Bootstrap accordion in Wordpress

I'm trying to get Bootstrap's accordion to work in Wordpress, but I'm not sure what else I have to add in the loop. At the moment, its expanding the first panel only no matter which one I click, and not displaying any content.
<div class="panel-group" id="accordian" role="tablist" aria-multiselectable="true">
<?php
$args = array(
'post_type' => 'faq_question',
'category_name' => 'order',
'posts_per_page' => -1
);
$loop = new WP_Query( $args );
while ( $loop->have_posts() ) : $loop->the_post();
?>
<div class="panel panel-default">
<div class="panel-heading" role="tab" id="<?php the_ID(); ?>">
<h4 class="panel-title">
<a class="collapsed" role="button" data-toggle="collapse" data-parent="#accordian" href="#collapseOne" aria-expanded="false" aria-controls="collapseOne"><?php the_title();?></a>
</h4>
</div><!-- end panel heading -->
<div id="collapseOne" class="panel-collapse collapse" role="tabpanel" aria-labelledby="<?php the_ID(); ?>">
<div class="panel-body">
<p><?php the_content(); ?></p>
</div><!-- end panel body -->
</div><!-- end panel collapse -->
</div><!-- end panel default -->
<?php endwhile; wp_reset_query(); ?>
</div><!-- end panel group -->
Appreciate any help, thanks.
Code for Bootstrap 4 with area Closed
<!-- Accordion Collapse Bootstrap 4 -->
<div id="accordion" role="tablist" aria-multiselectable="true">
<?php
$args = array(
'post_type' => 'question',
'posts_per_page' => -1
);
$loop = new WP_Query( $args );
while ( $loop->have_posts() ) : $loop->the_post();
?>
<div class="card">
<div class="card-header" role="tab" id="<?php the_ID(); ?>">
<h5 class="mb-0">
<a data-toggle="collapse" data-parent="#accordion" href="#collapse<?php the_ID(); ?>" aria-expanded="false" aria-controls="collapseOne">
<?php the_Title(); ?>
</a>
</h5>
</div>
<div id="collapse<?php the_ID(); ?>" class="collapse" role="tabpanel" aria-labelledby="heading<?php the_ID(); ?>">
<div class="card-block">
<?php the_Content(); ?>
</div>
</div>
<?php endwhile; wp_reset_query(); ?>
</div>
</div>
<!-- Accordion Collapse Bootstrap 4 -->
I suspect it's because you are ending up with multiple divs with the same id, #collapse1, so Bootstrap doesn't know which one you want to collapse. Try altering your code so that each collapsible panel has a unique id, like this;
(I've stripped out some of the extra attributes so I could more easily see what's going on)
<div class="panel-group" id="accordian">
<?php
$args = array(
'post_type' => 'faq_question',
'category_name' => 'order',
'posts_per_page' => -1
);
$loop = new WP_Query( $args );
while ( $loop->have_posts() ) : $loop->the_post();
?>
<div class="panel panel-default">
<div class="panel-heading">
<h4 class="panel-title">
<a class="collapsed" data-toggle="collapse" data-parent="#accordian" href="#collapse<?php the_ID(); ?>" ><?php the_Title(); ?></a>
</h4>
</div><!-- end panel heading -->
<div id="collapse<?php the_ID ?>" class="panel-collapse collapse">
<div class="panel-body">
<p><?php the_Content(); ?></p>
</div><!-- end panel body -->
</div><!-- end panel collapse -->
</div><!-- end panel default -->
<?php endwhile; wp_reset_query(); ?>
</div><!-- end panel group -->
<?php
$args = array(
'post_type' => 'Help',
'posts_per_page' => -1
);
$loop = new WP_Query( $args );
while ( $loop->have_posts() ) : $loop->the_post();
?>
<div class="panel panel-default">
<div class="panel-heading" role="tab" id="<?php the_ID(); ?>">
<h4 class="panel-title">
<a class="collapsed" role="button" data-toggle="collapse" data-parent="#accordian" href="#collapse<?php the_ID(); ?>" aria-expanded="false" aria-controls="collapseOne"><?php the_title();?></a>
</h4>
</div><!-- end panel heading -->
<div id="collapse<?php the_ID(); ?>" class="panel-collapse collapse" role="tabpanel" aria-labelledby="<?php the_ID(); ?>">
<div class="panel-body">
<p><?php the_content(); ?></p>
</div><!-- end panel body -->
</div><!-- end panel collapse -->
</div><!-- end panel default -->
<?php endwhile; wp_reset_query(); ?>
</div><!-- end panel group -->

Page navigation not working wordpress

So this is driving me kind of crazy, I just can't seem to get the page navigation to work. I installed a plugin wp-pagenavi but it still doesn't work. Is there anyone that could help me getting it to work. Here is my code (the loop):
<?php $args = array(
'post_type' => 'portfolio',
'posts_per_page'=> 10,
'orderby' => 'ID',
'order' => 'DESC',
'tax_query' => array(
array(
'taxonomy' => 'foto_video_type',
'field' => 'slug',
'terms' => 'foto'
)
)
);
$products = new WP_Query( $args );
if( $products->have_posts() ) {
while( $products->have_posts() ) {
$products->the_post();
?>
<?php $naam = get_field('naambedrijf');
$soort = get_field('soort_uitje');
$foto = get_field('flickr_fotoset'); ?>
<div class="col s12">
<div class="title">
<h2 class="truncate" style="line-height:20px;"><?php echo $naam; ?> | <?php echo $soort; ?></h2>
<a class="fotos" href="https://www.flickr.com/photos/../sets/<?php echo $foto; ?>" target="_blank"><small>Bekijk alle foto's</small></a>
</div>
<div class="flickrphotoset">
<?php echo do_shortcode('[slickr-flickr id="" search="sets" set="' . $foto . '" size="large" items="9" bottom="10" responsive="on" type="thumbnail" galleria_options="lightbox:true;thumbnail:lazy"]'); ?>
</div>
</div>
<?php
}
}
else {
echo 'There seems to be a problem, please try searching again or contact customer support!';
} ?>
<?php wp_pagenavi(); ?>
And this is my archive code:
<section id="collaps">
<div class="row">
<div class="col s12 offset-s0 m12 l7 offset-l5">
<ul class="collapsible z-depth-1" data-collapsible="accordion">
<li>
<div class="collapsible-header"><i class="fa fa-camera" aria-hidden="true"></i><p>Foto</p></div>
<div id="portfolio" class="collapsible-body">
<div class="row">
<?php get_template_part('loop-foto'); ?>
<div class="col s12">
</div>
</div>
</div>
</li>
<li>
<div class="collapsible-header"><i class="fa fa-video-camera" aria-hidden="true"></i><p>Video</p></div>
<div id="portfolio" class="collapsible-body">
<div class="row">
<?php get_template_part('loop-video'); ?>
</div>
</div>
</li>
</ul>
</div>
</div>
</section>
When i add the "older" Wordpress code:
<div class="navigation">
<div class="alignleft"><?php next_posts_link('« Older Entries', '1000') ?></div>
<div class="alignright"><?php previous_posts_link('Newer Entries »', '1000') ?></div>
</div>
It kind of works. But page/2/ give a 404 error... What am I doing wrong?
I'm not sure if it is your case, but as I faced a similar case, I'm going to post my solution here:
In my case the problem was that I had a page with a permalink equal to the post type, so just changing the page slug solved the problem.

Displaying Custom taxonomy term on page made up of posts

I'm trying to display a taxonomy term for each post on this page by using
<?php foreach(get_the_terms($wp_query->post->ID, 'stock') as $term) echo $term->slug; ?>
I've used this before in body classes so i can style pages better but i'm not sure why it's not working here...
can anyone help please?
<div class="panel-group" id="accordion" role="tablist" aria-multiselectable="true">
<?php $catquery = new WP_Query( 'cat=10&posts_per_page=10' ); while($catquery->have_posts()) : $catquery->the_post(); ?>
<div class="panel panel-default">
<div class="panel-heading" role="tab" id="headingOne">
<div class="container">
<a data-toggle="collapse" class="collapsed" data-parent="#accordion" href="#collapse<?php echo $i; ?>" aria-expanded="true" aria-controls="collapseOne">
<h4 class="panel-title">
<?php the_title(); ?><div class="stock-level"> <?php foreach(get_the_terms($wp_query->post->ID, 'stock') as $term) echo $term->slug; ?></div>
</h4></a>
</div>
</div>
<div id="collapse<?php echo $i; ?>" class="panel-collapse collapse" role="tabpanel" aria-labelledby="headingOne">
<div class="panel-body">
<div class="container">
<div class="row">
<div class="col-xs-12 col-sm-7 col-md-7 col-lg-7 recycled-image">
<?php echo the_post_thumbnail(); ?>
</div>
<div class="col-xs-12 col-sm-5 col-md-5 col-lg-5">
<h1><?php the_title(); ?></h1>
<p><?php the_content(); ?></p>
</div>
</div>
</div>
</div>
</div>
</div>
<?php $i++; endwhile; ?>
If this is more of an archive page than a single page using $wp_query->post->ID will not return the ID of all posts in the archive.
You would have to do something like:
$args = array('YOUR POST ARGS');
$posts = get_posts($args);
foreach ($posts as $post ) {
setup_postdata( $post );
foreach(get_the_terms(get_the_ID(), 'stock') as $term){
echo $term->slug.'<br />';
}
}

Categories