how to show content in the wordpress recent post? - wordpress

<div class="row">
<h3>Recent Posts</h3>
</div>
<div class="row recent-post-style">
<ul>
<?php
$args = array( 'numberposts' => '5' );
$recent_posts = wp_get_recent_posts( $args );
foreach( $recent_posts as $recent ) {
echo '<li><a href="' . get_permalink($recent["ID"]) . '" title="Look '.esc_attr($recent["post_title"]).'" >' . $recent["post_title"].'</a> </li> ';
echo the_content('10');
}
?>
</ul>
</div>
the element the_content('10') is not display the post content.

The content of the post is part of the $recent array.
The key you need is post_content, which is the raw content of the post. If you want it formatting in the same way as the_content(), then you'll want to wrap it in wpautop(). If you wish to trim it by words (you seem to be doing the_content(10), you can use wp_trim_words().
Here's your amended code:
<div class="row">
<h3>Recent Posts</h3>
</div>
<div class="row recent-post-style">
<ul>
<?php
$args = array( 'numberposts' => '5' );
$recent_posts = wp_get_recent_posts( $args );
foreach( $recent_posts as $recent ) {
echo '<li><a href="' . get_permalink($recent["ID"]) . '" title="Look '.esc_attr($recent["post_title"]).'" >' . $recent["post_title"].'</a> </li> ';
echo wpautop(wp_trim_words($recent["post_content"], 10));
}
?>
</ul>
</div>

Related

How to get post thumbnail and title into two containers through WP_Query?

I'm trying to get posts content through WP_Query, I have:
function my_query( $attributes ) {
$args = array(
'post_type' => 'post',
'posts_per_page' => 3,
'post_status' => 'publish'
);
$query = new WP_Query($args);
$posts = '';
if($query->have_posts()) {
$posts .= '<div class="post-wrapper">';
while ($query->have_posts()) {
$query->the_post();
$posts .= '<div class="img-container">';
$posts .= '<div>' . get_the_post_thumbnail() . '</div>';
$posts .= '</div>';
$posts .= '<div class="content-container">';
$posts .= '<span>' . get_the_title() . '</span>';
$posts .= '</div>';
}
$posts .= '</div>';
wp_reset_postdata();
return $posts;
}
And it's working, I'm getting in my html something like this:
<div class="post-wrapper">
<div class="img-container">
<div><img src="..." alt=""></div>
</div>
<div class="content-container">
<span>some title</span>
</div>
</div>
<div class="post-wrapper">
<div class="img-container">
<div><img src="..." alt=""></div>
</div>
<div class="content-container">
<span>some title</span>
</div>
</div>
<div class="post-wrapper">
<div class="img-container">
<div><img src="..." alt=""></div>
</div>
<div class="content-container">
<span>some title</span>
</div>
</div>
But I need to divide my containers images and titles like this:
<div class="post-wrapper">
<div class="img-container">
<div><img src="..." alt=""></div>
<div><img src="..." alt=""></div>
<div><img src="..." alt=""></div>
</div>
<div class="content-container">
<span>some title</span>
<span>some title</span>
<span>some title</span>
</div>
</div>
How to do this properly?
Can you help me, please?
Thanks in advance.
I would argue for Output Buffering, but I think an easier solution for now without changing your code structure very much (and without relying on looping through the posts multiple times), would be to build multiple variables instead of just one $posts variable, and then combine them after the while loop. Something like this:
$args = array(
'post_type' => 'post',
'posts_per_page' => 3,
'post_status' => 'publish'
);
$query = new WP_Query( $args );
$container = $images = $titles = ''; // Start with 3 variables
if( $query->have_posts() ){
// Start the $container;
$container .= '<div class="post-wrapper">';
// Build the $images and $titles separately;
while( $query->have_posts() ){
$query->the_post();
$images .= '<div class="img-container">';
$images .= '<div>' . get_the_post_thumbnail() . '</div>';
$images .= '</div>';
$titles .= '<div class="content-container">';
$titles .= '<span>' . get_the_title() . '</span>';
$titles .= '</div>';
}
// Now that $images and $titles are build, add them to the $container;
$container .= $images;
$container .= $titles;
// Now close the container
$container .= '</div>';
wp_reset_postdata();
return $container;
}
You can call have_posts more than once, assuming there are no more posts in the loop. It will rewind to the beginning.
function my_query( $attributes ) {
$args = array(
'post_type' => 'post',
'posts_per_page' => 3,
'post_status' => 'publish'
);
$query = new \WP_Query($args);
$posts = '';
if($query->have_posts()) {
$posts .= '<div class="post-wrapper"><div class="img-container">';
while ($query->have_posts()) {
$query->the_post();
$posts .= '<div>' . get_the_post_thumbnail() . '</div>';
}
$posts .= '</div><div class="content-container">';
while ($query->have_posts()) {
$query->the_post();
$posts .= '<span>' . get_the_title() . '</span>';
}
$posts .= '</div></div>';
wp_reset_postdata();
return $posts;
}
}
}

