Simple Image Grabber WordPress Plugin
I created a plugin for the function I talked about in my post Retrieve and Display Images from a WordPress Post just in case there is anyone out there who isn’t a fan of hacking code. Just install this sucker and use the following function:
<?php images($number, $width, $height, $class, $link); ?> |
Make sure it is within the loop and it will display whichever image you want.
$number = the image you want to pull from your post, ie. the first image from the post (‘1′) or the second image from the post (‘2′) and so on. NOTE: If you use ‘all’, it will display all images from the post.
$width = the width of the displayed image
$height = the height of the displayed image
$class = the class name you would like to assign to the displayed image
$link = whether you would like the displayed image to link to the post or not
So, the following function:
<?php images('2', '150', '200', 'alignleft', false); ?> |
would display the second image from a post (if there is one) with a width of 150px and a height of 200px, the class name alignleft and no link to the post.
The following:
<?php images('all', '', '', 'alignright'); ?> |
would display all images from a post with their original width and height, a class name of alignright and a link to the post.
View Changelog
- Added original width and height to img tag if neither is set
- Fixed issue with "All" variable
If you require help or support, please visit the 
Hi thanks for this, working like a charm. Dont know why people still bother with those post image plugins.
Just one question, how would I go about wrapping the text next to the image. Floating?
Nevermind, I just added this to me css
.alignleft{
float:right;
padding:5px 5px 5px 5px;
margin-left:3px;
background-color:#e8e8e8;
border:1px solid #bed0ec
}
Works great, thank you
Good Post.Thanks:-)
I like this plugin and I tried just it.
Now I wonder why there is shown picture one twice, and picture two isn’t shown at all! What did I wrong?
Hello,
As I’m using Post Thumb Extented plugin, I’m interested in your plugin. Does it resize the image or only force the image to be viewed with preselected dimension ?
It uses CSS to resize the image, it doesn’t actually resize the file.
Nice plugin! It has a bug though: If you use ‘all’ with more than one picture in the post, the plugin outputs the first picture x times (x being the number of pictures in the post). To fix this, you need to change line 29 from “$start=$imgEnd+1;” to “$start = $imgBeg + $imgEnd + 1;”. That’s necessary because $imgEnd is not counted from the beginning of the post content but from $imgBeg.
Thank you so much. =)
Johannes:
Thank you, now I can put the first 1,2,3 images.
Can I also show only Pic 1, 2 and 3 (if I have 4 or more)?
How can I do that?
Nice Plugin, really helpfull… I will use this plugin in my next wordpress theme….
Hey,I can’t get this to work. I just want it to loop through my posts and display the first thumbnail image. Right now my posts only have 1 image. When I put the following code, no image shows up. What am I missing?
<?php the_content(‘Read the rest of this page »’); ?>
<?php
$postslist = get_posts(‘numberposts=8&category_name=’);
foreach ($postslist as $post) :
setup_postdata($post);
?>
<a href=”">View Video
It cut me off,
here is the part that should matter
<?php
$postslist = get_posts(‘numberposts=8&category_name=’);
foreach ($postslist as $post) : setup_postdata($post);?>
<a href=”">View Video
sorry for the volume of comments, it is trying to execute the php parts…
<![CDATA[
<?php
$postslist = get_posts('numberposts=8&category_name=');
foreach ($postslist as $post) : setup_postdata($post);?>
<a href="">View Video
]]
…hopefully it works this time
ok, i realize the issue i had.
how can i show the first image in the post media library instead of in the actual post.
i need to show a video still on one page and have the actual video on another.
I don’t think you can actually display the images from the media gallery unless they are actively added to your post. Let me look into this though, and try to get back to you.
I just wrote a post on Displaying the Post’s Gallery in WordPress that might help you out.
Will this work on the single.php too or only in the loop? I’m looking for a solution to display the image on top of the title and the text on the single page. thanks
It’ll work on single.php but it needs to be within the loop.
thanks for your answer. to be honest I’m quiet new to wordpress… I thought your plugin might be a good way to change the order from tile>image>text to image>title>text. but now the image is show twice of course. is there a way to exclude the original image in the single page? thanks for your help!
Add this piece of code to your functions.php file to strip all the images from your content.
function theme_content($readmore = null) {
$content = get_the_content($readmore);
$content = preg_replace('/]+./', '',$content);
$content = apply_filters('the_content', $content);
$content = str_replace(']]>', ']]>', $content);
echo $content;
}
The use
theme_content();instead ofthe_content()on your single.php page.Thanks, works perfectly!
I found this on an other site and it works great as well:
<?php
$filter = ‘#]*>#iU’;
$neuer_content = preg_replace($filter, ”, get_the_content());
echo $neuer_content;
?>
great work dude thanks alot
I’ve been trying this for the last hour, and still no luck. This is my code:
<div id="post-">
The tags are within the loop, and I tried deactivating any other plugins that might conflict, but still no luck. It’s just not showing anything.
I definitely have three images attached to the post.
Do the images actually have to be in the post for this to work, or just attached in the media gallery?
This will only display images added to the post directly, not just to the post’s gallery. I am going to update the next version to have this option.
i want this plugin but for the links
any one have idea?
Hey, great plugin works great on my site……! Thank you for that!
But now I wonder if it is possible to add links to the images,
would be nice to make them clickable and to open them in a new window (original sized).
similar to the wp gallery function….!
Perhaps you have an idea.
Wow,
this is a very useful plugin!
I’m wondering if there is a way to preserve the proportion of width & height as images get distorted if you don’t put in the exact proportions of the original – I think it already works on your Magazine Basic Theme with the excerpts of articles that contain images…
Pete
ok,
I got it: you can just leave width & height options blank and style via css… that works best if you’re willing to cater a special version to IE…
hello…i am just new to this very wonderful theme. I don’t know how to figure out the photos in the homepage.but let me check on this..i’ll come back again if i can’t sort this out
Just add your pics to your posts and they will appear on the main page. But you need to add them to the post and not just to the gallery.
anybody could please help me where in my theme shoud I paste the following. Is it in index.php?
Hey Dex,
Paste the code in the index.php file. That should do it.
Hello C. Bavota,
I am not sure what i am doing in my template. If you check my site at http://www.pinoybro.com it seems the image are making the post distorted. I already downloaded the plugin simple image grabber and the next thing i need to know is where in the php should i put the following code <?php images(‘2′, ‘150′, ‘200′, ‘alignleft’, false); ?
to adjust the images. Is it at the index.php or in the single.php?
Thank you very much,
Dexter
Thanks for the great plugin. I tried many plugins before, but this is the best!
Only one problem: if the image width and height defined in the html code, then the plugin cannot resize the image. It doesn’t happen often, but it will be great if this plugin can override the code. This happen because I use blogging client to publish my posts.
It might be because you use a blogging client. I don’t have much experience with them so I really couldn’t tell you for sure. But I feel like blaming something else so I will say, yes, it is because of your blogging client.
Hi, thanks for the script… it shows first two images only 3rd one is not showing… can you pls check it.
Thanks
Raja.D
I’ll take a look and try to figure out what is up.
Dear Anyone,
I am very new to Word Press (like one week or so) and apologize in advance for my probably very stupid question. Specifically, my template front page shows 4 different categories, and within each category, will be a 3 line text extract of a post, accompanied by a thumbnail sized icon image. The icon image is used for every single post in every category. Instead I want to show a thumbnail of the image I put into the post.
Two questions please. Is that what this plug in does? Secondly, the instructions say somewhere to copy a line of code ‘into the loop’. I am embarrassed to say, that I do not know what this means. Could someone please help?
Many thanks!
Frank
Hey Frank,
If you take a look at your index.php file, you will see a part where you have a
while (have_posts()) : the_post();. This is your loop. It might say “if” instead of “while” but it is still your loop. All that means is that the loop goes through and finds each post and makes it appear. If you place the code from this plugin within the loop, it will call the image from the post and display it. Put it before the the_content() function or the the_excerpt() function.hello.
i’m having the same problem as Pete above. My images are getting distored really bad. how do i make sure that doesnt happen?
also, is there any way to have the plugin place a default image if there is no image within the post?
Let me see if I can add these options in a newer version.
Mr. Bavota…
Thank you very much for answering my question! I will try this right away!
yours gratefully!
cheers!
Frank
Dear Mr. Bavota,
Thank you for your help-your instructions worked perfectly!
I do have an alternative website design which has both an index page and home page. It seems the home page is actually governing the layout, and it offers a default thumbnail. I can’t figure out where you code should go. I am pasting a clip of the code here if you wouldn’t mind pointing out where I should place your code?
Title
have_posts()) : $recent->the_post();?>
ID, “thumbnail”, true) ): ?>
<a href=”" rel=”bookmark”><img style=”float:left;margin:0px 10px 0px 0px;” src=”ID, “thumbnail”, true); ?>” alt=”" />
<a href=”" rel=”bookmark”><img style=”float:left;margin:0px 10px 0px 0px;” src=”/images/thumbnail.png” alt=”" />
<a href=”" rel=”bookmark”>
Read More Posts From This Category
Hi everyone,
I am so sorry to ask, but I am not a programmer at all. My theme has a generic thumbnail in the code, and I am having a real hard time with this trying to find where to put the code, and trying to figure out how to, or even if, I should remove the thumbnail code. Is there someone who could give me one or two pointers please?
cheers!
Frank
Is it possible to crop the image contextually instead of resizing it out of proportions??
Hmmm never mind
I forced it with CSS
Giving the class a “display:inline-block” and then specifying the heigth + width.
Thanks for this great plugin
Great idea – would be brilliant use to me if…
It chose images from the Media manager Gallery, not the post
You could specify it to use the thumbnail Wordpress generates, rather than a scaled version of the final image.
Otherwise – great.
there is a great script out there called timthumb that resizes the image using PHP’s GD library. It works great.
Hello c.bavota, this is a fantastic plugin. One question though, is there any way to get the thumbnail to be of a particular size ie 150×105 but retain aspect preportion so the image is not squashed?
Also you look like you know a thing or 2 about wordpress. Can u plz tell me what plugin http://www.lifehack.org/ is using to display there “latest topics articles”? thanks again.
I usually specify either the height or the width, never both for client sites. To keep the squashed look from ever happening.
nice plugin. And would be great if you make a plugin limit posts automatically with a image on font page.
A problem i meet. If a image from another host, and there is a link under it, the image will not display in right size.
Hello…
When I add a new article to my blog I add a main image to every post, of course the image also will display when viewing a single post.
What i want is to show the attached image only on the main page post and not on a single post.
Please tell me the way.
Could u please tell me, shall we use this function to retrieve images and display it for recent post (Recent Post with thumbnail).. if so can u explain me how?
Also at the same time If i put the image with align centre tag in the post, in the home page it doesn’t display the image in the left. it always display the image as it is aligned in post. you can check that in my blog too.. Please reply me my friend..
Dear M. Bavota,
First, thank you very much for this good plugin. It works well for me.(wordpress 2.7)
Otherwise, I think it could be great to have a link to the image and reach the article when we click on.
Is it possible to do this?
Thanks a lot for your help,
Kind regards,
Stephane
How can I grab the ALT text of the image?
This is great.. I always used custom fields in my themes which are great also but now suck!!! coz this rocks!!! thanks alot.
Thanks, excellent article.
Hey there… This plugin is AWESOME, but I tried use it inside a WP_Query loop and I have no success.
Could you help me please.
http://gist.github.com/143079
Thanks
Great work, for the non plugin version of this, is there a way to display a generic image if there is no first image, Im using it for a list you see.
Thanks in advance
You would have to throw an if statement in there looking for a value in the variable. If there is a value it would display the image, if not it would display a generic image.
I love the plugin… very clean and simple.
But I am looking to make the link to the image file. Is that possible? This is an image drive blog and I want to posts to show the first image. But when you click on it, it will open the file in shadowbox. I am hoping that the other images in the post will be in the shadowbox gallery with it, but I might be hoping for something that can’t happen.
Is there a way to at least link to the targeted image file? I know you are dynamically targeting the src, just figured I could write the href the same way.
Thanks,
Jo
Did you ever find a solution for this? I’d like to do the same thing?
d
Hello,
Is there a way to embed the correct proportions(height and width) of the first image, as opposed to custom. I need this for my javascript to run properly as soon as DOM is ready, but at the moment it only works on second reload, when all the images are already in the cache.
It would be even nicer if I could have such a fix inside the non-plugin version of this script.
Many thanks.
Anybody at all?
Great plugin, but I have the same problem as Edward up here. I need the height and width of the image picked to be specified in the html code. Any help?
Version 1.0.2 fixes that issue. It should be available on WordPress shortly.
It worked gr8 for me… thanks alot got your gr8 plugin…I used code for center alignment..
thanks once again
Hi there!
I’ve installed your plugin and it all works as a dream!
The only problem I experience is that the remaining images in the post is still diplayed together with the duplicated first image. So the 3 images in my post becomes 4 (first imagex2)
If anyone could help me to solve this problem, it would be hugely appreciated!
Best,
Hampus
I forgot to mention that I’m talking about the homepage here. Basically I want to hide all images in the posts and just use this script to show the first one for each post. Is this possible? Seems as it is, I just need help to figure out how to hide the remaining images.
I read somewhere that the you can set to only show the post excerpt. Would this work?
Thank you in advance!
If you use
the_excerpt()instead ofthe_content()all the images will be stripped from your content and you can then use the image grabber to display the image you want.When I’ve changed the content to the excerpt the links in the post doesn’t work, any idea why?
Thanks!
The image grabber and all works great but not the links. changing back to content shows the links but doubles the images…
code looks like this:
<?php the_excerpt('’.__(‘Continued reading >’, ’simplr’).”); ?>
might be something wrong with that… dunno
That works perfectly!!! I’m so thankful for your help, very much appreciated!
One last thing would be how to crop the height of the homepage images to 300px. with the image centred in the frame.
Any suggestions? Read about a couple of ideas here but just want to check with you what you think might be the best solution for my case.
Thanks heaps!