I want to create a slider but i can't get the post excerpt working. The title and permalink are working but the excerpt won't show... here is my code:
// Args
$args = array(
'cat' => $categories,
'post_type' => 'post',
'posts_per_page' => $amount,
);
// Our incrementing counter, leave this set to 0
$counter = 0;
// Query the posts based off of the parameters in the $args variable
$bs_posts = new WP_Query( $args );
// Our calculated limit of how many posts we have to work with, don't change this
$bs_posts_limit = count( $bs_posts->posts ) - 1;
// How many posts to display in each slide of the SlideDeck
$per_page = !empty($this->options['per-slide']) ? $this->options['per-slide'] : '2';
// Add "active" class to 1st slider item
$j=1;
// Carousel/Slider Html
echo "$tab<div" . (!empty($this->options['id']) ? ' id="slider-' . trim($thesis->api->esc($this->options['id'])) . '"' : '') . ' class="carousel slide'. (!empty($this->options['c-type']) ? ' ' . trim($thesis->api->esc($this->options['c-type'])) : '') .''. (!empty($this->options['class']) ? ' ' . trim($thesis->api->esc($this->options['class'])) : '') . "\" data-ride=\"carousel\">\n".
"$tab<h2 class=\"text-shadow\">". stripslashes($this->options['intro']) ."</h2>\n".
"$tab<div class=\"carousel-inner\">\n";
?>
<?php foreach( $bs_posts->posts as $bs_post ): ?>
<?php
// Variables
$slide_number = floor( $counter / $per_page ) + 1;
$slide_mod = $counter % $per_page;
$bs_post_ID = $bs_post->ID;
$bs_post_title = get_the_title( $bs_post_ID );
$bs_post_link = get_permalink( $bs_post_ID );
$bs_post_excerpt = get_the_excerpt( $bs_post_ID );
?>
<?php if( $slide_mod == 0 ): ?>
<div class="item <?php if($j <= 1) {echo 'active';} ?>">
<?php endif; ?>
<div class="single">
<?php if (has_post_thumbnail( $bs_post->ID )) the_post_thumbnail( 'thumbnail', array( 'title' => "#htmlcaption") ) ?>
<?php echo $bs_post_title;?>
<?php echo $bs_post_excerpt; ?>
Read More
</div>
<?php if( $slide_mod == ( $per_page - 1 ) || $counter == $bs_posts_limit ): ?>
</div>
<?php endif; ?>
<?php $counter++; $j++;?>
<?php endforeach; ?>
<?
echo "$tab</div>\n".
"$tab</div>\n";
?>
<?
I want to create a slider based on bootstrap carousel plugin. Actualy i want to appear 2-3 or more posts per slide as you see and I succeded that but the slide only shows the post title and the post permalink. The excerpt and image won't work so please help me
After looking at the docs, I see that get_the_excerpt() does not take a post id parameter. It must be used within the lop.
http://codex.wordpress.org/Function_Reference/get_the_excerpt
If you want to get the excerpt outside of the loop, you will have to get the full content of the post and truncate it yourself.
Related
I know this question has been asked before. I checked through multiple answers on this site,
for example:
Wordpress loop with different bootstrap columns
https://wordpress.stackexchange.com/questions/222278/how-to-separate-posts-loop-in-to-two-columns/222281
... but I cannot work out how to integrate answers with my code (assuming that is possible).
I want to display a list of Categories and their related posts on a page.
The code I'm using works fine BUT displays the results in a single column down the page:
I want to split the display into 2 columns, like in the image below, if possible:
The code I'm using (currently placed in a new page template) is as follows:
<?php
/*
* Template Name: Alphabetical List
*/
get_header();
// Grab all the categories from the database that have posts.
$categories = get_terms( 'category', 'orderby=name&order=ASC');
// Loop through categories
foreach ( $categories as $category ) {
// Display category name
echo '<h2 class="post-title">' . $category->name . '</h2>';
echo '<div class="post-list">';
// WP_Query arguments
$args = array(
'cat' => $category->term_id,
'order' => 'ASC',
'orderby' => 'title',
);
// The Query
$query = new WP_Query( $args );
// The Loop
if ( $query->have_posts() ) {
while ( $query->have_posts() ) {
$query->the_post();
?>
<p><?php the_title(); ?></p>
<?php
} // End while
} // End if
echo '</div>';
// Restore original Post Data
wp_reset_postdata();
} // End foreach
get_footer();
?>
Wondering if anyone can help me to get this code to display loop results in 2 columns.
Many thanks.
UPDATE TO QUESTION
Karl, thanks for your answer. Your script works, but with a small problem:
The Categories/Related Posts display in 2 columns but a 'gap/space' appears in the middle of the display of data (see image below):
I added to your code slightly so I could display a custom field I inserted into each post. I'm not sure if this has caused the problem.
Altered code (changes are immediately after $query->the_post();):
<?php
/*
* Template Name: Alphabetical List
*/
get_header();
?>
<div style="height:100px"></div>
<?php
// Grab all the categories from the database that have posts.
$categories = get_terms( 'category', 'orderby=name&order=ASC');
// Loop through categories
echo "<div class='new-column'>";
$counter = 0;
foreach ( $categories as $category ) {
if($counter % 4 == 0 && $counter !=0){
echo "<div class='new-column'>";
}
// Display category name
echo '<h2 class="post-title">' . $category->name . '</h2>';
echo '<div class="post-list">';
// WP_Query arguments
$args = array(
'cat' => $category->term_id,
'order' => 'ASC',
'orderby' => 'title',
);
// The Query
$query = new WP_Query( $args );
// The Loop
if ( $query->have_posts() ) {
while ( $query->have_posts() ) {
$query->the_post();
$customfieldvalue = get_post_meta($post->ID, "PDF", true);
?>
<p><a href="<?php echo $customfieldvalue; ?>" target="_blank"><?php
the_title(); ?></a></p>
<?php
} // End while
} // End if
echo '</div>';
// Restore original Post Data
wp_reset_postdata();
$counter++;
if($counter % 4 == 0){
echo "</div>";
}
} // End foreach
if($counter % 4 != 0){
echo "</div>";
}
get_footer();
?>
I've used bootstrap classes (row, col-6). Checked the size of categories array and used 2 variables - one as a counter and the other one to check if the column is first or second.
<?php
/*
* Template Name: Alphabetical List
*/
get_header();
// Grab all the categories from the database that have posts.
$categories = get_terms( 'category', 'orderby=name&order=ASC');
//get size of category
$catSize = sizeof($categories);
$j = 1;
$n = 1;
// Loop through categories
foreach ( $categories as $category ) {
if($n == 1){
echo '<div class="row">';
}
echo'<div class="col-6">';
// Display category name
echo '<h2 class="post-title">' . $category->name . '</h2>';
echo '<div class="post-list">';
// WP_Query arguments
$args = array(
'cat' => $category->term_id,
'order' => 'ASC',
'orderby' => 'title',
);
// The Query
$query = new WP_Query( $args );
// The Loop
if ( $query->have_posts() ) {
while ( $query->have_posts() ) {
$query->the_post();
?>
<p><?php the_title(); ?></p>
<?php
} // End while
} // End if
echo '</div></div>';
if($n == 1){
if($j == $catSize){
echo '<div class="col-6"></div>
</div>';
}
else{
$n = 2;
}
}
else{
echo '</div>';
$n =1;
}
$j++;
}
// Restore original Post Data
wp_reset_postdata();
} // End foreach
get_footer();
?>
Try this, I used a modulos operator "%" to group loops into 4, it will create new column every 4 loops. MAKE SURE YOU ADD CSS TO class new-column to arrange it like columns.
<?php
/*
* Template Name: Alphabetical List
*/
get_header();
// Grab all the categories from the database that have posts.
$categories = get_terms( 'category', 'orderby=name&order=ASC');
// Loop through categories
echo "<div class='new-column'">;
$counter = 0;
foreach ( $categories as $category ) {
if($counter % 4 == 0 && $counter !=0){
echo "<div class='new-column'">;
}
// Display category name
echo '<h2 class="post-title">' . $category->name . '</h2>';
echo '<div class="post-list">';
// WP_Query arguments
$args = array(
'cat' => $category->term_id,
'order' => 'ASC',
'orderby' => 'title',
);
// The Query
$query = new WP_Query( $args );
// The Loop
if ( $query->have_posts() ) {
while ( $query->have_posts() ) {
$query->the_post();
?>
<p><?php the_title(); ?></p>
<?php
} // End while
} // End if
echo '</div>';
// Restore original Post Data
wp_reset_postdata();
$counter++;
if($counter % 4 == 0){
echo "</div>";
}
} // End foreach
if($counter % 4 != 0){
echo "</div>";`enter code here`
}
get_footer();
?>
I built a custom blog page in my custom wordpress theme, and I'm trying to add pagination to the blog page. Im' using a foreach loop, instead your standard "if while post" loop.
Everything is working find, however I'm not sure where to add "paged" as an argument.
Here is my code:
<?php if (is_page( 'Blog' )) : ?>
<?php
//Get the Posts
$posts = get_posts();
foreach ($posts as $post) :
setup_postdata( $post );
//Setup Post data
$haystack = get_the_category($post->ID);
$i = count($haystack);
$string = "";
for ($j=0; $j < $i; $j++) {
$string .= " ";
$string .= $haystack[$j]->slug;
}
$link = wp_get_attachment_image_src(get_post_thumbnail_id($post->ID), 'large', false );
$href = get_the_permalink();
$theCat = wp_get_post_categories($post->ID);
if (has_post_thumbnail($post->ID)){
$theCols = 'span12';
$imgWidth = 'span4';
$contentWidth = 'span8';
} else {
$theCols = 'span12';
$imgContainer ='display: none;';
$contentWidth = 'width: 100%;';
}
?>
<div class="<?php echo $string;?>">
<div id="post-<?php the_ID(); ?>" class="post-content <?php echo $theCols;?> group nopad">
<div class="post-content--image <?php echo $imgWidth;?> <?php echo $imgContainer;?>">
<img src="<?php echo $link[0]; ?>">
</div>
<!-- Post Content -->
<div class="post-content--container <?php echo $contentWidth;?>">
<?php
$post_title = get_the_title();
$post_title = explode(' ', $post_title);
$title = '';
for ($i=0; $i < 5 ; $i++) {
$title .= $post_title[$i];
$title .= ($i == 50) ? "..." : " ";
}
?>
<p class="post-content--date"><?php echo get_the_date('d M Y'); ?></p>
<h4 class="post-content--heading"><?php echo $title;?></h4>
<p class="post-content--cat"><?php echo $string;?></p>
<div class="post-content--text">
<?php
if ($theCat){
$str = substr(get_the_excerpt(), 0,255);
} else {
$str = get_the_excerpt();
}
$n = strpos($str, '<a');
if ($n > 0){
$rest = substr($str, 0, $n);
echo $rest;
} else {
echo $str;
}
?> ...
</div>
<button class="see-more-btn">Read More</button>
</div>
</div>
</div>
<?php endforeach;
wp_reset_postdata();?>
<?php else : ?>
<p>Critiria Not Found</p>
<?php endif; ?>
what am I missing? Thanks for the help in advance.
If you are going to use the get_posts function you need to set the posts_per_page and offset parameters. You need to check the current page and set the offset according to how many posts you are showing per page and the current page. For eg. On Page 2 and showing 5 posts per page you need to set the offset to 5 in order to skip the first 5 posts.
Note: The posts_per_page parameter does NOT work without setting the offset parameter.
$args = array(
'posts_per_page' => 5,
'offset' => 0
);
$posts_array = get_posts( $args );
One other way is to use the WP_Query and instead of passing the offset argument you just pass the page argument only like the example below where get_query_var('paged') get the value of the ?paged=x and if it its not set will default to '1'.
$paged = ( get_query_var('paged') ) ? get_query_var('paged') : 1;
$query = new WP_Query( array( 'paged' => $paged ) );
If you are going to use WP_Query you need to change from foreach to:
if ( $the_query->have_posts() ) {
while ( $the_query->have_posts() ) {
$the_query->the_post();
$post_id = get_the_ID();
$haystack = get_the_category($post_id);
$i = count($haystack);
}
}
To output the pagination links after the WP_Query you can use the paginate_links function as below. The advantage of using WP_Query is that you will also get the total number of posts found matching the current query parameters in found_posts and other values which you might need like max_num_pages.
echo paginate_links( array(
'base' => '%_%',
'total' => $query->max_num_pages,
'current' => max( 1, get_query_var( 'paged' ) ),
'format' => '?paged=%#%',
'show_all' => false,
'prev_next' => true,
'prev_text' => __('« Previous'),,
'next_text' => __('Next »'),
'add_args' => false,
'add_fragment' => '',
) );
get_posts: https://codex.wordpress.org/Template_Tags/get_posts
WP_Query: https://codex.wordpress.org/Class_Reference/WP_Query#Pagination_Parameters
paginate_links: https://codex.wordpress.org/Function_Reference/paginate_links
I'm very new to the Wordpress. I'm currently using the FoundationPress theme and I'm trying to add a button that the user can click to load more post.
What I want is that initially the user will see four blog posts and when the user click on the read more button it will load the next four until there are no more posts and the button disappear.
I got up to the point where I can load the first four posts, but I'm having a hard time setting up a button to display the next four posts.
This is what I have so far:
<section class="row blogArticleWrapper">
<?php while ( have_posts() ) : the_post(); ?>
<?php
the_post();
$blog_posts = get_posts( array(
'post_type' => 'blog',
'posts_per_page' => 4,
'offset' => 1,
'orderby' => 'date',
'order' => 'DESC'
) );
if ( $blog_posts ):
?>
<?php
foreach ( $blog_posts as $post ):
setup_postdata($post);
?>
<article class="blog-profile small-12 columns">
<span class="name"><?php the_field("news_title"); ?></span>
<p class="writtenBy">Written by: <?php the_field("news_written_by"); ?> <span class="date">Date: <?php the_field("news_date"); ?></span></p>
</article><!-- /.profile -->
<?php endforeach;
?>
<?php endif; ?>
<?php endwhile; // end of the loop. ?>
</section><!-- /.row -->
I tried following this guide, but I don't know how to use it on my page.
Any help is appreciated,
Thanks.
Remove:
while ( have_posts() ) : the_post(); ?>
the_post();
and
<?php endwhile; // end of the loop. ?>
Change request to
$paged = get_query_var('paged') ? get_query_var('paged') : 1;
$blog_posts = get_posts( array(
'post_type' => 'blog',
'posts_per_page' => 4,
'offset' => 1,
'paged' => $paged,
'orderby' => 'date',
'order' => 'DESC'
) );
Add to functions.php
function wp_corenavi() {
global $wp_query;
$pages = '';
$max = $wp_query->max_num_pages;
if (!$current = get_query_var('paged')) $current = 1;
$a['base'] = str_replace(999999999, '%#%', get_pagenum_link(999999999));
$a['total'] = $max;
$a['current'] = $current;
$total = 1;
$a['mid_size'] = 3;
$a['end_size'] = 1;
$a['prev_text'] = '«';
$a['next_text'] = '»';
if ($max > 1) echo '<div id="pagination" class="navigation column medium-12">';
if ($total == 1 && $max > 1) $pages = '<span class="pages">' . __('Page', 'Site') . $current . ' ' . __('of', 'Site') . ' ' . $max . '</span>'."\r\n";
echo $pages . paginate_links($a);
if ($max > 1) echo '</div>';
}
Add after endforeach; - wp_corenavi();wp_reset_postdata();;
Then jQuery ajax:
//Trigger ajax at the end of page
$(window).scroll(function(){
var top = $('body,html').scrollTop();
var height = $(window).height();
var docheight = $(document).height();
var screen = Number(docheight) - Number(height);
if( top >= screen ){
$('#pagination .next').click();
}
});
//do ajax on pagination
$('#pagination .next').on('click',function(e){
e.preventDefault();
$('#pagination').remove();
$.ajax({
type: "GET",
url: $(this).attr('href'),
dataType: "html",
success: function(out){
//We get blocks from next page , change selector to yours
result = $(out).find('.short-articles-wrapper-main .short-article');
//find next page pagination,change selector to yours
pagination = $(out).find('.short-articles-wrapper-main #pagination');
//append blocks from next page to current ,change selector to yours
$('.short-articles-wrapper-main').append(result);
//append pagination from next page to current, change selector to yours
$('.short-articles-wrapper-main').append(pagination.fadeIn(200));
}
});
});
Hope it will help you.
I have a custom wordpress function that shows the number of featured recipes. The function works fine when showposts=-1 is in the query. However when I put 'showposts=5' only two of my posts are shown.
Below is my function
function pika_featured_recipes_shortcode() {
ob_start();
echo '<div class="featured-box-heading"> Featured Recipes </div>';
echo '<div class="featured-box">';
$temp = $wp_query;
$wp_query = null;
$wp_query = new WP_Query();
$wp_query->query('showposts=5&post_type=cp_recipe&order=Desc&orderby=date' . '&paged=' . $paged);
while ($wp_query->have_posts()):
$wp_query->the_post();
$entry_id = get_the_ID();
$entry_link = get_permalink($entry_id);
$entry_image = get_post_thumbnail_id($entry_id);
$entry_title = get_the_title($entry_id);
$entry_description = get_post_meta($entry_id, '_cp_recipe_short_description', true);
$entry_excerpt = get_post_meta($entry_id, '_cp_recipe_excerpt', true);
$likes = get_post_meta( $entry_id, '_cp_likes', true );
if (get_field('featured-pika-recipe') == 'Yes') {
echo '<div class="featured-result-box item ">
<div class="box">
<div class="pika-featured-box-img">';
if(!empty($entry_image)) {
echo ''.wp_get_attachment_image($entry_image, 'cp_298_192').'';
}
echo' </div><!-- /.box-img -->';
echo'<div class="box-entry">
<h5 class="pika-featured-title"><a href="';
echo $entry_link;
echo '">';
echo $entry_title;
echo'</a></h5>';
echo $trimmed = wp_trim_words( $entry_description, $num_words = 15, $more = null );
echo'</div><!-- /.box-entry -->';
echo'</div>';
echo'</div>';
echo'<div style="clear:both"></div>';
}
endwhile;
wp_reset_query();
echo '</div>';
$output = ob_get_clean();
return $output;}
add_shortcode( 'pika_featured-recipes', 'pika_featured_recipes_shortcode' );
The problem seems to be with
if (get_field('featured-pika-recipe') == 'Yes') {
removing this and the number of posts appear fine. Any way i can resolve this?
maybe because only 2 posts ( of the last 5 posts that you actually call ) got
get_field('featured-pika-recipe') == 'Yes'
you can try to add this custom field directly to your query to get last 5 posts with this custom field with following code
'meta_key' => 'featured-pika-recipe',
'meta_value' => 'Yes'
First of all, I've been all over Google, StackExchange and Codex but still can't solve my problem. It might be simple; am not sure. I have the following function that lists custom posts. The page has more than one query but only one (this one) make use of pagination. It's on the front page - which is set to static.
Here is the function:
function wight_listings()
{
global $wp_query;
global $page;
$backup = $wp_query;
$wp_query = NULL;
$cur_page = $page; //get_query_var('page') ? get_query_var('page') : 1;
$args = array(
'post_type' => array('wight_listing'),
'posts_per_page' => 7,
'paged'=>$cur_page
);
$wp_query = new WP_Query($args);
?>
<?php if ( $wp_query->have_posts() ) : ?>
<?php while ( $wp_query->have_posts() ) : $wp_query->the_post(); ?>
.
.
.
<?php endwhile; ?>
<div id="nav-posts" style="margin-top: .5em;">
<div style="float:left;"><?php previous_posts_link('Previous Listings «'); ?></div>
<div style="float:right;"><?php next_posts_link('» Next Listings'); ?></div>
<div class="clear"></div>
</div>
<?php else: ?>
<p>Oh no! There's nothing to show. :(</p>
<?php endif; ?>
<?php
$wp_query = NULL;
$wp_query = $backup;
}
The 'Next listings' links shows up linking only to page 2 no matter what page am on and the 'Previous Listings' link never show up.
What am I doing wrong?
WP: 3.5.2
I found a solution. I looked into the /wp-includes/link-template.php and found the two functions responsible for my mysery. I copied them to my theme and modified a little and everything works fantastically.
function wight_get_previous_posts_page_link($cur_page)
{
if ( $cur_page > 1 )
{
$nextpage = intval($cur_page) - 1;
if ( $nextpage < 1 )
$nextpage = 1;
return '« Previous Listings';
}
}
function wight_get_next_posts_page_link($cur_page, $max_page)
{
$paged = $cur_page;
if ( !$paged )
$paged = 1;
$nextpage = intval($paged) + 1;
if ( $max_page >= $nextpage )
return 'Next Listings »';
}
Used those in place of previous_posts_link and next_posts_link.
<?php echo wight_get_previous_posts_page_link($cur_page); ?>
<?php echo wight_get_next_posts_page_link($cur_page, $query->max_num_pages); ?>