WordPress.org

Ready to get started?Download WordPress

Forums

Spun
[resolved] Resize image in cirlce (87 posts)

  1. steves_turn
    Member
    Posted 6 months ago #

    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 360x360? 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-360x360.jpg vs /wp-content/uploads/2014/01/20140114-12345.jpg? Hope that makes sense. Thanks!

  2. steves_turn
    Member
    Posted 5 months ago #

    Hi, anyone know how to resize the image in the circle back to 360x360? Thanks

  3. Andrew
    Forum Moderator
    Posted 5 months ago #

    Are you sure resizing the image to that dimension will resolve this issue?

  4. Andrew
    Forum Moderator
    Posted 5 months ago #

    Try adding this to your Child Theme functions.php file:

    add_image_size( 'home-post', 360, 360, false );
  5. Andrew
    Forum Moderator
    Posted 5 months ago #

    Then try re-uploading the images with the problem
    - or use a plugin to do that http://wordpress.org/plugins/force-regenerate-thumbnails/

  6. Andrew
    Forum Moderator
    Posted 5 months ago #

    If you look at the 3rd circle from the top, left on the theme's demo website the image that it's loading there isn't actually 180px x 180px, it's this big instead: http://spun-demo.calobeedoodles.com/files/2010/10/5076439455_b16900cfcc_b.jpg

    I don't think Spun's actually resizing anything

  7. Andrew
    Forum Moderator
    Posted 5 months ago #

    Let's see your website with the issue so that we can make clear that it's not an issue with the dimensions of the images uploaded.

  8. steves_turn
    Member
    Posted 5 months ago #

    Hi Andrew - thanks for taking another stab at this. I know for sure the issue has to do with the previous 360x360 size because I rolled back and saw that when I inspected the element. Sure - my site is here. Let me try to add that code to my child theme and see if that helps. Appreciate it.

  9. steves_turn
    Member
    Posted 5 months ago #

    OK, so I tried that code, but I didn't want to reupload or refresh the images. I am under the impression that the previous version somehow sized the images to 360x360 and in the new update it attempts to resize the original image somehow...I am probably not explaining it the right way...I could roll back to a previous version, have you inspect the picture elements and then roll forward with the latest version, but I am not sure if that would help you nail down the issue. Thanks!

  10. Andrew
    Forum Moderator
    Posted 5 months ago #

    Can you use that plugin and regenerate your thumbnails? Or at least re-upload 1 image as a test?

    I am under the impression that the previous version somehow sized the images to 360x360

    Spun still resizes the images to 360x360 for me, so the ambiguity is not exactly why Spun doesn't resize images, but why some people's images aren't being resized.

  11. steves_turn
    Member
    Posted 5 months ago #

    I am still a little leery of updating all of my thumbnails if they are already there...I don't understand why regenerating the thumbnails would solve the issue when I know the thumbnails are still there in the uploads folders. I guess I just want to know how to force SPUN to use the -360x360.jpg version of my images. If you inspect the image element, then modify it to show -360x360.jpg that completely fixes the issue. Or, I can just back up all of my images and then try to run the regeneration tool you gave, but I have over 250 images (which makes me nervous). Thanks!

  12. Andrew
    Forum Moderator
    Posted 5 months ago #

    Can you make a post for testing purposes, then attach a featured image that you know has an issue, and that you've re-uploaded to the library?

  13. steves_turn
    Member
    Posted 5 months ago #

    That's a great suggestion...I gave it a try and I was like "holy cow" that actually did work. It published the photo at 360x360...I tried also updating an existing post and also deselecting and then reselecting a current pic, but neither of those worked. Shall I just try reuploading the thumbs (as you suggested)? It baffles me WHY that works, but you are the man and know it way better than I do, haha, clearly.

  14. Andrew
    Forum Moderator
    Posted 5 months ago #

    Before you regenerate the photos, before any further conclusions, can you switch to the Twenty Thirteen theme to see if the issue persists? As in, the issue where your images aren't being cropped. If you're not sure how to check that let me know when you have switched and I'll take a look

  15. steves_turn
    Member
    Posted 5 months ago #

    Switching over to Twenty Thirteen the old images are accurately displaying as 360x360, however the new image you had me test upload simple resizes the original image, but it still looks ok. Reverting back to SPUN still has the same issue though with skewing/resizing. But you can have a look if you want. Check the first image thumb in comparison to the 3rd thumb posted on May 21st, 2013...you can see the picture size difference.

  16. Andrew
    Forum Moderator
    Posted 5 months ago #

    Check the first image thumb

    And if you re-upload the first image to the library, for that post, does the issue persist?

  17. steves_turn
    Member
    Posted 5 months ago #

    You want me to reupload the newest image again, that I just uploaded in the Test post, in Twenty Thirteen theme, then check if the image is resized?

  18. Andrew
    Forum Moderator
    Posted 5 months ago #

    Yes. Please.

  19. steves_turn
    Member
    Posted 5 months ago #

    OH weird, that messed up the image in Twenty Thirteen, it resized it to 604x270 (widthxheight).

  20. Andrew
    Forum Moderator
    Posted 5 months ago #

    Twenty Thirteen has a rule to resize images to that size (604x270):

    /*
    	 * This theme uses a custom image size for featured images, displayed on
    	 * "standard" posts and pages.
    	 */
    	add_theme_support( 'post-thumbnails' );
    	set_post_thumbnail_size( 604, 270, true );

    So, only until you re-uploaded the image did this "set_post_thumbnail_size" function kick-in.

    Spun has the same kind of rule:

    /**
    	 * Enable support for Post Thumbnails
    	 */
    	add_theme_support( 'post-thumbnails' );
    	add_image_size( 'home-post', 360, 360, true );

    And what you did in your Child Theme functions.php file (recommended above) was do the same thing as the add_image_size function, but instead of passing "true" you passed "false". You can explore why by looking at the $crop parameter explanation in the Codex guidelines, but that's not important - I don't think.

    Again, only until you re-uploaded an image in Spun did this add_image_size rule kick in.

    Okay I think that's enough testing on Twenty Thirteen, you can switch back to Spun.

    It's difficult to draw a conclusion as to what's going on.

  21. Andrew
    Forum Moderator
    Posted 5 months ago #

    In Spun version 1.07 the image size for the circles was not declared in the add_image_size function. Search for the add_image_size function here to explore: http://themes.svn.wordpress.org/spun/1.07/functions.php - You'll see it's used 1 time for the post image (for another page):

    add_image_size( 'single-post', 700, 467, true );

    Just above that line of code (We're still looking at the Spun v.1.07 theme functions.php file) you will see this:

    set_post_thumbnail_size( 360, 360, true );

    That's how the theme's circle image sizes were originally set.

  22. Andrew
    Forum Moderator
    Posted 5 months ago #

    An issue I've seen people experience when using the add_image_size function is that they have to re-upload the image(s), re-upload it to the media library.
    You might then think it's safe to conclude that this is what's going on: the Spun theme changed the way it resized its circle images, and the way it did meant you had to re-upload the images - HOWEVER - the Twenty Thirteen theme that you just switched to used the same function as the old Spun theme

    set_post_thumbnail_size( 604, 270, true );

    And yet you still experienced an issue with the first image (until you re-uploaded it).

  23. steves_turn
    Member
    Posted 5 months ago #

    Yeah, I remember in my initial research playing with that function: set_post_thumbnail_size( 360, 360, true );. I even tried adding it back to the main functions.php file, but it didn't work. It's like all of the old images that were already uploaded in the previous version of Spun will not use the 360x360 thumb version of the pic, but if you reupload the same pic, it does...I am not sure why that is though.

  24. Andrew
    Forum Moderator
    Posted 5 months ago #

    After some very brief research it seems both the set_post_thumbnail_size and add_image_size could may well do the same stuff, as in, produce the same issue: http://wordpress.stackexchange.com/questions/108572/set-post-thumbnail-size-vs-add-image-size

    So, set_post_thumbnail_size($width, $height, $crop) is a sort of shortcut for add_image_size('post-thumbnail', $width, $height, $crop)

    When an image size change, for every reason, the change has effect on the images uploaded after that change, images uploaded before don't change dimension and are not rescaled and resaved. If someone want rely on specific image sizes, after a lot of images are already uploaded (e.g . after changing theme) then the plugin Regenerate image thumbnail will be life saver.

    Backtracking, maybe it is to do with the add_image_size function in the Spun theme. Maybe when you switch from one function to the other WordPress hiccups, or maybe that's standard behaviour of WordPress.
    E.g. When we switched between Spun, to Twenty Thirteen, WordPress switched between using the 'add_image_size' function to the 'set_post_thumbnail_size' and it was the act of switching between these functions that caused the issue(?).

  25. Andrew
    Forum Moderator
    Posted 5 months ago #

    I know you, and some other people, have experienced this issue for a while, so for a quick solution you may want to try regenerating the thumbnails.

    BUT
    Please do back up your site before this - because we've not really tested enough that regenerating the thumbnails will fix the issue.
    http://codex.wordpress.org/WordPress_Backups

  26. steves_turn
    Member
    Posted 5 months ago #

    Thanks again for the help - I really do want to get to the root of it, so odd. I do think that article you linked to http://wordpress.stackexchange.com/questions/108572/set-post-thumbnail-size-vs-add-image-size, has something close to an answer, but I don't know how to make use of it (block quote below). It looks like add_image_size works when you "upload a new image"...which is why I think when I created the test image it worked as expected...I might end up just regenerating images though if I can't figure it out:

    In addition to the functions mentioned above, there are other 2 functions that make use of image sizes: get_the_post_thumbnail and the_post_thumbnail.

    These 2 functions get (the first) and echo (the second) the image that is setted as "Featured Image" for a post.

    What is returned (or echoed) by this functions is a full img html tag (something like <img scr="http://www.site.com/wp-content/2013/08/image-200x200.jpg" />) so, which size is used?

  27. Andrew
    Forum Moderator
    Posted 5 months ago #

    You can ignore that bit:

    In addition to the functions mentioned above, there are other 2 functions that make use of image sizes: get_the_post_thumbnail and the_post_thumbnail.

    These 2 functions get (the first) and echo (the second) the image that is setted as "Featured Image" for a post.

    What is returned (or echoed) by this functions is a full img html tag (something like <img scr="http://www.site.com/wp-content/2013/08/image-200x200.jpg" />) so, which size is used?

    It's just explaining what the 'get_the_post_thumbnail' and 'the_post_thumbnail' functions do, which isn't related to our issue.

  28. Andrew
    Forum Moderator
    Posted 5 months ago #

    I've done some initial testing and it seems to confirm our little hypothesis

  29. steves_turn
    Member
    Posted 5 months ago #

    Oh cool...Do you know why just switching to set_post_thumbnail_size( 360, 360, true ); doesn't resolve the issue? I will just backup my site and regenerate the thumbs :)

  30. Andrew
    Forum Moderator
    Posted 5 months ago #

    We said:

    it was the act of switching between these functions that caused the issue(?).

    To test whether whether this is true I switched between these functions to try to provoke the same result.

    We already knew that:
    - The Twenty Thirteen theme used the 'set_post_thumbnail_size' function to resize images in the library,
    - And the Spun (v.2+) used the 'add_image_size' function to resize images in the library

    Methodology

    1. Switch to the Twenty Thirteen theme
    2. Upload an image to the library
    3. Attach that image to a featured post/ insert it in the content of the post
    4. Switch to the Spun theme
    5. View the home page
    6. Inspect the element using your browser's developer tools
    7. Look at the actual size of that image (still on the Webpage using your browser's developer tools) that you had just uploaded from the Twenty Thirteen theme

    Results
    The image that was uploaded in the Twenty Thirteen theme does not resize in the Spun theme home page. It should have resized to 360x360 (but didn't).

Reply »

You must log in to post.

About this Theme

About this Topic

Tags

No tags yet.