Here is my code currently. I would like to only show the next and previous controls when there is more than one related post thumbnail. I have tried a few things but nothing gets me to where I want to be. Please help:
$recent_posts_query = new WP_Query($args);
if($recent_posts_query->have_posts()):
echo '<div class="recipes-slider-widget cs">
<h2 class="w-bot-border">';
echo $title;
echo '</h2>
<ul class="cycle-slideshow" data-cycle-fx=scrollHorz data-cycle-timeout=0 data-cycle-slides="li" data-cycle-next=".n'.$widget_idc.'" data-cycle-prev=".p'.$widget_idc.'">';
while($recent_posts_query->have_posts()):
$recent_posts_query->the_post();
?>
<?php
if(has_post_thumbnail())
{
?>
<li>
<a href="<?php the_permalink(); ?>">
<?php the_post_thumbnail('recipe-slider-widget'); ?>
</a>
<p class="info-box"><?php the_title() ?></p>
</li>
<?php
}
?>
<?php
endwhile;
echo ' </ul>
<span class="prev p'.$widget_idc.'"></span>
<span class="next n'.$widget_idc.'"></span>
</div>';
echo $after_widget;
endif;
}
Related
<?php
$featured_posts = get_field('director');
if( $featured_posts ): ?>
<ul>
<?php foreach( $featured_posts as $featured_post ):?>
<div class="movies-series-director">
<a class="movies-series-director-thumbnails" href="<?php echo get_page_link($featured_post->ID);?>"> <img src="<?php echo get_the_post_thumbnail_url($featured_post->ID, 'thumbnail');?>"></a>
<div class="movies-series-director-title">
<h4> <?php echo $featured_post->post_title;?> </h4>
<b>Director</b>
</div>
</div>
<?php endforeach; ?>
</ul>
<?php endif; ?>
Guys how to output like this.
If has thumbnail then post thumbanil
else if no thumnail then print this this image (no image)
You want to check if the thumbnail is empty, and if there is no thumbnail, display a default image.
So you use get_the_post_thumbnail_url() and check if it is empty.
if ( empty(get_the_post_thumbnail_url( $featured_post->ID)) ):
echo 'https://your-default-image_url.jpg';
else:
echo get_the_post_thumbnail_url( $featured_post->ID, 'thumbnail' );
endif;
If you like it a bit more readable, your code can look like:
<ul>
<?php foreach( $featured_posts as $featured_post ):?>
<?php $featured_image = get_the_post_thumbnail_url($featured_post->ID, 'thumbnail') ?: 'https://your-default-image_url.jpg'; ?>
<div class="movies-series-director">
<a class="movies-series-director-thumbnails" href="<?php echo get_page_link($featured_post->ID);?>"> <img src="<?php echo $featured_image;?>"></a>
<div class="movies-series-director-title">
<h4> <?php echo $featured_post->post_title;?> </h4>
<b>Director</b>
</div>
</div>
<?php endforeach; ?>
</ul>
Here is your working code:
<?php
$featured_posts = get_field('director');
if( $featured_posts ): ?>
<ul>
<?php foreach( $featured_posts as $featured_post ):?>
<div class="movies-series-director">
<a class="movies-series-director-thumbnails" href="<?php echo get_page_link($featured_post->ID);?>"> <img src="<?php echo get_the_post_thumbnail_url($featured_post->ID, 'thumbnail');?>"></a>
<div class="movies-series-director-title">
<h4> <?php echo $featured_post->post_title;?> </h4>
<b>Director</b>
</div>
</div>
<?php endforeach; ?>
</ul>
<?php else: ?>
.... here your code for "else"
<?php endif; ?>
I have created a custom Gutenberg block that is basically a link. When I click the block in the editor I immediately get sent to the page the block links to instead of being able to edit the block. How do I stop this from happening? I've already tried putting pointer-events: none as a style on it but that doesn't do anything surprisingly.
<a href="<?php the_field('link') ?>" id="<?php echo esc_attr($id); ?>" class="<?php echo esc_attr($className); ?> <?php echo esc_attr($layout); ?>">
<div class="icon_callout_content">
<div class="off_content">
<div class="color_callout_icon">
<img src="<?php echo $icon ?>" height="<?php if($iconHeight){ echo $iconHeight . "px"; } ?>">
</div>
<h3><?php echo $title ?></h3>
</div>
<div class="hover_content">
<?php echo $description ?>
</div>
</div>
</a>
Since this may help others in the future, wrap your <a> tag in an if statement to check if your in the admin area. If you are, then it won't output those tags.
<?php if ( ! is_admin() ) : ?>
<a href="<?php the_field('link') ?>" id="<?php echo esc_attr($id); ?>" class="<?php echo esc_attr($className); ?> <?php echo esc_attr($layout); ?>">
<?php endif; ?>
<div class="icon_callout_content">
<div class="off_content">
<div class="color_callout_icon">
<img src="<?php echo $icon ?>" height="<?php if($iconHeight){ echo $iconHeight . "px"; } ?>">
</div>
<h3><?php echo $title ?></h3>
</div>
<div class="hover_content">
<?php echo $description ?>
</div>
</div>
<?php if ( ! is_admin() ) : ?>
</a>
<?php endif; ?>
I have the following code (inherited, I didn't write it) and I'm struggling to understand why it's only bringing back the 4 most recent posts instead of all of them. That being said, I don't WANT all at once, but I want to be able to control how many come back.
Additionally, I'm going to need to write a function with a link at the bottom of this that says "Load more" and, when clicked, will bring back (via AJAX) the next four (or however many) posts to render immediately beneath the already displayed ones. How would I go about that?
Thanks!
<?php if (have_posts()): ?>
<div class="postSection">
<?php
while (have_posts()) : the_post();
$pdf_download = get_post_meta($post->ID, 'pdf_download', true);
$pdf_label = get_post_meta($post->ID, 'pdf_label', true);
?>
<div class='postBox <?php foreach ((get_the_category()) as $cats) {
echo $cats->slug . ' ';
} ?>'>
<div class="postImage">
<a href="<?php the_permalink(); ?>"
title="<?php the_title_attribute(); ?>"><?php the_post_thumbnail(); ?></a>
</div>
<div class="postContent">
<h3><a href="<?php the_permalink(); ?>"
title="<?php the_title_attribute(); ?>"><?php the_title(); ?></a>
</h3>
<div class="postExcerpt">
<p><?php the_excerpt_rss(); ?> <a class="readMore"
href="<?php the_permalink(); ?>"
title="<?php the_title_attribute(); ?>">Read
More</a></p>
</div>
</div>
</div>
<?php endwhile; ?>
</div>
<?php endif;
For a recently developed wordpress website http://stc.co.in, I'm using Huge-IT portfolio to show the projects in each sectors. On clicking on projects a popup is showing with multiple images. Now I want to show image caption or title above the big image which was added while uploading image through WordPress. Please guide how to achieve this.
Thanks in advance.
Regards, Sanjay
If the plugin cant let you do it simply with text editor, in wordpress you need to search the specific section you want and work on php file.
When you have founded it you can put an html section with your title.
you need to made changes in plugin file..
follow path :
wordpress-sitename/wp-content/plugins/portfolio-gallery/Front_end/portfolio_front_end_view.php
modify line :
<ul id="huge_it_portfolio_popup_list_<?php echo $portfolioID; ?>">
<?php
foreach($images as $key=>$row)
{
$imgurl=explode(";",$row->image_url);
array_pop($imgurl);
$link = $row->sl_url;
$descnohtml=strip_tags($row->description);
$result = substr($descnohtml, 0, 50);
?>
<li class="pupup-element" id="huge_it_portfolio_pupup_element_<?php echo $row->id; ?>">
<div class="heading-navigation_<?php echo $portfolioID; ?>">
<div style="clear:both;"></div>
</div>
<div class="popup-wrapper_<?php echo $portfolioID; ?>">
<div class="image-block_<?php echo $portfolioID; ?>">
<?php if($paramssld["ht_view2_show_popup_title"]=='on'){?><h3 class="title"><?php echo $row->name; ?></h3><?php } ?>
<?php if($row->image_url != ';'){ ?>
<img alt="<?php echo $row->name; ?>" id="wd-cl-img<?php echo $key; ?>" src="<?php echo $imgurl[0]; ?>" />
<?php
global $wpdb;
$cimg_url = $imgurl[0];
$attachment = $wpdb->get_results("SELECT ID FROM wp_posts WHERE guid='".$cimg_url."'",'ARRAY_A');
$attachment_title = get_the_title($attachment[0]['ID']);
?>
<div class="cls_img_ttl" id="main_img_ttl"><?php echo $attachment_title; ?></div>
<?php } else { ?>
<img alt="<?php echo $row->name; ?>" id="wd-cl-img<?php echo $key; ?>" src="images/noimage.jpg" />
<?php
} ?>
</div>
<div class="right-block">
<?php if($paramssld["ht_view2_show_popup_title"]=='on'){?><h3 class="title"><?php echo $row->name; ?></h3><?php } ?>
<?php if($paramssld["ht_view2_thumbs_position"]=='before' and $paramssld["ht_view2_show_thumbs"] == 'on'){?>
<div><ul class="thumbs-list_<?php echo $portfolioID; ?>">
<?php
global $wpdb;
foreach($imgurl as $key=>$img){
$cimg_url = $img;
$attachment = $wpdb->get_results("SELECT ID FROM wp_posts WHERE guid='".$cimg_url."'",'ARRAY_A');
$attachment_title = get_the_title($attachment[0]['ID']);
?>
<li><a href="<?php echo $row->sl_url; ?>" class="group1" data-ttl="<?php echo $attachment_title; ?>" >
<img src="<?php echo $img; ?>">
</a></li>
<?php } ?>
</ul></div>
<?php } ?>
<?php if($paramssld["ht_view2_show_description"]=='on'){?><div class="description"><?php echo $row->description; ?></div><?php } ?>
<?php if($paramssld["ht_view2_thumbs_position"]=='after' and $paramssld["ht_view2_show_thumbs"] == 'on'){?>
<div><ul class="thumbs-list_<?php echo $portfolioID; ?>">
<?php $imgurl=explode(";",$row->image_url);array_pop($imgurl);
foreach($imgurl as $key=>$img){?>
<li><img src="<?php echo $img; ?>"></li>
<?php } ?>
</ul></div>
<?php } ?>
<?php if($paramssld["ht_view2_show_popup_linkbutton"]=='on'){?>
<div class="button-block">
<a href="<?php echo $link; ?>" <?php if ($row->link_target=="on"){echo 'target="_blank"';}?>><?php echo $paramssld["ht_view2_popup_linkbutton_text"]; ?></a>
</div>
<?php } ?>
<div style="clear:both;"></div>
</div>
<div style="clear:both;"></div>
</div>
</li>
<?php
}?>
</ul>
JS:
jQuery('#huge_it_portfolio_popup_list_<?php echo $portfolioID; ?> .popup-wrapper_<?php echo $portfolioID; ?> .right-block ul.thumbs-list_<?php echo $portfolioID; ?> li a').click(function(){
var width=jQuery(window).width();
if(width<=767){
jQuery('body').scrollTop(0);
}
jQuery(this).parent().parent().find('li.active').removeClass('active');
jQuery(this).parent().addClass('active');
var main_img_ttl = jQuery(this).attr('data-ttl');
alert(main_img_ttl);
jQuery(this).parents('.right-block').prev().find('.cls_img_ttl').html(main_img_ttl);
jQuery(this).parents('.right-block').prev().find('img').attr('src',jQuery(this).find('img').attr('src'));
return false;
});
you can download file here : LINK
I try to show an WordPress Gallery on home page, but with the same effect present in a post page. Basically is show the gallery post on homepage when you clicking a post-thumb. I explain the problem:
When I click on post_thumb, show in the home I like this show me, a Gallery attatch in this post. This my code:
<ul id="rb-grid" class="list rb-grid">
<?php $number = 0; query_posts('category_name=atracciones-home'); if(have_posts()): ?>
<?php while(have_posts()): the_post(); ?>
<li>
<!-- <a data-fancybox-group="gallery" class="item fancybox" href="<?php the_permalink(); ?>"> -->
<a data-fancybox-group="gallery" class="item fancybox iframe" href="<?php get_attachment_link(); ?>">
<?php
if ( has_post_thumbnail() )
the_post_thumbnail('home-atracciones');
else
echo '<img src="' . trailingslashit( get_template_directory_uri() ) . 'img/default-thumbnail.png' . '" alt="" />';
?>
<div class="over" id="gallery-atracciones">
<h2 class="page-title" title="<?php the_title(); ?>"><?php the_title(); ?><span class="border"></span></h2>
</div>
</a>
</li>
<?php endwhile; ?>
<?php endif; wp_reset_query(); ?>
</ul>
Need to check is_home() For More Details about is_home() function Click Here
<?php
if ( is_home() ) {
// This is the blog posts index
<ul id="rb-grid" class="list rb-grid">
<?php $number = 0; query_posts('category_name=atracciones-home'); if(have_posts()): ?>
<?php while(have_posts()): the_post(); ?>
<li>
<!-- <a data-fancybox-group="gallery" class="item fancybox" href="<?php the_permalink(); ?>"> -->
<a data-fancybox-group="gallery" class="item fancybox iframe" href="<?php get_attachment_link(); ?>">
<?php
if ( has_post_thumbnail() )
the_post_thumbnail('home-atracciones');
else
echo '<img src="' . trailingslashit( get_template_directory_uri() ) . 'img/default-thumbnail.png' . '" alt="" />';
?>
<div class="over" id="gallery-atracciones">
<h2 class="page-title" title="<?php the_title(); ?>"><?php the_title(); ?><span class="border"></span></h2>
</div>
</a>
</li>
<?php endwhile; ?>
<?php endif; wp_reset_query(); ?>
</ul>
} else {
// This is not the blog posts index
get_sidebar();
}
?>