I like to use the page's featured images in a background image in the header. When I add a new page and set the featured image, it appears as background image works exactly what I wanted. But on a Blog main page (the Home, page of displaying posts) I set the featured image and in the header display the first post's featured image insetad the one I set at the page's featured image. Tried to find solution, but nothing works, don't know how to magae it. Here is my code that handle background image:
<div class="sub-header"
<?php
if (has_post_thumbnail( $post->ID ) ):
$image = wp_get_attachment_image_src( get_post_thumbnail_id( $post->ID ), 'single-post-thumbnail' );
echo 'style="background-image: url(\'';
echo $image[0];
echo '\');"';
endif;
?>
>
</div>
Make the custom image source, whether it's assigned in the customizer or hard coded.
Related
anyone help me to make the full background of my wp loop posts is the thumbnail of featured image of the post
enter image description here
In your header.php OR single.php file (wherever your opening <body> element is) you can do something like:
<body style="background: url('<?php echo get_the_post_thumbnail_url($post->ID, 'thumbnail'); ?>') no-repeat center center;">
OR you could wrap your post in a new wrapper div and set the background the same way. Note You will have to be inside the loop to use the $post object properly OR you can call global $post; at the top of the file you are trying to set this on.
If you wish to use the full version of the uploaded featured image, simply change the thumbnail parameter to full in the get_the_post_thumbnail_url() function.
Reference: https://developer.wordpress.org/reference/functions/get_the_post_thumbnail_url/
You can get featured image url in wp loop by post id and add featured image as background image to your main div
<?php $image = wp_get_attachment_image_src( get_post_thumbnail_id( $post->ID, 'single-post-thumbnail' ); ?>
<div id="custom-bg" style="background-image: url('<?php echo $image[0]; ?>')"></div>
Is there a way to get a thumbnail from any website link? For example, if I take a link from imgur and post it on my website in the post itself, it shows the image. But when I go to the homepage of my website there is no featured image for that post. Just a great box. How could I generate a featured image of any link I posted from an external website?
I have used the video thumbnail plugin but it only works with certain websites.
try going into page.php of your theme, then search for the_post_thmbnail(). There add the image link
change this line:
<?php the_post_thumbnail(); ?>
to something like this:
<?php $name = get_post_meta($post->ID, 'ExternalUrl', true);
if( $name ) { ?>
<?php the_post_thumbnail(); ?>
<?php } else {
the_post_thumbnail();
} ?>
hope this helps :)
I used an image in portfolio page as well as in slider.
In the portfolio page the image is rendering correctly with the url /wp-content/uploads/2015/08/em-hospital-2.png?resize=300%2C223 300w, /wp-content/uploads/2015/08/em-hospital-2.png?w=498 498w .
In the slider, the image url (/wp-content/uploads/2015/08/em-hospital-2.png?fit=1%2C1) get changed and is not rendering.
I am not able to understand why fit=1%2C1 added at the end.
if you use featured image in slider and on portfilo page than can you please try this
<?php
$thumb_id = 25;
$url = wp_get_attachment_thumb_url( $thumb_id );
?>
<img src="<?php echo $url ?>"/>
Here $thumb_id = 25; Is Post ID you can replace 25 with your post ID
I want to remove the featured image in post and page, but keep it as thumbnail so that the site look good! My site is a wordpress based site.
Here's an example post of the site: http://www.tradingspotsilver.com/build-mt4-custom-ea-indicator-forex-free/
You could see that the featured image is on top of the post and occupy a lot of space. I've tried to look at the theme source but no luck.
The link given in your question is a single post page, you look in to your theme's root folder and can find a file named single.php, in that file you may find something like this
// "custom_size" could be anything like "single_page_image"
if ( has_post_thumbnail() ) : the_post_thumbnail('custom_size');
This line of code is responsible for showing the big image. Just remove this line and your image will not show up. Also, you may check this answer for custom image sizing.
For page template, you may look for a file named page.php and look for the similar code.
you can use timthumb for resizing:
with the code here: { https://code.google.com/p/timthumb/source/browse/trunk/timthumb.php }
create a file named timthumb.php in your theme folder, and at the place of the featured image php script, type:
if ( has_post_thumbnail() ) { // check if the post has a Post Thumbnail assigned to it.
//the_post_thumbnail();
$url = wp_get_attachment_url( get_post_thumbnail_id($post->ID) ); ?>
<div class="img-hold"> <img src="<?php bloginfo('template_directory') ?>/timthumb.php?src=<?php echo $url; ?>&w=219&h=125" width="219" height="125" /></div>
<p><? }
echo $content;
?></p>
change the value of height and width as per your wish at &w=, &h= and also width= , height=
hope this helps
just remove the the_post_thumbnail code in the single.php and page.php or content.php.
this function use in wordpress for show featured so just remove or comment it.
check your single.php and content.php page to solve this problem its right there
if you dont require that code comment it / or modify it as you want.
dont mess things go easy with it or otherwise you will end up getting error
I had the same issue and i could not find any solution in single.php
Its simple although:
just comment:
from content.php page
This is for the Dazzle Theme
I found mine in "content-single.php and removed :
<?php the_post_thumbnail( 'dazzling-featured', array( 'class' => 'thumbnail' )); ?>
Picture was gone from post.
It is obviously varies depending on theme.
For theme Freemium you need to remove the following lines in wp-content/themes/freemium/single.php:
<?php $freemium_feat_image = wp_get_attachment_url( get_post_thumbnail_id($post->ID) ); if($freemium_feat_image!="") { ?>
<img src="<?php echo $freemium_feat_image; ?>" alt="Banner" class="img-responsive img-responsive-freemium" />
<?php } ?>
I need to make a homepage of a wordpress blog show just 1 paragraf of text followed by more, and below a big nice image.
However, excerpt does not take images.
Also, if i put the more page divider, no image appears. and even if it does, the 'more' link should be after the text, not after the image.
How can i get this to work?
UPDATE:
I noticed that in the source code, there is a link to an image, but it is not the right link.
currently my blog is at www.domain.com/wordpress and will be moved to www.domain.com.
currently the image has the code:
<img width="800" height="990" alt="" src="../wp-content/uploads/2011/05/2010_06_01_archive.jpg" title="2010_06_01_archive">
Somehow the build-in linkage is broken
Use wordpress's in-built "featured image" (can be set on post's editing page in wordpress admin).
On the page displaying the excerpts:
<div id="excerpts">
<?php
$args = array( 'numberposts' => 3, 'category'=> '1,3,5' ); }
// set number of excepts to show
// and optionally restrict to certain categories
$posts = get_posts($args);
foreach($posts as $post) : setup_postdata($post);
?>
<div class="single-excerpt">
<h3><?php the_title(); ?></h3>
<?php if ( has_post_thumbnail()) the_post_thumbnail('excerpt-thumb'); ?>
<!-- displays thumbnail if it exists -->
<p><?php the_excerpt();?></p>
</div><!-- single-excerpt -->
<?php endforeach; ?>
</div><!-- excerpts -->
In your theme's functions.php:
if ( function_exists( 'add_image_size' ) ) add_theme_support( 'post-thumbnails' );
if ( function_exists( 'add_image_size' ) ) {
add_image_size( 'excerpt-thumb', 0, 100, false );
// define excerpt-thumb size here
// in the example: 100px wide, height adjusts automatically, no cropping
}
function new_excerpt_length($length) {
return 42;
// define length of excerpt in number of words
}
add_filter('excerpt_length', 'new_excerpt_length');
You could also use the Wordpress plugin Easy Custom Auto Excerpt which allows you to configure the excerpt to include shortcode, images, and all HTML.
Make sure the image is properly sized, and the physical size is minimized as much as possible. (Gif is usually the best format for this.)
http://codex.wordpress.org/Image_Size_and_Quality