I have the following code
<div id="featured-posts" class="container_12">
<?php
global $post;
$myposts = get_posts('numberposts=3&category=12');
foreach($myposts as $post) :
?>
<?php global $post; ?>
<?php
$src = wp_get_attachment_image_src( get_post_thumbnail_id($post->ID), array( 5600,1000 ), false, '' );
?>
<?php
$colors = array("#000000", "#949c51", "#571c1e", "#f36533", "#782a80", "#f6a41d", "#ed1b24");
$randomColor = $colors[array_rand($colors)];
?>
<a href="LINK OF THE POST"><div class="grid_4 featured-home" style="background: url(<?php echo $src[0]; ?> ) !important;">
<div class="featured-details" style="border-color: <?php echo $randomColor; ?>;">
<h2 style="color: <?php echo $randomColor; ?>;"><?php the_title(); ?></h2>
<?php the_excerpt(); ?>
</div>
<div class="featured-lower" style="border-color: <?php echo $randomColor; ?>;"></div>
</div></a>
<?php endforeach; ?>
</div>
This takes the most recent 3 posts, in category 12 and displays them in a div. I want this whole div to link to the post. You'll see where it says LINK OF THE POST. Can anyone help me get the URL in here?
Thanks
dvent
Wordpress provides a method for that : the_permalink();
Look at http://codex.wordpress.org/The_Loop.
You can also use the get_permalink($id) method.
http://codex.wordpress.org/Function_Reference/get_permalink
Related
The featured thumbnail image is supposed to just show the single thumbnail image of the post but instead it pulls every post image and displays them instead for every post. Instead of just the post thumbnail. This is the code for it and also what it looks like on the page:
<?php $featured_image = new WP_Query('page_id=ID'); ?>
<?php while ($featured_image->have_posts()) : $featured_image->the_post(); ?>
<?php if (function_exists('has_post_thumbnail') && has_post_thumbnail()) { ?>
<?php $img_src = wp_get_attachment_image_src(get_post_thumbnail_id($post->ID), array(302, 170)); ?>
<div class="the-image">
<img src="<?php echo $img_src[0]; ?>" />
</div>
<?php }; ?>
<?php endwhile; ?>
thats the code for servering the image and heres what happens on the main page (I have 2 posts currently and a featured test image for both of them, the scaling works but as you can see, it puts both images, on both posts...)
I'm not sure if it needs to be inside my loop for the title and excerpt, or outside of it (currently inside).
Here is the full code for the recent posts sidebar:
<div class="col-lg-4 d-none d-lg-block">
<h3 style="text-align: center; font-weight: 700;">Recent Posts</h3>
<?php
$result = wp_get_recent_posts(array(
'numberposts' => 10,
'category' => '',
'post_status' => 'publish',
));
foreach( $result as $p ){
?>
<div class="paddingarea text-dark">
<?php if (function_exists('has_post_thumbnail') && has_post_thumbnail()) { ?>
<?php $img_src = wp_get_attachment_image_src(get_post_thumbnail_id($post->ID), array(302, 170)); ?>
<div class="the-image">
<img src="<?php echo $img_src[0]; ?>" />
</div>
<?php }; ?>
<a class="card-title" href="<?php echo get_permalink($p['ID']) ?>" style="font-weight: 600;"><?php echo $p['post_title']?></a><br />
<p class="card-text"><?php echo excerpt(10); ?></p>
</div>
<?php
}
?>
</div>
Try this, it's simple and it's working for me:
<?php
$result = wp_get_recent_posts(array(
'numberposts' => 10,
'category' => '',
'post_status' => 'publish',
));
foreach( $result as $p ){
?>
<div class="paddingarea text-dark">
<div class="the-image">
<img src="<?php echo get_the_post_thumbnail_url($p['ID'], array(302, 170)); ?>" />
</div>
<a class="card-title" href="<?php echo get_permalink($p['ID']) ?>" style="font-weight: 600;"><?php echo $p['post_title']?></a><br />
<p class="card-text"><?php //echo excerpt(10); ?></p>
</div>
<?php
}
?>
I am trying to setup my blog homepage to show the featured image and the title, so far everything is coming out fine except for some reason my code to add in the image is having issues even trying to follow what many other posts here have seemed to answer. Here is my code:
<div class="blogContainer">
<?php
while(have_posts()) {
the_post();?>
<?php $thumb = get_the_post_thumbnail_url(); ?>
<div class="blogItems" style="background-image: url('<?php echo $thumb;?>')">
<h4><?php the_title();?></h4>
</div>
<?php } ?>
I've tried a couple small variations such as this:
<?php
while(have_posts()) {
the_post();?>
<?php $url = wp_get_attachment_url( get_post_thumbnail_id($post->ID) ); ?>
<div class="blogItems" style="background-image: url('<?php echo $url; ?>')">
<h4><?php the_title();?></h4>
</div>
<?php } ?>
And this
<?php
while(have_posts()) {
the_post();?>
<?php $backgroundImg = wp_get_attachment_image_src( get_post_thumbnail_id($post->ID), 'full' ); ?>
<div class="blogItems" style="background-image: url('<?php echo $backgroundImg[0]; ?>');">
<h4><?php the_title();?></h4>
</div>
<?php } ?>
And all come out with the same issue of having the url just come up empty in the inspect tab. If someone has an answer it'd be much appreciated!
Please try below code:
<?php
$args = array(
'post_type' => 'post', //change with your post type
'posts_per_page' => -1
);
$query = new WP_Query( $args );
if ( $query->have_posts() ) : while ( $query->have_posts() ) : $query->the_post();
$thumb = get_the_post_thumbnail_url(); ?>
<div class="blogItems" style="background-image: url('<?php echo $thumb;?>');">
<h4><?php the_title();?></h4>
</div>
<?php endwhile; endif; ?>
Try adding get_the_ID() to get_the_post_thumbnail_url() in the first example:
<div class="blogContainer">
<?php
while(have_posts()) {
the_post();?>
<?php $thumb = get_the_post_thumbnail_url(get_the_ID()); ?>
<div class="blogItems" style="background-image: url('<?php echo $thumb;?>')">
<h4><?php the_title();?></h4>
</div>
<?php } ?>
My page: http://kevinkang.ca/en_US/all-properties/ was broken yesterday.
But I can't find any problem on these. Can anyone help me to find out the problem?
<div class="grid-x all-properties-page">
<?php
$args = array( 'category__not_in' => array( 4, 8, 9, 10 ) , 'posts_per_page' => -1 );
$loop = new WP_Query( $args );
while ( $loop->have_posts() ) : $loop->the_post(); ?>
<?php $i=0; ?>
<div class="medium-12 cell padding-top-page">
<div class="home-data description-title-price">
<div class="grid-container">
<div class="grid-x">
<div class="medium-6 cell">
<?php the_title(); ?>
</div>
<div class="medium-6 cell text-right">
<?php the_field('price'); ?>
</div>
</div>
</div>
</div>
<a href="<?php the_permalink(); ?>"><div class="grid-x">
<ul class="images3">
<?php
//Get the images ids from the post_metadata
$images = acf_photo_gallery('3-images', $post->ID);
$img3=0;
if( count($images) ):
//Cool, we got some data so now let's loop over it
foreach($images as $image):
$id = $image['id']; // The attachment id of the media
$title = $image['title']; //The title
$caption= $image['caption']; //The caption
$full_image_url= $image['full_image_url']; //Full size image url
$full_image_url = acf_photo_gallery_resize_image($full_image_url, 1562, 760); //Resized size to 262px width by 160px height image url
$thumbnail_image_url= $image['thumbnail_image_url']; //Get the thumbnail size image url 150px by 150px
$url= $image['url']; //Goto any link when clicked
$target= $image['target']; //Open normal or new tab
$alt = get_field('photo_gallery_alt', $id); //Get the alt which is a extra field (See below how to add extra fields)
$class = get_field('photo_gallery_class', $id);
$img3++;
?>
<?php if( !empty($url) ){ ?><a href="<?php echo $url; ?>" <?php echo ($target == 'true' )? 'target="_blank"': ''; ?>><?php } ?>
<li style="background-image: url(<?php echo $full_image_url; ?>);" class="img-list<?php echo $img3; ?>">
<?php if( !empty($url) ){ ?></a><?php } ?></li>
<?php endforeach; endif; ?>
</ul>
<?php foreach ( get_the_category() as $value) {
$i++; ?> <h3 class="cat<?php echo $i; ?> <?php echo $value->name; ?>"><?php echo $value->name;} ?></h3>
</div></a>
<div class="grid-container pr-address-bg">
<div class="address-cont price-address">
<?php the_field('price'); ?>
<?php the_field('address_first_line'); ?>
</div>
</div>
</div>
<?php endwhile; ?>
</div>
I see you have a lot of problems in your HTML ( inside , multiple tags. First check your HTML with https://validator.w3.org/. It looks the main parts of the problems come from header.php. I would have a look.
The image is set to return a URL in the Custom Fields Plugin however it is just coming up with img src Unknown, everything else works on the page except this... code is as follows: Thanks in advance for any help!
<?php get_header(); ?>
<?php
$args = array(
'post_type' => 'artists',
);
$query = new WP_Query( $args );
?>
<section class="row artists">
<?php if ( $query->have_posts() ) : while ( $query->have_posts() ) : $query->the_post(); ?>
<div class="col-sm-12 col-md-6 col-lg-3">
<a href="<?php if( get_post_field('artist_website') ) { ?>
<?php echo $artist_website; ?>
<?php } else { the_permalink(); } ?>">
<img src="<?php get_post_field('artist_feature_image'); ?>" alt="<?php echo the_title() ; ?>">
<p><?php echo the_title() ;?></p>
</a>
</div>
<?php endwhile; endif; wp_reset_postdata(); ?>
</section>
<?php get_footer(); ?>
The problem is that get_post_field('artist_feature_image') only return the image.
You need to display it with "echo"
<img src="<?php echo get_post_field('artist_feature_image'); ?>" />
And don't do echo the_title() ;, because the_title() is already doing an echo on get_the_title();
function the_title() {
echo get_the_title();
}
So if you want to display it you just have to do: the_title();
I have managed to get recent posts showing on my homepage which is working well. They only problem i have is that the full post and not the excerpt is showing.
<div id="home-news-container">
<?php query_posts('cat=#&posts_per_page=3'); ?>
<?php while (have_posts()) : the_post(); ?>
<div class="home-post-container">
<div class="home-post-thumb">
<a href="<?php echo get_permalink(); ?>">
<?php the_post_thumbnail('large_wide'); ?>
</a>
</div>
<div class="home-post-copy">
<h4>
<a href="<?php echo get_permalink(); ?>">
<?php the_title(); ?>
</a>
</h4>
<h5>
<?php the_date(); ?>
</h5>
<?php echo the_excerpt(); ?>
<div class="home-news-readmore">
read more
</div>
</div>
</div> <!-- end home-post-container -->
<?php endwhile; ?>
<?php wp_reset_query(); ?>
<div class="home-news-readmore news-extra">
more news
</div>
</div> <!--- end home-post-container -->
I don't understand what the problem is to be honest. I created a new full width template for the homepage which i thought might be causing it but its not. Bit stumped to be honest. Any help would be greatly appreciated
Use wp_get_recent_posts to get recent post
Use substr to display some limeted character of post character
<?php
$args = array (
'numberposts' => 3,
'post_type' => 'your post type name'
);
// the query
$recent_posts = new wp_get_recent_posts( $args );
foreach( $recent_posts as $recent ){
echo '<li>' . $recent["post_title"].' </li> ';
echo substr($recent["post_content"],0,100);
}
?>