I want to display images in Wordpress inbuilt function the_title(). Please help.
My code:
<?php the_title( '<h3 class="entry-title"><img src="<?php echo (get_template_directory_uri()); ?>/images/line.png">','<img src="<?php echo (get_template_directory_uri()); ?>/images/line.png"></h3>' ); ?>
the_title() works like this:
<?php the_title( $before, $after, $echo ); ?>
By default $echo = true , so just pass the $before and $after
Use like this :
<?php the_title( '<h3 class="entry-title"><img src="'.get_template_directory_uri().'/images/line.png">','</h3>' ); ?>
if the image is needed both before and after the title use this code below :
<?php the_title( '<h3 class="entry-title"><img src="'.get_template_directory_uri().'/images/line.png">','<img src="'.get_template_directory_uri().'/images/line.png"></h3>' ); ?>
If you like to add image in all title of project,its better to us the_title filter
(in given code, get_template_directory_uri() is used for parent theme, if you work in child theme then you have to change it with "get_stylesheet_directory_uri()")
function add_image( $title) {
$src = get_template_directory_uri().'/assests/images/header.jpg';
return $title.'<img src=" '.$src.' ">';
}
add_filter( 'the_title', 'add_image', 10);
Related
I want to re-title my image's alt tags etc based on the page they are being displayed on. For SEO Purposes.
I've tried to write a PHP function to do so and call the function on page load with "alt=<?php echo $post_title ?>" and "title=<?php echo $post_title ?>" but nothing is working.
How would you do it? PHP or jQuery... or?
Here's one of the functions I tried to manipulate and turn into something that works... I did get it to change the alt tags but I havent had any success beyond that.
function isa_add_img_title( $attr, $attachment = null ) {
$img_title = trim( strip_tags( $attachment->post_title ) );
$attr['title'] = $img_title;
$attr['alt'] = $img_title;
return $attr;
}
add_filter('wp_get_attachment_image_attributes','isa_add_img_title', 10, 2);
It appears this post may have had the answer but the link in the answer is now broken:
Dynamically filling image alt tags with the page title, PHP
Thanks so much! Appreciate any help.
This will set the alt and title of every image on the page to the post title.
function duck_diver_add_img_title( $attr, $attachment = null ) {
// Fetch the global post object. This is what the page it's on is.
global $post;
// Get the post title.
$img_title = wp_kses_post( $post->post_title );
$attr['title'] = $img_title;
$attr['alt'] = $img_title;
return $attr;
}
add_filter( 'wp_get_attachment_image_attributes', 'duck_diver_add_img_title', 10, 2 );
<!DOCTYPE html>
<?php
$test ="Test";
?>
<html>
<head>
<title><?php echo "$test" ?></title>
</head>
<body>
<div class="center">
<img src="ribbn2.jpg" alt=<?php echo "$test" ?> width="100%" height="100%">
i add following codes in WordPress theme tag.php file
<?php
while ( have_posts() ) :
the_post();
$title = strstr(the_title(), '|', true);
$link = get_permalink();
echo '<a class="w3-bar-item w3-button" href="'.$link.'" target="_top" rel="noopener noreferrer">'.$title.'</a>';
endwhile;
?>
it seems PHP strstr function not working in this file and $title not printed within a tag.
thanks in advance
You sould replace the third argument of the_title() by false:
$title = strstr(the_title(), '|', true);
to
$title = strstr(the_title('','',false), '|', true);
(void|string) Void if $echo argument is true, current post title if
$echo is false.
Source: https://developer.wordpress.org/reference/functions/the_title/
I am trying to code a small custom wordpress theme. So I am overriding on the twentytwenty theme of wordpress.
Just to be clear I am talking PHP and overriding home.php, where I want to create some custom html header.
I am trying to get the url of the logo (that I (or the user, can change) using the wordpress customizer.
What I did is :
<img src="<?php echo (get_custom_logo()) ? get_custom_logo() : 'somefallback_url'; ?>" >
What is happening is :
get_custom_logo() function is returning an Image which is normal, I can't find the function that should return the URL in the codex. An error is happening i have an image inside another one.
So basically what I want is :
A PHP function that returns just the URL not the full Image tag.
For a short one-liner:
<?php echo esc_url( wp_get_attachment_image_src( get_theme_mod( 'custom_logo' ), 'full' )[0] ); ?>
The codex lies it out for you
function get_custom_logo_url()
{
$custom_logo_id = get_theme_mod( 'custom_logo' );
$image = wp_get_attachment_image_src( $custom_logo_id , 'full' );
return $image[0];
}
if you want to return only the image src URL you can use this with the simplest way.
$custom_logo_id = get_theme_mod( 'custom_logo' );
$image_url = wp_get_attachment_image_src ( $custom_logo_id , 'full' );
I have created a very simple plugin for my Wordpress site to display links to my most recent posts with the use of a shortcode ([recentposts]). The plugin works so far but I am struggling with finding a way to display the featured image for each post that is called in the <div> tags for each post link.
Can you please advise how I may do this. The code for my plugin is as follows:
<?php
/*
Plugin Name: Blog Display Blocks
Description: Plugin to display blog posts in block with shortcode
Author: Chris Brosnan
*/
function RecentPosts() {
$recent_posts = wp_get_recent_posts(6);
echo '<div class="blog-contain">';
foreach( $recent_posts as $recent ){
echo '<div class="third-box">' . $recent["post_title"].' </div> ';
}
};
echo '</div>';
add_shortcode('recentposts', 'RecentPosts');
register_activation_hook( __FILE__, array( 'Blogdisplay', 'plugin_activation' ) );
register_deactivation_hook( __FILE__, array( 'Blogdisplay', 'plugin_deactivation' ) );
?>
What would I need to do in order to show the featured image alongside the corresponding link for each post that is called?
Through trial and error combined with some further searching I have now found the solution to my question.
<?php
/*
Plugin Name: Blog Display Blocks
Description: Plugin to display blog posts in block with shortcode
Author: Chris Brosnan
*/
add_image_size( 'featured-thumb', 300, 200, true ); // (cropped)
function RecentPosts() {
$rPosts = new WP_Query();
$rPosts->query('showposts=6');
while ($rPosts->have_posts()) : $rPosts->the_post(); ?>
<?php $image = wp_get_attachment_image_src( get_post_thumbnail_id( $post->ID ), 'featured-thumb' ); ?>
<?php $image_url = $image[0]; ?>
<a href="<?php the_permalink(); ?>">
<div class="third-box" style="background-image: url(<?php echo $image_url; ?>);">
<p><?php the_title();?></p>
</div>
</a>
<?php endwhile;
wp_reset_query();
};
add_shortcode('recentposts', 'RecentPosts');
register_activation_hook( __FILE__, array( 'Blogdisplay', 'plugin_activation' ) );
register_deactivation_hook( __FILE__, array( 'Blogdisplay', 'plugin_deactivation' ) );
?>
Within your code by using wp_get_recent_posts() you will get the post id($recent["ID"]), then you can use any one of following,
just add this in your code where you want to show the featured image.
$image = wp_get_attachment_image_src( get_post_thumbnail_id( $recent["ID"] ), 'single-post-thumbnail' );
or can use
echo get_the_post_thumbnail($recent["ID"], 'featured-image');
So I set up my wordpress theme to allow users to upload featured images, and Im building my index page to display selected pages' featured images but would also like to display the description of the image.
The thing is, Im not using the loop, Im pulling the page IDs using wordpress's settings API as options.
So displaying the featured images is done like this:
<?php $bucket_options = get_option('frontpage_display_options'); ?>
<?php $page_one = $bucket_options['frontpage_bucket_one']; ?>
<?php $page_one = get_post($page_one); ?>
<?php if (has_post_thumbnail($page_one->ID)) : ?>
<?php echo get_the_post_thumbnail($page_one->ID, 'bucket'); ?>
<?php endif; ?>
I keep reading that this will work:
echo get_post(get_the_post_thumbnail_id($page_one->ID))->post_content;
or this:
echo get_post(get_the_post_thumbnail($page_one->ID))->post_content;
But neither of them displays anything
That capability is awaiting a new release: http://core.trac.wordpress.org/ticket/12235
But a solution that is floating around is to create a function in functions.php:
function the_post_thumbnail_caption() {
global $post;
$thumbnail_id = get_post_thumbnail_id($post->ID);
$thumbnail_image = get_posts(array('p' => $thumbnail_id, 'post_type' => 'attachment'));
if ($thumbnail_image && isset($thumbnail_image[0])) {
echo '<span>'.$thumbnail_image[0]->post_excerpt.'</span>';
}
}
And then call the_post_thumbnail_caption();
This works for me. It echo's the title, caption and description of the featured image.
<?php
if ( has_post_thumbnail() ) :
the_post_thumbnail();
echo '<p>' . get_post(get_post_thumbnail_id())->post_title . '</p>';
echo '<p>' . get_post(get_post_thumbnail_id())->post_excerpt . '</p>';
echo '<p>' . get_post(get_post_thumbnail_id())->post_content . '</p>';
endif;
?>