So I did my due diligence looking on here for an answer since this has come up a few times in the Treehouse forum, but found nothing related. I also tried to find a related topic on the acf site but that didn't give me the right info either. Hopefully you guys can help me out.
At the end of a tutorial on Treehouse, the instructions explain to add a few custom fields using ACF. He explains how to pull all of those in the code except on one crucial one.
We are supposed to create a checkbox field with the Field Label as Display on Homepage Slider and Field Name (or slug) as display_on_homepage. The idea is that we check this on each custom post entry that we want to display on the homepage slider, if you hadn't already guessed that.
Here's the code for the slider as it stands now.
<?php get_header('header.php'); ?>
</div>
<div id="featured" class="clearfix flexslider">
<ul class="slides">
<?php
$args = array(
'post_type' => 'work'
);
$the_query = new WP_Query( $args );
?>
<?php if ( have_posts() ) : while ( $the_query->have_posts() ) : $the_query->the_post(); ?>
<li style="background-color:<?php the_field( 'background_color' ); ?>;">
<div class="container">
<div class="grid_7">
<img src="<?php the_field( 'homepage_slider_image' ); ?>" alt="<?php the_title(); ?> Project Screenshot">
</div>
<div id="featured-info" class="grid_5 omega">
<h6>Featured Work</h6>
<h3><?php the_title(); ?></h3>
<p><?php the_field( 'description' ); ?></p>
<p><a class="btn blue" style="background-color: <?php the_field( 'button_color' ); ?>" href="<?php the_permalink(); ?>">View Project →</a></p>
</div>
</div>
</li>
<?php endwhile; endif; ?>
</ul>
</div>
I'm sure I need to pull some conditions in the args or even establish a different rule in my acf plugin, but I'm at a loss as to where to start with that can of worms. Thanks in advance for any help or advice. I'll be sure to forward this answer to the forum if I can get any assistance.
You'll want to add in an argument to your query for your custom field (meta field): http://codex.wordpress.org/Class_Reference/WP_Query
$args = array(
'post_type' => 'work',
'meta_key' =>'display_on_homepage',
'meta_value'=>'true'
);
The first answer is almost there, just missing a couple of commas :)
$args = array(
'post_type' => 'work',
'meta_key' =>'display_on_homepage',
'meta_value'=>'true'
);
Related
I have a related posts slider but currently there is not enough posts to actually slide. The design is such that it's not a simple case of displaying the posts but not sliding them until there is more.
As a short term solution, I am trying to find a way to loop through the posts twice to give the appearance of an infinite loop.
I am using slick slider and initially tried the settings:
infinite: true,
loop: true
but I can't get it to work even though apparently that should do the trick.
I am now trying to just pull through the posts twice
I have tried adjusting the count to things like
$count+1;
$count = 2
$count+=5;
All sorts of variations but I think I am way off base.
I would appreciate any help or a point in the right documentation. I have been reading about iterations but I can't grasp how they would be included in this as I had help with this from another developer.
<div class="log-book-carousel">
<?php
$current_page_id = get_the_ID();
$args = [
'posts_per_page' => '6',
'post__not_in' => [$current_page_id]
];
$the_query = new WP_Query( $args ); ?>
<?php
// Start our WP Query
while ($the_query -> have_posts()) : $the_query -> the_post();
// Display the Post Title with Hyperlink
?>
<div class="slides match-height">
<a href="<?php the_permalink(); ?>" title="Read more of the blog post '<?php the_title_attribute(); ?>'">
<?php if (has_post_thumbnail()) : ?>
<div class="log-book-slider-image">
<?php the_post_thumbnail(); ?>
</div>
<?php endif; ?>
<div class="log-book-details-wrapper white-bg">
<h3 class="black log-title"><?php the_title(); ?></h3>
<div class="log-book-slider-excerpt ">
<p class="log-book-text"><?php sew_display_post_intro_block( $post->ID, 10 ); ?></p>
</div>
</div>
</a>
</div>
<?php
$count++;
endwhile;
wp_reset_postdata();
?>
</div>
I'm having weird behaviour in WP loop on archive-issues.php
The post title is coming through correctly on all of them, but terms and permalink are getting messed up. %issues_categories% is not getting rewritten with anything on some of the posts and this behaviour comes up once there are posts with matching taxonomy and taxonomy gets grouped under some posts in this manner tax1,tax1,tax1 - like it's pulling it from the rest of the posts.
this is my loop on archive-issues.php , running in circles, let me know if you've come across similar and how you managed to fix this
<?php
query_posts(array(
'post_type' => 'issues',
'post_status' => 'publish',
'orderby' => 'date',
'order' => 'DESC'
));
?>
<?php
while (have_posts()) : the_post();
?>
<div class="tile">
<h4><?php echo the_terms($post->ID, 'issues_categories'); ?></h4>
<h3><?php the_title(); ?></h3>
<p class="link"><?php echo $card_link; ?></p>
<a class="abs-overlayer" href="<?php the_permalink(); ?>" title="<?php the_title(); ?>"><!-- empty --></a>
</div>
<?php endwhile;
wp_reset_query();
?>
I'm having some problems trying to show the first image of a gallery product on woocommerce,
I´m working on a personal wordpress theme, with personal template, all this work is into an owl carousel to show every product on a different slide,
I´m new with Woocommerce, I´m using WP_Query to show the products of a category, inside I´m showing the_title, the_content, the_permalink of every product on a while, I want to show the first and only one image inside the gallery of every product but I don´t know how to reach to it:
<div class="owl-carousel owl-theme" id="carousel">
<?php
$params = array(
'post_type' => 'product',
'post_status' => 'publish',
'posts_per_page' => '-1',
'product_cat' => 'barras'
);
$wc_query = new WP_Query($params);
if ($wc_query->have_posts()) :
while ($wc_query->have_posts()) :
$wc_query->the_post();
?>
<div class="item">
<a href="<?php the_permalink();?>">
<img src="<?php echo get_template_directory_uri(); ?>/assets/img/prev.png" alt="">
<img src="<?php echo get_template_directory_uri(); ?>/assets/img/next.png" alt="">
<p class="titulo-producto-slider"><?php the_title(); ?></p>
</a>
<div class="espacio-10"></div>
<div class="descripcion-producto-slider">
<?php the_content(); ?>
</div>
<div class="ver-detalle">
<ul>
<li>
Ver detalles
</li>
</ul>
</div>
</div>
<?php
endwhile;
wp_reset_postdata();
else: ?>
<p><?php _e( 'No Products' );?></p>
<?php endif;
?>
</div>
Sorry if you don´t understand something, it is my first question on stack and I don´t speak English,
Thanks a lot,
Try this:
$product = new WC_Product( get_the_ID() );
$attachment_ids = $product->get_gallery_image_ids();
if ( is_array( $attachment_ids ) && !empty($attachment_ids) ) {
$first_image_url = wp_get_attachment_url( $attachment_ids[0] );
// ... then do whatever you need to do
} // No images found
else {
// #TODO
}
For more details: WP_Product class reference.
I have created a custom field called "team member" with different labels to develop 7 different team member pages.
However, when I click on each of the member, they take me to a blank page with just header and footer. Looks like they are using the template single_Post.php.
How can I point the custom fields to a custom php template in the wordpress so that I can have one team member per page whenever I fill up the Team custom field in the back end.
<?php /* Template Name: Team */
get_header();
the_post();
$team_posts = get_posts( array(
'post_type' => 'team',
'posts_per_page' => 1, // Unlimited posts
) );
if ($team_posts):
?>
<div id="TeamBanner">
<?php
foreach($team_posts as $post):
setup_postdata($post);
$image = get_field('banner_image');
if( !empty($image) ):
?>
<img src= "<?php echo $image['url'];?>" alt="<?php echo $image['alt']; ?>"/>
<div id="innerbannerText" style="width:100%;">
<h1><?php the_field('member_name'); ?></h1>
<h3>
<i><?php the_field('member_subheading'); ?></i>
</h3>
<p> <span> <?php the_field('team_content'); ?> </span> </p>
<?php endif; ?>
<?php endforeach; ?>
</div>
<?php endif; ?>
</div>
Jon,
In this case, there are a couple of things you need to be aware of
Firstly, from the query above
$team_posts = get_posts( array(
'post_type' => 'team',
'posts_per_page' => 1, // Unlimited posts
) );
Your custom post type is called team. So what you need to do is (following the guide here - https://developer.wordpress.org/themes/basics/template-hierarchy/) to rename your custom-teampage.php file to single-team.php
This should sort your problem out. However, you may receive a 404 error when you try to look at one of your team pages. If this happens - follow this guide here: https://wordpress.stackexchange.com/questions/202859/custom-post-type-pages-are-not-found
Hopefully this will solve your problem
I have created a 'Latest Products' loop by inserting the following code into my 'index.php' file:
<section id="recent">
<h1>Recently Added</h1>
<ul class="row-fluid">
<?php
$args = array( 'post_type' => 'product', 'stock' => 1, 'posts_per_page' => 4, 'orderby' =>'date','order' => 'DESC' );
$loop = new WP_Query( $args );
while ( $loop->have_posts() ) : $loop->the_post(); global $product;
?>
<li class="span3">
<a id="id-<?php the_id(); ?>" href="<?php the_permalink(); ?>" title="<?php the_title(); ?>">
<?php if (has_post_thumbnail( $loop->post->ID )) echo get_the_post_thumbnail($loop->post->ID, 'shop_catalog'); else echo '<img src="'.woocommerce_placeholder_img_src().'" alt="Placeholder" width="65px" height="115px" />'; ?>
<h3><?php the_title(); ?></h3>
<span class="price">
<?php echo $product->get_price_html(); ?>
</span>
</a>
<?php woocommerce_template_loop_add_to_cart( $loop->post, $product ); ?>
</li>
<?php endwhile; ?>
<?php wp_reset_query(); ?>
</ul>
</section>
I now wish to be able to apply an arrow on the left and right of this row, where upon selecting the arrow, it will scroll through the images.
I am aware of the following codes:
<?php previous_post_link(); ?>
<?php next_post_link(); ?>
However, upon selection of their links, the user is taken to its dedicated page rather than being able to 'scroll' through the products.
Any suggestions on how I can achieve this?
Maybe you are looking for a carousel? There are a lot of jQuery plugins, i have used this one.
If you choose this solution, you should get the script, put it in your theme, add it, preferably in functions.php (more info here) and then add the carousel itself.
$('.row-fluid').owlCarousel({})
But insteal of all this maybe using a plugin like "WooCommerce Product Slider" or similar will be better. It provides shorcode and widget implementation which should work with most themes and can be used directly in the control panel withouth coding. One more note - if you still prefer to use your own code - maybe it'll be better to put it in a template file instead in index.php