I am trying to resize an image coming from the Advanced Custom Fields repeater field with no success.
I have set up a basic non-repeater image field in the exact same way elsewhere on the page and it works perfectly.
So I have the image size set up in the functions.php:
add_image_size( 'bio-size', 400, 260, true );
Then in the template I have:
<?php while( have_rows('bio') ): the_row();
$bioImgObj = get_sub_field('bio_image');
$bioImgSize = 'bio-size';
$bioImgUrl = $bioImgObj['sizes'][$bioImgSize];
?>
<img width="400" height="260" src="<?php echo $bioImgUrl; ?>"/>
This gives me the image, but does not resize it in any way.
When using ACF, or general WordPress file uploads, modifying image sizes or other configs for files after upload wont affect already uploaded files because the files are processed on upload.
Related
I have cca 4500 posts in my Wordpress backend. Some posts doesn't have featured image. I was wondering is there any solution to bulk add featured image (placeholder if there is no "real" image)? I'm talking about backend, I now that I can do on front end but need way to add featured image in the backend if featured image is empty.
Can anybody help me with this?
You can do this using 3 ways.
Using plugin
https://wordpress.org/plugins/default-featured-image/
Or you can show dummy image to your code (when there is no featured image found)
check below code for front-end
<?php if ( has_post_thumbnail() ) {
the_post_thumbnail();
} else { ?>
<img src="<?php bloginfo('template_directory'); ?>/images/default-image.jpg" alt="<?php the_title(); ?>" />
<?php } ?>
AJAX in Admin (In custom form) - You can also achieve same using creating one option page in backend where you can give form with one image field, and on save you can update featured image if blank found using ajax.
I have article with title "POST-TITLE" and I create image title same with post title, "POST-TITLE.jpg".
All image I put in my hosting, like this:
http://www.example.com/img/CATEGORY/POST-TITLE.jpg
In mytheme post-single.php, I have this code:
<img src="http://www.example.com/img/<?php foreach((get_the_category()) as $category) { echo $category->cat_name . ''; } ?>/<?php the_title(); ?>.jpg" onError="this.src='http://cerpenkoran.net/img/dot.jpg';" title="Thumb for <?php the_title(); ?>" >
My answer:
What code I add the image url code above, so it as Featured Image?
OR how to combine this fix URL:
http://www.example.com/img/<?php foreach((get_the_category()) as $category) { echo $category->cat_name . ''; } ?>/<?php the_title(); ?>.jpg
with this Featuread Image code:
<?php if (has_post_thumbnail( $post->ID )) : ?>
<?php $image = wp_get_attachment_image_src( get_post_thumbnail_id( $post->ID ), 'single-post-thumbnail' ); ?>
<img src="<?php echo $image[0]; ?>" />
<?php endif; ?>
Are you asking how to add a Featured Image to your WordPress website? If so, then follow the below instructions:
Firstly, you are going to need to add the relevant Theme Support inside your functions.php file. To achieve this, go into your functions.php file and enter the following code:
<?php
function my_theme_name_support(){
add_theme_support('post-thumbnails');
}
add_action('after_setup_theme', 'my_theme_name_support');
?>
Make sure that the above code is placed after the opening <?php tag (at the top of the functions.php file) but before the closing ?> tag (at the bottom of the functions.php file.)
You will see that there are two my_theme_name_support entries. You can change the wording of these to something more appropriate. Just make sure they match.
Now, head into your WordPress Dashboard and go to create a New Page or New Post. You should now be able to see an entry, entitled 'Featured Image'. As you scroll the page, you should see it appear on the right hand side. Simply select the link and add the required image.
This, alone, does not output the Featured Image. To output your Featured Image, you now need to enter the following code into the relevant file(s) on your server:
<?php the_post_thumbnail('thumbnail'); ?>
By following the above steps, you should now be able to dynamically call your Featured Images from your WordPress Dashboard and output them to whichever pages you want.
For more information, on Featured Images, check out this WordPress Codex Article >>>
Answer Extension
If you want the same image to appear for every Blog Post, so that you do not have to manually add a Featured Image to every Blog Post, you could:
Upload the image to WordPress, via their Media Uploader.
Then head to the single.php Blog Post Template File and enter the following code:
<img src="POST-TITLE.jpg" alt="post-title" height="42" width="42">
Be sure to make the following modifications, to the above code:
src: This is the link to the actual image. Therefore, change 'POST-TITLE.jpg' to the name of your desired image. Be sure to include the correct image format (.jpg, .png etc).
alt: This is a brief description of the image. No coding required here. Plain text will do.
height and width: Insert the correct dimensions. The dimensions are in pixels.
Please Note ...
single.php is the default Blog Post Template File. There is a chance that there are additional Blog Post Template files too. If this is the case, you will need to add the code to these other Template Files too.
You may find this WordPress Article, helpful, when working with Template Files.
I wanna resize post thumbnail in Wordpress. So I use that function: get_the_post_thumbnail($onepost->ID, array(234, 156)); But I recive images with size 300x189. Why is this happens?
You best bet it to add your thumbnail size by using at add_image_size function, then call that new thumnail in your function:
In your functions.php:
add_image_size( 'custom-thumb', 234, 156 );
In your template file or wherever you're calling the thumbnail:
the_post_thumbnail( 'custom-thumb' );
Note that you will probably have to regenate your thumbnails after you do this as thumbnails are created when you upload the image, thus all images you uploaded won't have this custom thumbnail size. Here is a good plugin for that:
https://wordpress.org/plugins/regenerate-thumbnails/
I am trying to add code for featured image on different resolution. like thumbnail, medium, large and full. But I wanna look like this type of resolution.
e.g
125x125
150x150.
250x250
I am trying this code. but it's not work.
<?php
$thumb_id = get_post_thumbnail_id();
$thumb_url = wp_get_attachment_image_src($thumb_id,array(300,300), true);?>
300x300
</br>
It's show full size of image.
You need to add different image sizes in your functions.php file. WordPress will then create these resized images when a new image is created.
Usage is as such:
<?php add_image_size( $name, $width, $height, $crop ); ?>
Lots more information available on the WordPress Codex.
If you wish to create these image sizes retrospectively (to images you've already added) then you'll need to regenerate your thumbnails. You can do this using the regenerate thumbnails plugin.
You can then reference a image size in your code. A full example:
Inside functions.php:
add_image_size( 'example_size', 200, 200, true );
Inside your theme:
$thumb_url = wp_get_attachment_image_src( $thumb_id, 'example_size', true );
i am trying to create my first wordpress theme and i came now to a problem i can't seem to solve.
Due to the design of the theme, i would like to have featured images on every post, but they would need to be all the same size.
On my functions.php i have enabled the feature images, set a size and even tried to add custom size, but nothing is working as i wanted.
My code looks like this:
function.php:
add_theme_support( 'post-thumbnails' );
set_post_thumbnail_size( 200,200, true);
add_image_size( 'feat', 200, 200, true );
then on my content.php:
<?php the_post_thumbnail('feat'); ?>
The images resize, but they don't crop. It makes the bigger side of the image equal to 200, but still keeps the original aspect ration.
Any ideas of what i'm doing wrong?
Maybe it happens because you had added add_image_size before you uploaded your images.
Try to delete and upload images again or download Regenerate Thumbnails plugin and regenerate all your images in media library.