Title on a page with custom template

Good day!
I have a strange issue with Wordpress 5.1.1. I have two pages with custom templates, a homepage and a blog page. On other pages I use standard template. And on standard pages I can see page title like About us - Sitename, Contacts - Sitename.
But on these custom pages it's empty! I can see only Sitename and title tag is empty. What it can be?
Also, I use custom WP_Query on a blog page.
UPD
This is my custom blog page:
<?php
/**
* Template Name: Статьи
*/
$page = (get_query_var('paged')) ? get_query_var('paged') : 1;
$wp_query = new WP_Query(array('post_type' => 'post', 'posts_per_page' => 4, 'paged'=> $page ));
$categories = get_categories( array(
'orderby' => 'name',
'order' => 'ASC'
) );
get_header();
the_title();
?>
<div id="blog_cards" class="ui grid">
<div class="sixteen wide column">
<div id="categories">
<?php
foreach( $categories as $category ) {
$category_link = sprintf(
'<a class="category" href="%1$s" alt="%2$s">%3$s</a>',
esc_url( get_category_link( $category->term_id ) ),
esc_attr( sprintf( __( 'View all posts in %s', 'textdomain' ), $category->name ) ),
esc_html( $category->name )
);
echo $category_link;
}
?>
</div>
</div>
<div class="sixteen wide column">
<div class="ui two cards">
<?php
if ( $wp_query->have_posts() ) :
while ( $wp_query->have_posts() ) : $wp_query->the_post(); ?>
<div id="post-<?php the_ID(); ?>" class="card">
<div class="image">
<?php the_post_thumbnail();?>
</div>
<div class="content">
<div class="header"><?php the_title();?></div>
<div class="meta">
<a><?php the_time('d.m.Y');?></a>
</div>
<div class="description">
<?php the_content();?>
</div>
</div>
<div class="extra content">
<?php
$post_cats = get_the_category();
foreach( $post_cats as $category ) {
$category_link = sprintf(
'<a class="category" href="%1$s" alt="%2$s">%3$s</a>',
esc_url( get_category_link( $category->term_id ) ),
esc_attr( sprintf( __( 'View all posts in %s', 'textdomain' ), $category->name ) ),
esc_html( $category->name )
);
echo $category_link;
}
?>
</div>
</div>
<?php endwhile;?>
</div>
</div>
<div class="sixteen wide column">
<?php if (function_exists('wp_corenavi')) wp_corenavi(array( 'wp_query' => $wp_query )); ?>
</div>
<?php
endif; ?>
</div>
<?php
do_action( 'storefront_sidebar' );
get_footer();
Also, I tried to call the_title() and it returned page title in a body of template. But title tag is empty.
And I use standard storefront theme for woocomerce.
Please move get_header() on the top of the page (before $page).

Display post count in each category - wordpress

The code below displays correctly except for the part that is suppose to show post count in the respective categories. What will be to correct syntax to use? Thanks!
<ul class="cat-menu list-group">
<?php $category_ids = get_all_category_ids();
$args = array(
'orderby' => 'slug',
'parent' => 0
);
$categories = get_categories( $args );
foreach ( $categories as $category ) {
echo '<li class="list-group-item d-flex align-items-center"><i class="fa fa-chevron-right" aria-hidden="true"></i>' . $category->name . '<span>' . $the_query->found_posts . '</span></li>';
}
?>
Try this-
<ul class="cat-menu list-group">
<?php
$args = array(
'orderby' => 'slug',
'parent' => 0
);
$categories = get_categories( $args );
foreach( $categories as $category ){
echo '<li class="list-group-item d-flex align-items-center"><i class="fa fa-chevron-right" aria-hidden="true"></i>' . $category->name . '<span>' . $category->category_count . '</span></li>';
}
?>
</ul>
Very thanks #Arif-Khan.
and it is a simple update for persian Websites.
<div class="card card-body pb-0">
<div class="single-post">
<p class="font-bold dark-grey-text text-center spacing grey lighten-4 py-2 mb-4">
<strong>دسته بندی</strong>
</p>
<ul class="cat-menu list-group my-4">
<?php
$args = array(
'orderby' => 'slug',
'parent' => 0
);
$categories = get_categories( $args );
foreach( $categories as $category ){
echo '<li class="list-group-item d-flex justify-content-between align-items-center"><a href="' . get_category_link( $category->term_id ) . '">
<i class="fas fa-chevron-left blue-text" aria-hidden="true"></i><p class="blue-grey-text mb-0 pr-1 d-inline-block">
' . $category->name . '</p></a>
<span class="badge badge-pill blue-grey font-small">' . $category->category_count . '</span></li>';
}
?>
</ul>
</div>
</div>

