I’m using the below code to show two images (which I've set up with Advanced Custom Fields) from a random post from in the category ‘homepage’ on each refresh. It doesn’t appear to be working however and when I google it there are so many different ways to do it! Does anybody know if mine looks correct? I’m concerned I might be missing a closing tag or something minor.
<div class="feature-container">
<?php
$args = array(
'posts_per_page' => 1,
'orderby' => 'rand',
'category_name' => 'homepage',
);
$loop = new WP_Query($args);
while ($loop->have_posts()) : $loop->the_post();
if( have_rows('images') ):
while ( have_rows("images") ) :
the_row();
if ( get_sub_field( 'image' ) ): ?>
<a href="<?php echo $link['url']; ?>" target="<?php echo $link['target']; ?>">
<div class="image feature-item">
<div class="overlay" style="background-color:<?php the_sub_field('hover_colour');?>">
<div class="caption pm-big">
<?php
$link = get_sub_field('link');
if( $link ): ?>
<?php echo $link['title']; ?>
<?php endif; ?>
</div>
</div>
<img src="<?php the_sub_field('image');?>" alt="" style="display: block;">
</div>
</a>
<?php else: ?>
<!-- no images found -->
<?php endif;
endwhile;
else :
// no images found
endif;
endwhile; ?>
</div>
Related
I've got a problem with some code below
I use wordpress and the plugin ACF PRO.
I query some posts and in this posts their is a repeater field, but it seems that it shows only the first row of the repeater field 'evenement'.
I don't know if it's very clear ?
Somebody can help me.
Thanks
<?php $query = new WP_Query(
array(
'category__not_in' => array(520),
'category__and' => array(2905,1582),
'post_status' => array( 'draft'),
'post_type' => 'spectacles',
'lang' => 'fr',
'showposts' => -1,
'meta_key' => 'date_debut',
'orderby' => 'meta_value_num',
'order' => 'ASC')
);?>
<?php if($query->have_posts()) : while ($query->have_posts() ) : $query->the_post();?>
<a href="<?php the_permalink() ?>" title="<?php the_title(); ?>">
<div id="bloc-picto">
<div class="item-picto">
<img src="<?php $picto = get_field('picto');if( !empty($picto) ): ?><?php echo $picto['url']; ?><?php else: ?><?php $image_id = get_post_thumbnail_id(); $image_url = wp_get_attachment_image_src($image_id,'icon', true); echo $image_url[0]; ?><?php endif; ?>" width="40px" height="40px">
</div>
<div class="legend-picto">
<b><?php the_title(); ?></b>
<?php if( get_field('compagnie') ): ?>
<?php the_field('compagnie'); ?>
<?php endif; ?>
<br/>
<?php if( get_field('acces_star') ): ?>
<div style="font-size:10px"><?php the_field('acces_star'); ?></div>
<?php endif; ?>
<?php if( have_rows('evenement') ): while ( have_rows('evenement') ) : the_row(); ?>
<?php $post_object = get_sub_field('lieu_evenement');if( $post_object ):
$post = $post_object; setup_postdata( $post ); ?>
<i><?php the_title(); ?></i>
<?php wp_reset_postdata(); ?>
<?php endif; ?>
<?php endwhile; ?>
<?php endif; ?>
</div>
</div>
</a>
<?php wp_reset_postdata(); ?>
<?php endwhile; else: ?>
<?php endif; ?>
I ran into a similar issue with the have_rows() loop only returning the first layout when essentially nesting one query within another.
My solution was to redefine the $post variable after each layout. For example:
$post = 123;
setup_postdata( $post );
if ( have_rows( 'components' ) ) {
while ( have_rows( 'components' ) ) {
the_row();
$course_tmpl_name = str_replace( '_', '-', get_row_layout() );
// include your layout php here
$post = 123; // redefine $post
}
}
wp_reset_postdata();
I'm using a Gallery field in WordPress ACF and I want to show a gallery only four at a time. Therefore, to achieve this, I grabbed some code for a multi-carousel in Bootstrap 4 and wanted to achieve this same effect using ACF Gallery and PHP.
Here's my code attempt:
<div class="row blog">
<div class="col-md-12">
<div id="blogCarousel" class="carousel slide" data-ride="carousel">
[...]
<!-- Carousel items -->
<div class="carousel-inner">
<?php
$images = get_sub_field('gallery');
$i = 0;
$j = 0;
$internal_counter = 0;
?>
<?php while ( $i < $gallery_size ): ?>
<?php if ( $i % 4 === 0 ): ?>
<div class="carousel-item <?php if ( $internal_counter === 0 ): echo 'active'; endif; ?>">
<div class="row">
// BEGIN this is the part where i'm stuck on
<?php for ( $j = 0; $j < count ( $images ); $j++ ): ?>
<div class="col-md-3">
<a href="<?php echo $images[$j]['url']; ?>" data-toggle="lightbox" data-gallery="dayhome-gallery">
<img src="<?php echo $images[$j]['sizes']['large']; ?>" alt="<?php echo $images[$j]['alt']; ?>" />
</a>
</div>
<?php endfor; ?>
// END this is the part where i'm stuck on
</div>
</div>
<?php $internal_counter++; ?>
<?php endif; ?>
<?php $i++; ?>
<?php endwhile; ?>
</div>
</div>
</div>
</div>
I've highlighted in comments above where I'm stuck on. Right now it's just displaying 8 pictures at a time for each carousel item such as this picture below:
Here's the desired effect I want:
So, in this particular gallery, I want to show only four pictures at a time. I was thinking of performing something like this:
<?php
if ( $j % 4 === 0 ):
break;
endif;
?>
... but it breaks immediately because I started $j to be 0 because I also need the zeroth item in the gallery.
Thanks for any help with my code.
SOLVED!!!
<div class="carousel-item <?php if ( $internal_counter === 0 ): echo 'active'; endif; ?>">
<div class="row">
<?php while ( $j < count( $images ) ): ?>
<div class="col-md-3">
<a href="<?php echo $images[$j]['url']; ?>" data-toggle="lightbox" data-gallery="dayhome-gallery">
<img src="<?php echo $images[$j]['sizes']['large']; ?>" alt="<?php echo $images[$j]['alt']; ?>" />
</a>
</div>
<?php if ( ++$j % 4 === 0 ): ?>
<?php break; ?>
<?php endif; ?>
<?php endwhile; ?>
</div>
</div>
I had to make sure I put ++$j to pre-iterate my variable before comparing it to a modulus of 4.
For some reason the data-mainsrc attribute isn't outputting anything. I'm trying to get it to output the image url.
<?php $thumb = wp_get_attachment_image_src( get_post_thumbnail_id($post->ID), 'home-thumb' );$url = $thumb['0']; ?>
Did I format the code incorrectly?
Full code
<!-- Start the loop -->
<?php $home_query = new WP_Query('post_type=projects');
while($home_query->have_posts()) : $home_query->the_post(); ?>
<article class="project">
<img width="375" height="375" src="<?php bloginfo( 'template_url' ); ?>/img/loading.gif" data-mainsrc="<?php $thumb = wp_get_attachment_image_src( get_post_thumbnail_id($post->ID), 'home-thumb' );$url = $thumb['0']; ?>" class="attachment-home-thumb" alt="<?php the_title(); ?>">
<div class="overlay">
<a class="post-link expand" href="#" rel="<?php the_ID(); ?>">+</a>
</div>
</article>
<?php endwhile; ?>
<?php wp_reset_postdata(); // reset the query ?>
</div><!-- #projects-list -->
you are not echoing anything, just storing in a variable, so this
data-mainsrc="<?php
$thumb = wp_get_attachment_image_src( get_post_thumbnail_id($post->ID), 'home-thumb' );
$url = $thumb['0']; ?>"
probably ends up looking like this once it is evaluated by php
data-mainsrc=""
The functions that start with get_... only return a value, unlike the functions that start with the_... which echo it.
so how about this
<?php
$thumb = wp_get_attachment_image_src( get_post_thumbnail_id($post->ID), 'home-thumb');
$url = $thumb['0'];
?>
<img width="375" height="375" src="<?php bloginfo( 'template_url' ); ?>/img/loading.gif" data-mainsrc="<?php
echo $url; ?>" class="attachment-home-thumb" alt="<?php the_title(); ?>">
my featured post slider set as a tags. i want it set category base. how i can do it?my site http://techgajot.com
my featured post slider html code?
<script type="text/javascript">
//<![CDATA[
jQuery(window).load(function() {
jQuery('#featured').flexslider({
slideshowSpeed: 6000,
directionNav:false,
pauseOnHover:true,
manualControls: '.flexslide-custom-controls li a',
controlsContainer: '.container'
});
});
//]]>
</script>
<div class="featured">
<div class="container">
<div id="featured" class="flexslider">
<ul class="slides">
<?php
$count = 1;
$featurecount = get_option('solostream_features_number');
$my_query = new WP_Query("tag=featured&showposts=$featurecount");
while ($my_query->have_posts()) : $my_query->the_post();
$do_not_duplicate[] = $post->ID; ?>
<li id="narrow-feature-post-<?php echo $count; ?>"<?php echo solostream_featureclass(); ?>>
<div class="slide-container clearfix">
<?php if ( get_post_meta( $post->ID, 'video_embed', true ) ) { ?>
<div class="feature-video">
<div class="video"><?php echo get_post_meta( $post->ID, 'video_embed', true ); ?></div>
</div>
<?php } else { ?>
<div class="feature-image">
<?php solostream_feature_image(); ?>
</div>
<?php } ?>
<div class="flex-caption">
<div class="excerpt">
<h2 class="post-title"><?php the_title(); ?></h2>
<?php if ( 'post' == get_post_type() ) { ?>
<?php include (TEMPLATEPATH . "/postinfo.php"); ?>
<?php } ?>
<?php the_excerpt(); ?>
<p class="readmore"><a class="more-link" href="<?php the_permalink() ?>" rel="nofollow" title="<?php _e("Permanent Link to", "solostream"); ?> <?php the_title(); ?>"><?php _e("সম্পূর্ন অংশ", "solostream"); ?></a></p>
</div>
</div>
</div>
</li>
<?php $count = $count + 1 ?>
<?php endwhile; ?>
</ul>
</div>
<div class="controls-container clearfix">
<ul class="flexslide-custom-controls clearfix">
<?php
$count = 1;
$featurecount = get_option('solostream_features_number');
$my_query = new WP_Query("tag=featured&showposts=$featurecount");
while ($my_query->have_posts()) : $my_query->the_post();
$do_not_duplicate[] = $post->ID; ?>
<li><?php echo $count; ?></li>
<?php $count = $count + 1 ?>
<?php endwhile; ?>
</ul>
</div>
</div>
</div>
how i can do it. my featured post slider tags now= featured. when i put "featured" any post tags option then it show featured post. now i want it like category base. i select here any category.then that category all post show featured post.
If I understood you right ( difficult ike #dda noted ) Changing this line :
$my_query = new WP_Query("tag=featured&showposts=$featurecount");
to
$my_query = new WP_Query("category_name=featured&showposts=$featurecount");
Will make the same query from tag to category using name ..
If you use ID , then
$query = new WP_Query( 'cat=2,7,23,35' );
Or all posts that share this category :
$query = new WP_Query( 'category_name=staff' );
Read more HERE ON THE CODEX
I am rather new to Wordpress and have a question. I have created my own theme, which all seems to work fine. But, I am having one issue. I want to create my blog page (with all the posts) on a page other than my home page. So, in my theme folder, I created a page template called blog.php:
<?php
/*
Template Name: blog
*/
?>
<?php get_header(); ?>
<table id="about-table" >
<tr>
<td colspan="7">
<?php if (have_posts()) : while (have_posts()) : the_post();?>
<?php the_title(); ?>
<?php the_author(); ?>
<?php the_time("jS F"); ?>
<?php comments_number("0","1","%"); ?>
<?php the_excerpt(); ?>
<?php endwhile; endif; ?>
</td>
</tr>
</table>
<?php get_footer(); ?>
Then, I created a page in wordpress called "blog" as well, in the "pages" section in the dashboard. I then assigned its template to the above "blog" template. The problem is, though, that the code does not work as it should. Instead of showing me the titles, comments, etc of the posts, it displays some other info. On the other hand, if i just copy this:
<table id="about-table" >
<tr>
<td colspan="7">
<?php if (have_posts()) : while (have_posts()) : the_post();?>
<?php the_title(); ?>
<?php the_author(); ?>
<?php the_time("jS F"); ?>
<?php comments_number("0","1","%"); ?>
<?php the_excerpt(); ?>
<?php endwhile; endif; ?>
</td>
</tr>
</table>
to my index page, it works fine. So, how do I display all my post info on a page other than the home page?
I wanted to provide you with a simpler loop as a second option. If you use this and set Reading settings to the specific blog page this works well:
<?
/*
Template Name: Blog Template Example
*/
?>
<?php get_header(); ?>
<?php if (have_posts()) : while (have_posts()) : the_post(); ?>
<div <?php post_class(); ?> id="post-<?php the_ID(); ?>">
<h1><?php the_title(); ?></h1>
<?php the_content(); ?>
</div>
<?php endwhile; ?>
<div class="navigation">
<div class="next-posts"><?php next_posts_link(); ?></div>
<div class="prev-posts"><?php previous_posts_link(); ?></div>
</div>
<?php else : ?>
<div <?php post_class(); ?> id="post-<?php the_ID(); ?>">
<h1>Not Found</h1>
</div>
<?php endif; ?>
<?php get_sidebar(); ?>
<?php get_footer(); ?>
How about you do something like this:
blog-template.php:
<?php/*
Template Name: Blog Page
*/
?>
<?php get_header(); ?>
<?php get_template_part( 'layout-page', 'blog' );?>
<?php get_footer(); ?>
layout-page-blog.php:
<?php
the_post();
$title = get_the_title();
$baselink = get_permalink();
$category = get_field('category_blog');
if( !empty($category) ){
$post_per_page = get_option('posts_per_page');
$paged = (get_query_var('page')) ? get_query_var('page') : 1;
$categoryID = get_category_id($category);
$total = get_post_count(array($categoryID));
$the_query = new WP_Query("posts_per_page={$post_per_page}&cat= {$categoryID}&paged={$paged}");
?>
<div id="wrapper">
<div id="content">
<h1 class="title"><?php echo $title; ?></h1>
<div class="content-middle">
<div class="node">
<?php while ( $the_query->have_posts() ) : $the_query->the_post(); ?>
<h3><?php the_title(); ?></h3>
<div class="content">
<?php echo content(150); ?>
</div>
<div class="read-more">Read more</div>
<?php endwhile; ?>
<br/><br/>
<div class="wp-paginate">
<?php
wp_reset_query();
echo paginate_links( array(
'base' => $baselink.'%_%',
'total' => ceil($total/$post_per_page),
'current' => $paged,
));
?>
</div>
</div>
</div>
</div> <!-- end content -->
<div style="clear:both"></div>
</div>
<?php
}
?>
This could all be in one file, or you can use it in two pieces as I have written it.
EDIT:
Sorry I have it set to also grab the images from the post. I think this is the functions code you need:
function get_images_by_cat($id){
$limit = 1000;
$the_query = new WP_Query("posts_per_page={$limit}&cat={$id}");
$arr = array();
while ( $the_query->have_posts() ) {
$the_query->the_post();
$title = get_the_title();
$image_src = get_field('banner_image');
$image_link = get_field('banner_link');
$arr[] = array(
"title" => $title,
"link" => $image_link,
"image" => $image_src,
);
}
wp_reset_query();
return $arr;
}