Resize image in cirlce
-
Just creating a new thread for this, even though it’s the same problem as this thread. I am wondering how do I resize the image in the bubble/circle to 360×360? With the 2.02 update there is some auto-resizing that doesn’t look good, so I was wondering if anyone knows how to make the image appear as /wp-content/uploads/2014/01/20140114-12345-360×360.jpg vs /wp-content/uploads/2014/01/20140114-12345.jpg? Hope that makes sense. Thanks!
-
What edit did you need to make to the functions.php file?
Create a new folder in your Child Theme and call it “inc”, then in that folder copy over the ‘template-tags.php’ file from the Spun Theme
Nah, I understand that…but what I don’t know how to do is to modify the actual function.
So then IN template-tags.php (inc/template-tags.php)
I want to REPLACEfunction spun_get_image( $id, $size = 'home-post' ) {
WITH
function spun_get_image( $id, $size = 'post-thumbnail' ) {
In functions.php I want to REPLACE
add_image_size( 'home-post', 360, 360, true );
WITHadd_image_size( 'post-thumbnail', 360, 360, true );
and also change anywhere functions.php lists.attachment-home-post
REPLACE with.attachment-post-thumbnail
That should fix it I think
So then IN template-tags.php (inc/template-tags.php)
I want to REPLACE function spun_get_image( $id, $size = ‘home-post’ ) { WITH
function spun_get_image( $id, $size = ‘post-thumbnail’ ) {Yes, if you’ve copied the whole file over then the same code should be there and you can just change that line.
In functions.php I want to REPLACE add_image_size( ‘home-post’, 360, 360, true ); WITH add_image_size( ‘post-thumbnail’, 360, 360, true );
I don’t think you want to do that. That line is going to be made redundant. The reason why you may want to edit that is to remove it completely.
I don’t think you want to do that. That line is going to be made redundant. The reason why you may want to edit that is to remove it completely.
I think I know how to remove it completely, but the reason I would want to REPLACE add_image_size( ‘home-post’, 360, 360, true ); WITH add_image_size( ‘post-thumbnail’, 360, 360, true ); Si because if I upload new pictures I want to also call them ‘post-thumbnail’, right?
Yes, if you’ve copied the whole file over then the same code should be there and you can just change that line.
Also, thanks, I didn’t know I could copy the whole template-tags.php file
Si because if I upload new pictures I want to also call them ‘post-thumbnail’, right?
I think there’s a slight misunderstanding of what the repercussions of replacing this (in template-tags.php):
function spun_get_image( $id, $size = 'home-post' ) {
with this:
function spun_get_image( $id, $size = 'post-thumbnail' ) {
will do;
The ‘
set_post_thumbnail_size
‘ function uses the name ‘post-thumbnail’ by default. The old Spun theme used this function and therefore already had thumbnails saved in to the ‘post-thumbnail’ name.This means we can just tell Spun to load the thumbnails under that name (‘post-thumbnail’).
So, to clarify, what this does:
function spun_get_image( $id, $size = 'post-thumbnail' ) {
Is set the
$size
variable to be a string of ‘post-thumbnail’. Then further on that$size
variable is passed into the ‘wp_get_attachment_image
‘ function and then the image thumbnail attached to that name is retrieved.$thumb = wp_get_attachment_image( $attachment, $size, false, array( 'title' => esc_attr( strip_tags( get_the_title() ) ) ) );
This line in the functions.php file becomes irrelevant:
add_image_size( 'home-post', 360, 360, true );
In fact what would be even better than modifying the ‘template-tags.php’ file would be if you just changed the ‘content-home.php’ file that calls this
spun_get_image
function.
There all you’d need to do is change this:$spun_image = spun_get_image( get_the_ID() );
To this:
$spun_image = spun_get_image( get_the_ID(), 'post-thumbnail' );
I think I understand and follow, but then if
This line in the functions.php file becomes irrelevant:
add_image_size( 'home-post', 360, 360, true )
;Don’t we need to either add back
set_post_thumbnail_size
?Also in the functions.php file, wouldn’t I need to replace anywhere it says
.attachment-home-post
with
.attachment-post-thumbnail
?
Maybe I don’t completely follow – I think I get where you are going with the redundancy of
add_image_size( 'home-post', 360, 360, true )
. but that would need to be replaced with something, wouldn’t it?
Yes, I think this would work…but I would still need to modify the functions.php file as well, just not the template-tags.php
In fact what would be even better than modifying the ‘template-tags.php’ file would be if you just changed the ‘content-home.php’ file that calls this spun_get_image function.
There all you’d need to do is change this:$spun_image = spun_get_image( get_the_ID() );
To this:
$spun_image = spun_get_image( get_the_ID(), ‘post-thumbnail’ );
Don’t we need to either add back set_post_thumbnail_size?
Actually yes, you do need to set that back to
set_post_thumbnail_size
so that when new images are uploaded to the library they’re set in the same way. Good point. So yes you do need to modify functions.php, but when you say to modify ‘.attachment-home-post
‘, no you don’t need to edit the functions.php file for that. You can just add the correct CSS to your Child Theme style.css file.Actually yes, you do need to set that back to
set_post_thumbnail_size
so that when new images are uploaded to the library they’re set in the same way. Good point.Let me try something out a minute
you do need to modify functions.php, but when you say to modify ‘.attachment-home-post’, no you don’t need to edit the functions.php file for that. You can just add the correct CSS to your Child Theme style.css file.
Well, the reason I wanted to modify functions.php there is because there is a function being called for the gray overlay (before you hover over an image)
function spun_options_styles()
So, it looks like you can just add this to your Child Theme functions.php file:
add_image_size( 'post-thumbnail', 360, 360, true );
And that will create a thumbnail for each uploaded image, by 360x360px, to the name of ‘post-thumbnail’ .
I just checked my upload folder and it looks like that ‘
add_image_size
‘ function isn’t generating an additional 360×360 thumbnail. So all should be good.Well, the reason I wanted to modify functions.php there is because there is a function being called for the gray overlay (before you hover over an image) function spun_options_styles()
Oh, yes, that needs to be changed in the functions.php file too because that CSS is only called when certain options (in the dashboard?) are checked. If we were to change that CSS in the Child Theme style.css file we’d have the problem of those styles always being there.
So, it looks like you can just add this to your Child Theme functions.php file:
add_image_size( ‘post-thumbnail’, 360, 360, true );
And that will create a thumbnail for each uploaded image, by 360x360px, to the name of ‘post-thumbnail’ .
I just checked my upload folder and it looks like that ‘add_image_size’ function isn’t generating an additional 360×360 thumbnail. So all should be good.
Yeah, I tested that before (before I created the child theme and it worked). I think it works because
set_post_thumbnail_size
was meant to default thumbnails to a custom size andadd_image_size
is just to add another custom image…but somehow it is smart enough to know if you have bothset_post_thumbnail_size
&add_image_size
, it only creates one image, perhaps because the image would have the same name…or I just don’t follow, LOL…either way I get it…so just addingadd_image_size( 'post-thumbnail', 360, 360, true );
I think would fix it along with.attachment-post-thumbnail
Question: Do you know HOW I actually modify the functions.php file though? That is one where I cannot just copy the whole file and modify. Do I have to add a function somehow?
Question: Do you know HOW I actually modify the functions.php file though?
You don’t copy the whole functions.php file.
What you do most of the time is just copy the function from the parent theme and paste it into your Child Theme functions.php file. Then modify it from there, but that only works if the parent theme has this bit of code before the function:
if ( ! function_exists( '[function name]' ) ):
Otherwise your website will get an error saying there are duplicate functions.
In your case you just want to modify the CSS bit inside the ‘
spun_options_styles()
‘ function?What you do most of the time is just copy the function from the parent theme and paste it into your Child Theme functions.php file.
Ah, Ok, so then I can just add
add_image_size( 'post-thumbnail', 360, 360, true );
right into my functions.php file? CoolIn your case you just want to modify the CSS bit inside the functions.php file?
Right, I just want to modify that css part in the function spun_options_styles(). I guess I remove that function in the child and then add a new function in the child to add everything back with the changes I want, but not sure that is advised
Ah, Ok, so then I can just add add_image_size( ‘post-thumbnail’, 360, 360, true ); right into my functions.php file? Cool
Yep.
Right, I just want to modify that css part in the function spun_options_styles(). I guess I remove that function in the child and then add a new function in the child to add everything back with the changes I want, but not sure that is advised
I think you mean remove it in the parent and then re-add it in the Child, you’re right that is not advised.
In the case of the
spun_options_sytles
function, what you need to do to override it is a bit complicated. I’m not sure how to do it.
- The topic ‘Resize image in cirlce’ is closed to new replies.