Posts list with their taxonomy

I would like to display list of post for a wordpress post type but I don't know how to show taxonomy term linked to the post.
My code :
<ul class="list-group">
<?php
$args = array(
'post_type' => 'faq',
'post_status' => 'publish',
'orderby' => 'date',
'order' => 'DESC',
'posts_per_page' => 5,
)
;$myposts = get_posts( $args );
foreach ( $myposts as $post ) : setup_postdata( $post ); ?>
<li class="list-group-item">
<span class="label label-default">xxxxx taxonomy xxxxxx</span>
<?php the_title(); ?>
</li>
<?php endforeach;
wp_reset_postdata();?>
</ul>
Could you help me please.
<?php query_posts(array('post_type'=>'faq', 'posts_per_page'=>5, 'order' => 'DESC', )); ?>
<?php if(have_posts()) { while(have_posts()) { the_post();?>
<div class="col-md-6 col-sm-6">
<?php if ( has_post_thumbnail() ) {?>
<div class="blog_image">
<?php the_post_thumbnail( 'full' ); ?>
</div>
<?php } else{ ?>
<?php }?>
<div class="entry-content">
<h3 class="blog-title">
<?php the_title(); ?>
</h3>
<span class="post-date"><?php echo get_the_date('d. M Y'); ?></span>
<p><?php echo wp_trim_words( get_the_content(), 50, ' (...)' );?></p>
</div>
</div>
<?php }
}
wp_reset_query();
?>
for image display <?php the_post_thumbnail( 'full' ); ?>
for title display <?php the_title_attribute(); ?> for title display
for content display <?php the_content();?>
change HTML as you want
<?php
/* FIRST
* Note: This function only returns results from the default “category” taxonomy. For custom taxonomies use get_the_terms().
*/
$categories = get_the_terms( $post->ID, 'taxonomy' );
// now you can view your category in array:
// using var_dump( $categories );
// or you can take all with foreach:
foreach( $categories as $category ) {
echo $category->term_id . ', ' . $category->slug . ', ' . $category->name . '<br />';
}

wordpress shortcode for tab

i added this by custom post type. but i want to create this by shortcode method with the conditional statement. how to do this ? please anyone ans this ?
<?php
$args = array( 'posts_per_page' => 4, 'post_type'=> 'tab-items');
$myposts = get_posts( $args );
?>
<!--nab section date content area-->
<div class="date_section_area">
<!-- Nav tabs -->
<div class="date_section_list">
<ul>
<?php foreach( $myposts as $post ) : setup_postdata($post); ?>
<li><?php the_title(); ?></li>
<?php endforeach;
wp_reset_postdata(); ?>
</ul>
</div>
<!-- Tab panes -->
<div class="date_section_content">
<?php foreach( $myposts as $post ) : setup_postdata($post); ?>
<div class="single_date_section_content tab-pane fade" id="<?php the_ID(); ?>">
<?php the_post_thumbnail('tab-image'); ?>
<?php the_content(); ?>
</div>
<?php endforeach;
wp_reset_postdata(); ?>
</div>
</div>
As far as i understand your question,
i have an idea that you can do like this:-
add_shortcode('my_post_shorcode', 'my_shortcode_function');
function my_shortcode_function($attr, $content)
{
extract(
shortcode_atts( array(
'posts_per_page' => '4',
'post_type' => 'tab-items',
'style' => 'default'
), $atts)
);
if($style == 'style-1')
{
//Add Your Style-1
} else if($style == 'style-2') {
//Add Your Style-2
} else {
$args = array( 'posts_per_page' => $posts_per_page, 'post_type'=> $post_type);
$myposts = get_posts( $args );
$tab_title = "";
$tab_content = "";
foreach ($myposts as $post)
{
setup_postdata($post);
$tab_title .= '<li>'.the_title().'</li>';
$tab_content .= '<div class="single_date_section_content tab-pane fade" id="tab-post-'.the_ID().'>
' . the_post_thumbnail('tab-image') . the_content() . '
</div>';
wp_reset_postdata();
}
?>
<!--nab section date content area-->
<div class="date_section_area">
<!-- Nav tabs -->
<div class="date_section_list">
<ul>
<?php echo $tab_title;?>
</ul>
</div>
<!-- Tab panes -->
<div class="date_section_content">
<?php echo $tab_content;?>
</div>
</div>
<?php
}
}
And shortcode will be like this:-
[my_post_shorcode posts_per_page="4" post_type="tab-items" style="default"]
Hope this will help you.

Resources