I`d like to do this:
<a href="...">
<img src="..." />
<h5>Older Post</h5>
<p>Titel</p>
</a>
My code
<?php next_post_link('%link', "$prevthumbnail __('<h5>Older Post</h5>'),
<p>%title</p>", TRUE); ?>
but doesn´t work at all. I´ve some syntax problems to combine PHP (WordPress translation) and HTML:
Thanks for your help
Ogni
--- UPDATE ---
<?php next_post_link('%link', "$nextthumbnail", TRUE); ?>
<?php next_post_link('%link', __("<span class='header'>Older post</span>", "SCNR"), TRUE); ?>
<?php next_post_link('%link', "<span>%title</span>", TRUE); ?>
This is untested, but it should work for what you need. Instead of using the next_post_link() function which was really meant for simpler links, we're building the link on our own.
<?php
// Gets the ID of the next post in the same term
$next_post = get_next_post( true );
// If that ID exists...
if ( ! empty( $next_post ) ) :
?>
<a href="<?php echo get_permalink( $next_post ); ?>">
<?php echo get_the_post_thumbnail( $next_post ); ?>
<h5><?php _e( 'Older Post', 'textdomain' ); ?></h5>
<p><?php echo get_the_title( $next_post ); ?></p>
</a>
<?php endif; ?>
You need some serious help, try this instead.
<?php
//connect to database and set variables or whatever
$link = "http://foo.bar";
$prevthumbnail = "img/foo.png";
$title = "The Foo Bar";
//then print this...
echo '<img src="'.$prevthumbnail.'" /><h5>Older Post</h5><p>'.$title.'</p>';
?>
Related
Here is a piece of my code.
<div class="thim-course-grid">
<?php while ( $the_query->have_posts() ) : $the_query->the_post(); ?>
<div class="lpr_course <?php echo 'course-grid-' . $columns; ?>">
**<div class="course-item" onmouseover="hide_card('<?= get_the_ID()?>');" onmouseout="show_card('<?= get_the_ID()?>');">**
<div class="course-thumbnail" id="course-thumbnail-<?= get_the_ID()?>">
<a href="<?php echo esc_url( get_the_permalink( get_the_ID() ) ); ?>">
<?php echo thim_get_feature_image( get_post_thumbnail_id( get_the_ID() ), 'full', $thumb_w, $thumb_h, get_the_title() ); ?>
</a>
<?php do_action( 'thim_inner_thumbnail_course' ); ?>
<!-- <a class="course-readmore"
href="<?php echo esc_url( get_the_permalink( get_the_ID() ) ); ?>"><?php echo esc_html__( 'Read More', 'eduma' ); ?></a> -->
</div>
<div class="thim-course-content" id="thim-course-content-<?= get_the_ID()?>">
<?php learn_press_courses_loop_item_instructor();
the_title( sprintf( '<h2 class="course-title">', esc_url( get_permalink() ) ), '</h2>' );
?>
<?php if ( class_exists( 'LP_Addon_Coming_Soon_Courses_Preload' ) && learn_press_is_coming_soon( get_the_ID() ) ): ?>
<div class="message message-warning learn-press-message coming-soon-message">
<?php esc_html_e( 'Coming soon', 'eduma' ) ?>
</div>
<?php else: ?>
<div class="course-meta">
<?php learn_press_courses_loop_item_instructor(); ?>
<?php thim_course_ratings(); ?>
<?php learn_press_courses_loop_item_students(); ?>
<?php thim_course_ratings_count(); ?>
<?php learn_press_courses_loop_item_price(); ?>
</div>
<?php learn_press_courses_loop_item_price(); ?>
<?php endif; ?>
<div class="course-readmore">
<?php esc_html_e( 'Read More', 'eduma' ); ?>
</div>
</div>
</div>
</div>
<?php
endwhile;
?>
</div>
On the 4th line, I wanted to truncate the course maps on mouse over, so that all the part of the map at the bottom of the image disappears, only to reappear when there is no more flyover. The result obtained is different from what I wanted.
I put the link to the site to see: www.formatine.com
And here is the JS part that I added as well.
function hide_card(id) {
document.getElementById('thim-course-content-'+id).style.display = 'none';
document.getElementById('course-thumbnail-'+id).innerHTML = "<?= wp_oembed_get( $media_intro ) ?>";
}
function show_card(id) {
document.getElementById('thim-course-content-'+id).style.display = 'block';
document.getElementById('course-thumbnail-'+id).style.display = 'block';
}
Do you have an idea for me please? Thank you.
Don't use "display: none" because once it has it, the element "disappears".
It is better for you, to then, if you want to include a video instead of the card, for example, do it by having both, one behind the other by default, if you "mouseover" display the code INSIDE of one, and on "mouseout", display the other.
<div class="mycard">
<div class="myinfoforthevideo"></div>
<div class="myvideo"></div>
</div>
You controll the events on mycard class, and hide myinfoforthevideo by default, on "mouseover", hide it and show then myvideo, and on "mouseout" hide myvideo and show myinfoforthevideo
You're hidding everything so now since its a width: 0/height: 0 let's say, you don't have any place to do the mouseover now.
Extra:
You can try flip cards as another option, like this:
https://codepen.io/Aoyue/pen/pLJqgE
So when I try to use ACF repeater field instead of showing me all the fields I get just the first one. The code is as follows.
<?php if( have_rows('vsi_projekti') ): ?>
<ul class="posts-grid">
<?php while( have_rows('vsi_projekti') ): the_row();
// vars
$image = get_sub_field('vsi_projekti_image');
$content = get_sub_field('project_name');
$link = get_sub_field('link_to_post');
?>
<li class="post-grid">
<a href="<?php echo $link; ?>">
<img src="<?php echo $image['url']; ?>" alt="<?php echo $image['alt'] ?>" />
<div class="post-title-hover"><?php echo $content; ?></div>
</a>
</li>
<?php endwhile; ?>
</ul>
<?php endif; ?>
Any advice on what I'm doing wrong to be getting out just 1 row instead of multiple?
I don't know if this has anything to do with my problem or not, but I'm adding just 1 row in every post. But in the end I should get out more then just row I think?
I think that you are confused what a ACF repeater field does. If you enter just one row in every post witrh a repeater, it's normal that you get only one row... because your code works perfectly fine ... for a repeater within a post... when you add 15 rowds in your post you will get all 15rows as output...
But if you want to output every row of every repeater of every post, yopur code doesn't work. You should try this instead:
<?php
$args = array(
'post_type' => 'post',
'posts_per_page' => -1
);
$posts = get_posts($args);
if( $posts ): ?>
<ul class="posts-grid">
<?php foreach( $posts as $post ): setup_postdata( $post ); ?>
<?php if( have_rows('vsi_projekti') ): ?>
<?php while( have_rows('vsi_projekti') ): the_row();
// vars
$image = get_sub_field('vsi_projekti_image');
$content = get_sub_field('project_name');
$link = get_sub_field('link_to_post');
?>
<li class="post-grid">
<a href="<?php echo $link; ?>">
<img src="<?php echo $image['url']; ?>" alt="<?php echo $image['alt'] ?>" />
<div class="post-title-hover"><?php echo $content; ?></div>
</a>
</li>
<?php endwhile; ?>
<?php endif; ?>
<?php endforeach; //foreach( $posts as $post ) ?>
<?php wp_reset_postdata(); ?>
</ul>
<?php endif; // if( $posts ) ?>
This code gets all posts and loops throug them... In every loop the repeater field is put out....
I was hoping someone might be able to help with an issue I'm having...
I'm currently building a Wordpress site and I'm putting together the posts section. Everything seems ok, when using a featured image on a post, it displays nicely in a thumbnail here: http://5.10.105.45/~learningforsusta/index.php/education-for-sustainable-development/ and then nicely inside the single post here: http://5.10.105.45/~learningforsusta/index.php/efsc-post/example-post-1/
However, on a post which doesn't have a featured image specified, it seems to be displaying a default image...
My question is, how can I get rid of the default image, if there is no featured image, I would like it to not display anything...
Here's the code I'm using to pull it all through:
<div class="container">
<div class="row">
<div class="col-md-9">
<?php if ( have_posts() ) : while ( have_posts() ) : the_post(); ?>
<div class="page-header">
<?php
$thumbnail_id = get_post_thumbnail_id();
$thumbnail_url = wp_get_attachment_image_src( $thumbnail_id, 'thumbnail-size', true );
$thumbnail_meta = get_post_meta( $thumbnail_id, '_wp_attachment_image_alt', true);
?>
<p class="featured-image"><img src="<?php echo $thumbnail_url[0]; ?>" alt="<?php echo $thumbnail_meta; ?>"></p>
<p><em>
By <?php the_author(); ?>
on <?php echo the_time('l, F jS, Y');?>
in <?php the_category( ', ' ); ?>.
<?php comments_number(); ?>
</em></p>
</div>
<?php the_content(); ?>
<hr>
<?php comments_template(); ?>
<?php endwhile; else: ?>
<div class="page-header">
<h1>Oh no!</h1>
</div>
<p>No content is appearing for this page!</p>
<?php endif; ?>
</div>
<?php get_sidebar( 'blog' ); ?>
</div>
and here's the code from the functions.php file that relates to the thumbnails...
add_theme_support( 'post-thumbnails' );
set_post_thumbnail_size(150, 120, true);
I'm sure I'm missing something simple, but I've tried altering things and i just can't figure it out!
Any help would be greatly appreciated...
Thanks,
Shaun
Make sure that you don't have any function attached to post_thumbnail_html filter, take a look at your functions.php (the best option would be to search in a whole wp-content directory, apply *.php filter to reduce result set)
Make sure you don't have any third-party plugin which can do this behind the scenes, e.g. this one.
You can try by using has_post_thumbnail() function and display with the_post_thumbnail()
<?php if ( has_post_thumbnail()): // Check if thumbnail exists ?>
<p class="featured-image">
<?php the_post_thumbnail('post-thumbnails'); ?>
</p>
<?php endif; ?>
Just check for existence of featured image before outputting it:
<?php
if( has_post_thumbnail() ):
$thumbnail_id = get_post_thumbnail_id();
$thumbnail_url = wp_get_attachment_image_src( $thumbnail_id, 'thumbnail-size', true );
$thumbnail_meta = get_post_meta( $thumbnail_id, '_wp_attachment_image_alt', true);?>
<p class="featured-image"><img src="<?php echo $thumbnail_url[0]; ?>" alt="<?php echo $thumbnail_meta; ?>"></p>
<?php endif;?>
I am trying to show a small version of the featured image as a post thumbnail on my main page (index.php). For this I am implementing it as the background-image of a div. Unfortunately the code (which had been working before) has stopped working now and I cannot find a reason why. I have been looking everywhere for a solution, but I just cant figure it out.
I am using the following code but unfortunately it doesnt return anything:
<?php $post_image_id = get_post_thumbnail_id($post_to_use->ID);
if ($post_image_id) {
$thumbnail = wp_get_attachment_image_src( $post_image_id, 'post-thumbnail', false);
if ($thumbnail) (string)$thumbnail = $thumbnail[0];
} ?>
<?php if (has_post_thumbnail()) : ?>
<div class="post_image_crop" style="background: url('<?php echo $thumbnail; ?>')">
</div>
<?php endif; ?>
You can have a look at it here: oliverprenzel.com
The weird thing is, I have done exactly the same thing on my single.php where it still does work.
<?php $post_image_id = get_post_thumbnail_id($post_to_use->ID);
if ($post_image_id) {
$thumbnail = wp_get_attachment_image_src( $post_image_id, 'post-thumbnail', false);
if ($thumbnail) (string)$thumbnail = $thumbnail[0];
} ?>
<?php if (has_post_thumbnail()) : ?>
<div class="post_image_bg" style="background: url('<?php echo $thumbnail; ?>'); background-size: 100% !important;">
</div>
<?php endif; ?>
You can have a look at it working here: oliverprenzel.com/headmagazine/
Does anyone have an idea what might be causing this?
Edit for Claudiu:
This is the loop I am trying to get the image in:
<div class="wrapper">
<?php $post_image_id = get_post_thumbnail_id( $post_id );
if ($post_image_id) {
$thumbnail = wp_get_attachment_image_src( $post_image_id, 'post-thumbnail', false);
if ($thumbnail) (string)$thumbnail = $thumbnail[0];
} ?>
<!-- post loop prev -->
<?php if (have_posts()) : ?>
<?php while (have_posts()) : the_post(); ?>
<a href="<?php the_permalink() ?>">
<div class="post_frame">
<div class="post_image_crop" style="background: url('<?php echo $thumbnail; ?>')">
</div>
<div class="prev_det">
<div class="prev_det_center">
<h1>
<?php the_title(); ?>
</h1>
<p><?php echo get_the_category_list(', '); ?></p>
</div>
</div>
<div class="prev_det_fold"></div>
</div>
</a>
<?php endwhile; ?>
<?php else: ?>
<?php endif; ?>
</div>
If you want to get each posts thumbnail, then you need to move
<?php $post_image_id = get_post_thumbnail_id( $post_id );
if ($post_image_id) {
$thumbnail = wp_get_attachment_image_src( $post_image_id, 'post-thumbnail', false);
if ($thumbnail) (string)$thumbnail = $thumbnail[0];
} ?>
inside the loop and change it to:
<?php $post_image_id = get_post_thumbnail_id( get_the_ID() );
if ($post_image_id) {
$thumbnail = wp_get_attachment_image_src( $post_image_id, 'post-thumbnail', false);
if ($thumbnail) (string)$thumbnail = $thumbnail[0];
} ?>
My guess is that $post_image_id is returning null because you don't have a featured image for your home page and even if you had, the same image will be displayed for each post.
I have a strong suspicion that in your first line $post_to_use->ID returns null. When the argument in get_post_thumbnail_id() returns null then the current post id is used by default. This is why it is working in single.php, because there you have a post loaded.
On frontpage you don't. So you have to check which post id you want, manually enter it or do a loop.
Try replacing get_post_thumbnail_id($post_to_use->ID) with get_post_thumbnail_id(5) where 5 is the post id that you want.
I am working on a custom blog roll for my website but cannot for the life of me figure out how to print out the author. Here is what I have so far:
<div id="blog_roll">
<?
$args = array('tag__not_in' => '5');
$posts = get_posts($args);
foreach($posts as $post) {
?>
<div class="waterfall">
<div id="waterfall_thumb">
<a href="<?php the_permalink(); ?>">
<?php the_post_thumbnail(); ?>
</a>
</div>
<div id="waterfall_title">
<a href="<?php the_permalink(); ?>">
<?php the_title(); ?>
</a>
</div>
<div id="waterfall_author">
by:<?php the_author();?>on <?php the_time( get_option( 'date_format' ) ); ?>
</div>
<div id="waterfall_exc">
<?php echo apply_filters( 'the_content', $post->post_excerpt ); ?></div>
</div>
<? } ?>
Any help would be greatly appreciated!
The the_author() function works only inside The Loop™. To get an author's details outside the Loop, you can take the author's ID from the $post object and use it with the the_author_meta() function:
… by: <?php the_author_meta('display_name', $post->post_author); ?> …
See the function reference in the WordPress Codex for other available fields.
By the way, the_permalink also works only inside the Loop. You need to use
<?php echo get_permalink($post->ID); ?>
I use this on my wordpress blog
$user_url = get_the_author_meta('user_url', $post->post_author);
$user_name = get_the_author_meta('user_nicename', $post->post_author);
echo '' . ' by ' . $user_name . '';
As the other user mentions, the_author is only available inside the loop, so you need to use the_author_metadata (http://codex.wordpress.org/Function_Reference/the_author_meta)