i am calling in a function to show the post featured image and post it a background image. The dimensions are set within the div yet my client updates originals that are huge and wondering if theres a way to set the size of the image to scale them down:
<?php
$catquery = new WP_Query( 'cat=23&posts_per_page=1' );
while($catquery->have_posts()) : $catquery->the_post();
$src = wp_get_attachment_image_src( get_post_thumbnail_id($post->ID), 'featured' );?>
<div onclick="window.location='<?php the_permalink(); ?>'" title="<?php the_title(); ?>">
<div class="front-page-featured-post" style="background: url(<?php echo $src[0]; ?> ); background-size: cover; background-repeat:no-repeat;">
in my functions:
add_theme_support( 'post-thumbnails' );
add_image_size('featured', 370, 240, true);
Have you tried this?
add_theme_support( 'post-thumbnails' );
set_post_thumbnail_size( 370, 340 );
You need to regenerate the images after you implement the new thumbnail size, just use this plugin: https://wordpress.org/plugins/regenerate-thumbnails/
to regenerate all the images and it will create new images with dimensions 370x240
Related
Trying to include a specific page on the frontpage of a WordPress Theme.
The overal HTML structure should be similar to this:
<div>
<h1>Om</h1>
<p>Content comes here</p>
</div>
<div style="background-image: url(...)">
</div>
At the moment it echos the content of the page successfully.
Here is how that part works with PHP:
<div class="omtekst col-md-6 half-content-wrapper">
<h1 class="semibold">Om</h1>
<?php
$my_id = 7;
$post_id_7 = get_post($my_id);
$content = $post_id_7->post_content;
$content = apply_filters('the_content', $content);
$content = str_replace(']]>', ']]>', $content);
echo $content;
?>
</div>
As mentioned earlier I want to include the thumbnail below this. This is where I am having problems.
However, I have started on the PHP to show how I am thinking. The thumbnail should be $image or similar.
<div class="ombilde col-md-6" style="background-image: url('<?php echo $image; ?>')">
Do you have a working solution for this?
Edit
My custom thumb which is not used with this image:
add_action( 'after_setup_theme', 'mytheme_custom_thumbnail_size' );
function mytheme_custom_thumbnail_size(){
add_image_size( 'frontpage_thumb', 500 ); // Unlimited height
}
Enabled post thumbnails:
if ( function_exists( 'add_theme_support' ) ) {
add_theme_support( 'post-thumbnails' );
add_theme_support( 'nav-menus' );
add_theme_support( 'widgets' );
}
to get the url of image you can use
$image = wp_get_attachment_image_src( get_post_thumbnail_id([ID_HERE]), [IMAGE SIZE HERE] );
then you can use
<div class="ombilde col-md-6" style="background-image: url('<?php echo $image[0]; ?>')">
to get image size string look at your theme for "add_image_size" function
and as pgk said post-thumbnails have to be enabled inside functions but i guess you already did this
edit:
[ID_HERE] replace with post id
[IMAGE SIZE HERE] you can test this with "full"
Use wp_get_attachment_url($id) for retrieving the URL of the desired post.
In your example:
$my_id = 7;
$post_id_7 = get_post($my_id);
$my_thumb = wp_get_attachment_url($my_id);
<div style="background-image: url('<?php echo $my_thumb; ?>')" class="omtekst col-md-6 half-content-wrapper">
<h1 class="semibold">Om</h1>
</div>
If you want to get post thumbnail, you can make this like that:
if ( has_post_thumbnail( $post_id_7->ID ) ) {
$image = get_the_post_thumbnail( $post_id_7->ID, $size, $args );
}
This returns image tag. You can find more info here Codex - get_the_post_thumbnail
Your theme must have ‘post-thumbnail’ support enabled.
This is the easiast way to attach image to your post.
And if you are in theLoop, you can use the_post_thumbnail() function, it directly prints thumbnail image:
<?php the_post_thumbnail( $size, $attr ); ?>
Codex - the_post_thumbnail()
If you want to print image as background, you must pit 'large' as $size.
My theme generate my img portfolio with this code :
<img width="222" height="440" src="#" class="attachment-portfolio" alt="#">
I found this code :
<div class="carousel-inner">
<?php foreach($attachments as $attachment) {
$alt = get_post_meta($attachment->ID, '_wp_attachment_image_alt', true);
$image_big = wp_get_attachment_image( $attachment->ID, 'portfolio' ); ?>
<div class="item">
<?php echo $image_big ?>
</div>
<?php } ?>
I'm not good in PHP but i understand that the image size is generate from "$image_big" ?
I found also this in my function.php
add_image_size('big',9999,400);
I try to change the width and height in the add_image_size but nothing happend on the website ! It's still width="222" height="440"
I would like the image to be 100% or around 800px width (if it's impossible to get % unit). What to do ?
I have some code that uses a posts featured image as the background of a DIV...
<?php if (has_post_thumbnail( $post->ID ) ):
$image = wp_get_attachment_image_src( get_post_thumbnail_id( $post->ID ), 'single-post-thumbnail' );
endif; ?>
<div class="news-image" style="background-image: url(<?php echo $image[0]; ?>); background-repeat: no-repeat; background-color: #000; background-position: center center; background-size: cover;">
Pretty simple, but I need to set a default image on this background for any posts that do NOT have a featured image set.
Is that possible by modifying my above code?
For example...
If post has featured image - show it.
If post does not have featured image - show default.jpg.
Sure you can do that, I did some rought snippet, hope you can get the info from my comments :)
<?php
// first you have to define and save your default image somewhere,, save it in options table for ex.. like this:
add_option( 'my_default_pic', 'http://www.website.com/image/jpg', '', 'yes' );
// then on page or template use like this
if (has_post_thumbnail( $post->ID ) ){
$image = wp_get_attachment_image_src( get_post_thumbnail_id( $post->ID ), 'single-post-thumbnail' )[0];
} else {
$image = get_option( 'my_default_pic' );
}
?>
<div class="news-image" style="#000 no-repeat center center background: url(<?php echo $image; ?>);">
body = lorem ipsum
</div>
that's it :)
hth,
edit: inserted example image path
This is the code to get the image for post thumbnail, but the image is not found on the page.
Please suggest some ideas.
<?php
add_theme_support( 'post-thumbnails' );
the_post_thumbnail();
set_post_thumbnail_size( 50, 50);
echo get_post(get_post_thumbnail_id())->post_excerpt; ?>
Try this one to get image path and then after pass that path to image scr.
<?php
$image_id = get_post_thumbnail_id($post->ID);
$image_url = wp_get_attachment_image_src($image_id,'large', true); ?>
<a href="<?php the_permalink(); ?>"><img src="<?php echo $image_url[0]; ?>" />
</a>
<?php
}
?>
Try to used
get_the_post_thumbnail( $post_id, 'thumbnail' );
If you want to get thumbnail with custom width and height then used below code
get_the_post_thumbnail( $post_id, array( 100, 100) );
In array first element for width and second for height.
try to pass post id in function
$post_id = get_the_ID();
get_the_post_thumbnail( $post_id, 'thumbnail' );
Try this bro
First Method:
<?php
$imgId = get_post_thumbnail_id($post->ID);
$imgUrl = wp_get_attachment_image_src($imgId,'your image size', true);
?>
<img src="<?php echo $imgUrl[0]; ?>" />
Second Method:
$post_id = get_the_ID();
get_the_post_thumbnail( $post_id, 'your image size' );
Hope you find your solution
I'm using timthumb.php and need to be able to get the url of the featured image of a post, when I use functions like the_post_thumbnail it does more than just the url.
Here is the code so, the capital letters is where I need to insert the exact url, any help would be great, thanks.
<a href="<?php the_permalink(); ?>" title="<?php the_title(); ?>">
<img src="<?php bloginfo('template_url'); ?>/wp-content/themes/limerickfc/timthumb.php?src=<?php URL OF FEATURED IMAGE ?>&h=760&width=474" alt="" title="<?php the_title(); ?>" />
</a>
If your "thumbnail" images are large enough to do what you need:
<?php wp_get_attachment_url(get_post_thumbnail_id($post->ID)); ?>
Otherwise you'll need to go for something like:
<?php $src = wp_get_attachment_image_src(get_post_thumbnail_id($post->ID), array(300, 300), false, ''); echo $src[0]; ?>
EDIT: The array(300, 300) bit is the image size you'd like to fetch. WP will substitute any image it has that is at least as large as what you asked for. You can also use 'thumbnail', 'medium', 'large' or 'full' to select one of the pre-configured sizes, as well as any name defined by add_image_size() in your template or plugins.
First get the id of the featured thumbnail image:
$thumb_id = get_post_meta( $post_id, '_thumbnail_id', true );
One way to do it:
$thumb = get_post($thumb_id);
$thumb_url = $thumb->guid;
Another way would be:
$thumb_url = wp_get_attachment_url( $thumb_id );
Be careful about what is stored in the GUID and what is returned by get_attachment_url. The attachment url (depending on configuration) can be the page where the attachment is visitable (not the raw file URL but the page where attachment.php is used).