I've seen all kind of solutions to this issue but none of them resolved my simple problem.
As you can see on the website I'm working on the thumbnails to the right are not equal.
I need to set them to be 214x121px as the thumbnails.
I've tried using plugins such as Regenerate thumbnails (after adding new image size to functions.php) and Custom image sizes, with no success.
I think it's obvious but <?php echo wp_get_attachment_image( $attachment->ID, array(214, 121), false );?> since as I understood Wordpress will bring the closest, considering proportions, image to the given size.
My Wordpress version is 3.6.
Any ideas/assistance will be appreciated.
I generally use wp_get_attachment_image_src for doing this, and here's how I do it:
If you've added your custom image size like this:
add_image_size( 'blog_featured_image', 214, 121, false); //Featured Image for Blog
Then in your template, you could call the custom image size like this:
<?php $imageID = get_field('featured_resource_image');
$imageURL = wp_get_attachment_image_src( $imageID, 'blog_featured_image' ); ?>
<img src="<?php echo $imageURL[0]; ?>" />
'featured_resource_image' is a custom field I create using Advanced Custom Fields plugin, but the get_field for it just returns the ID of the image selected. So I assign the image's ID to $imageID. I then get the image's object using wp_get_attachment_image_src, where I used the custom image size of 'blog_featured_image'. This returns an array with all the image's data. The first record in the array is the URL of the image, so I echo out $imageURL[0] to return the URL.
There's probably other ways to do it, possibly much better ways, but this way has always worked for me.
EDIT:
From looking at the function you are referencing, this should work:
Define your custom image size as outlined above. Then use this:
<?php wp_get_attachment_image( $attachment_id, 'blog_featured_image' ); ?>
Just set $attachment_id to equal your image's ID however you are currently grabbing the ID.
Related
I want to make my websites first page so you have posts listed with only titles and meta.
When you found something interesting you'd put the cursor on the title (linking to the post) and that would display a featured image beside (either on a specific spot on the site or offset just enough to not cover any of the text or replacing the cursor).
Here is an example in action:
example of hover effect
I would put this code in a PHP snippet that I would add to a page with a shortcode. Right now the best I have is this:
<?php
echo '<div class="feauturedImg">';
$args = array('page_id => );
$featured_image = get_posts($args);
foreach($featured_image as $image) : setup_postdata($image);
echo the_post_thumbnail();
endforeach;
wp_reset_postdata();
echo '</div>';
?>
It should make a div and display the featured image inside it. I need to get the featured image of whichever post is being hovered dynamically. This is how I'd get the link of a hovered post in JS but I don't know how or if it's even possible to implement it.
I would need to pass it in to the PHP and get the post ID from it:
<script>
$('.hoverLink').hover(
function(){
var myHref = $(this).attr('href');
},
function(){
$('.hoverDetail').remove();
});
</script>)
Basically I need a way to get the hovered link from a JS or a way to save a hovered link into a PHP variable to than put it in url_to_postid() function and get the ID of the post to put into this section:
$args = array('page_id => );
(first PHP code) to display the right image.
Any ideas?
I am using a simple shortcode to add line space or separator. I added this shortcode in my post meta field where we can add custom description but this shortcode is not extract on frontend
This is the text in my editor of that post meta
Have you been looking for a better, easier way to enjoy your favorite [linespace gap="30"] Introducing the beautifully simple, versatile and discreet don’t let its size fool you.
where [linespace gap="30"] is that shortcode
This is the output on frontend
Have you been looking for a better, easier way to enjoy your favorite [linespace gap="30"] Introducing the beautifully simple, versatile and discreet don’t let its size fool you.
this is my code for the shortcode function
function linespace_gap_shortcode($atts,$content = null){
$arg_s = shortcode_atts(
array(
'gap'=>'30',
), $atts, 'linespace' );
//getting the values from shortcode
$gap = $arg_s['gap'];
ob_start();
?>
<div class="clearfix separator-<?php echo $gap; ?>"></div>
<?php
return ob_get_clean();
}
add_shortcode('linespace','linespace_gap_shortcode');
In my mind you need to add a do_shortcode() inside your template around your meta value.
Example :
$my_meta = do_shortcode(get_post_meta( 0, 'meta_key', true ));
NB : think about esc_html() inside your shortcode function or force $gap to be an integer for better security .
i m using wp_get_attachment_image_src()in my template file of wordpress. and i want image from this url.
http://localhost/....../wp-content/uploads/2014/02/AceBailBondsKS.png
then what to write in parameter of this function i have used following.:-
syntax:- <?php wp_get_attachment_image_src( $attachment_id, $size, $icon ); ?>
then in place of $attachment_id what id should i pass 2014 or 2?
i have used like this
wp_get_attachment_image_src(2014)
Thanks very much for any help anyone can give.
Go to your WordPress admin media library and locate the image file. Take note of the Media ID.
When you click on the image in the media library look at the URL. It should say &post=123 - The value here (123) is the media ID.
This is the ID you enter.
wp_get_attachment_image_src( 123 );
I have implemented my blog using wordpress and in my posts iam directly posts the images but while if I want to display them they are not retrieving.
I have used the_content() then it was displaying the image with the remaining content in that post can anyone suggest me How to retrieve those images..??Thanx in advance
You are inserting images in the content area,so obviously it will be appearing as content on front end.
You need to set the images as Featured image or add them by using Add media option at the top of text editor.
For retrieving the image from Featured image:(Single image)
wp_get_attachment_image_src( get_post_thumbnail_id($post->ID), 'full')
For retrieving the image from Add media:(Multiple images)
$img_small = get_children('order=ASC&orderby=menu_order&post_type=attachment&post_parent=' . $post->ID);
foreach ($img_small as $imagesmall) {
$attachmentID = $imagesmall->ID;
$attachmentURL = wp_get_attachment_url($attachmentID);
<img src="<?php bloginfo('template_url'); ?>/phpThumb/phpThumb.php?src=<?php echo $attachmentURL; ?>&w=365&h=280&iar=1">alt="Image" />
}
Does anybody know if there is a way of having an image upload field on a post so I can upload a specific image for that post.
Thanks
It's not currently possible (have been looking after it for months with no luck).
Are you trying to display that image as a thumbnail (while keeping it easy for the authors)?
The nicest approach is auto-detecting the first image in the post. Users don't need to deal with custom fields nor URLs:
// Get URL of first image in a post
function catch_that_image() {
global $post, $posts;
$first_img = '';
ob_start();
ob_end_clean();
$output = preg_match_all('/<img.+src=[\'"]([^\'"]+)[\'"].*>/i', $post->post_content, $matches);
$first_img = $matches [1] [0];
// no image found display default image instead
if(empty($first_img)){
$first_img = "/images/default.jpg";
}
return $first_img;
}
// With TimThumb
<img src="/thumb.php?src=<?php echo catch_that_image() ?>&w=200&zc=1&q=200" alt="<?php the_title(); ?>"/>
Found it here: http://snipplr.com/view/23968/wordpress--get-first-image-of-post-without-custom-fields/
If that's not what you were looking for please give more details and we'll try to find a solution.
:)
The solution I used was the Flutter module, which let me create custom content types.
It's not an ideal solution but I'm currently just using a custom field called "thumbnail" and putting the location of an uploaded image in there. Then, when I display the post details somewhere I use the value from the custom field as the <img src=""> value.
To upload the image in the first place I just use the normal image upload tool in the editor and copy the uploaded name into the custom field as I'm writing the post.
Not very elegant but it works.