WordPress.org

Ready to get started?Download WordPress

Forums

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

  1. Andrew
    Forum Moderator
    Posted 6 months ago #

    Do you know why just switching to set_post_thumbnail_size( 360, 360, true ); doesn't resolve the issue?

    That would mean more function-switching, which I think is the root cause of the issue. The act of switching between 'add_image_size' and 'set_post_thumbnail_size' (and vice-versa) somehow causes images to lose their defined size

  2. Andrew
    Forum Moderator
    Posted 6 months ago #

    By the way this means I have finally experienced your issue through that methodology I just posted - hooray

  3. Andrew
    Forum Moderator
    Posted 6 months ago #

    I'll come back to this thread, at least I can replicate the problem and continue to explore a possible lead.

  4. steves_turn
    Member
    Posted 6 months ago #

    Haha, congrats, I think... If you look at the Spun demo site, it demonstrates the same issue even, it's very apparent in the 2nd row, 2nd column pic :)

    To your previous comment: Which is weird because the image size is there in the uploads folder...that's what I don't quite understand - the old 360x360 images are in the uploads folder, it seems to be like an issue accessing or using those previously uploaded images. With the test file that worked the image was uploaded 20140204-142702-360x360.jpg...when we switched over to Twenty Thirteen in place of the 360x360 image was the 6-4x270 image (because that is what set_post_thumbnail_size told it to upload. I feel like somehow the mechanism to request the 360x360 image from the uploads folder is the problem...and it may very well be within the add_image_size function or WordPress or how Spun uses the new function (add_image_size)

  5. Andrew
    Forum Moderator
    Posted 6 months ago #

    it seems to be like an issue accessing or using those previously uploaded images

    Can you explore this by checking your website's error logs? Recreate the issue so that you have an accurate log of the time at which it happened

  6. steves_turn
    Member
    Posted 6 months ago #

    Well, I don't have any errors in my logs...what I meant by "issue accessing" is that somehow the new version of Spun I believe is not setting the featured image to the 360x360 version....it wouldn't throw an error because I am guessing it was coded that way, but getting to the root of that is baffling me...how to set the featured image to look at the 360x360 size image...and I think it had to do with your hunch regarding add_image_size...Do you know where the code is to "set featured image"? Not sure if that will point me to the write answer though.

  7. Andrew
    Forum Moderator
    Posted 6 months ago #

    Do you know where the code is to "set featured image"?

    spun_get_image is first called here: http://themes.svn.wordpress.org/spun/2.0.2/content-home.php

    It's defined here:
    http://themes.svn.wordpress.org/spun/2.0.2/inc/template-tags.php - which calls on the $size parameter with the string 'home-post'. See the Codex docs for wp_get_attachment_image if you want an explanation of why 'home-post' is being passed.

    The 'home-post' size is defined in the functions.php file: http://themes.svn.wordpress.org/spun/2.0.2/functions.php under the 'spun_setup' function:

    add_image_size( 'home-post', 360, 360, true );

    That's it.

    The 'add_theme_setup' function is then hooked onto each pageload after the theme has been initialised (still in the functions.php file):

    add_action( 'after_setup_theme', 'spun_setup' );

    http://codex.wordpress.org/Plugin_API/Action_Reference/after_setup_theme

  8. Andrew
    Forum Moderator
    Posted 6 months ago #

    This time I just stayed on the Spun Theme v.2.0.2.

    Note: I am editing the parent theme stuff for testing purposes only

    1. I edited the parent theme functions.php file and replaced this:
      add_image_size( 'home-post', 360, 360, true );

      With this:

      set_post_thumbnail_size( 360, 360, true );
    2. Then went into the parent theme template-tags.php file and replaced this:
      $thumb = wp_get_attachment_image( $attachment, $size, false, array( 'title' => esc_attr( strip_tags( get_the_title() ) ) ) );

      With this:

      $thumb = wp_get_attachment_image( $attachment, 'post-thumbnail', false, array( 'title' => esc_attr( strip_tags( get_the_title() ) ) ) );

      The reason I did that was because the 'home-post' image size no longer existed and instead the default 'post-thumbnail' image size existed.
      I was replicating the same line of code on the Spun theme version 1.07: http://themes.svn.wordpress.org/spun/1.07/content-home.php

    3. If you're not aware, changing the '$size' variable (from the previous step) also changes a class that's generated in each thumbnail, so now I had square images.
      I only did this change so that it was easier for me to isolate the real issue we're looking at. In the parent theme style.css file I replaced this style:
      .blog .hentry a .attachment-home-post,
      .archive .hentry a .attachment-home-post,
      .search .hentry a .attachment-home-post {
      	border-radius: 180px;
      	opacity: .8;
      	transition: all .3s ease-in-out;
      	-webkit-transition: all .3s ease-in-out;
      	-moz-transition: all .3s ease-in-out;
      	-o-transition: all .3s ease-in-out;
      	-ms-transition: all .3s ease-in-out;
      	width: 100%;
      	height: 100%;
      	z-index: 1;
      }

      With this style:

      .blog .hentry a .attachment-home-post,
      .blog .hentry a .attachment-post-thumbnail,
      .archive .hentry a .attachment-home-post,
      .search .hentry a .attachment-home-post {
      	border-radius: 180px;
      	opacity: .8;
      	transition: all .3s ease-in-out;
      	-webkit-transition: all .3s ease-in-out;
      	-moz-transition: all .3s ease-in-out;
      	-o-transition: all .3s ease-in-out;
      	-ms-transition: all .3s ease-in-out;
      	width: 100%;
      	height: 100%;
      	z-index: 1;
      }

    The results were that none of the images in my circles were being resized as they should have been.

    This is a screenshot of me inspecting the true size of one of my circles: http://snag.gy/CHQXr.jpg - Look at the "Natural" bit: http://snag.gy/EezNa.jpg

  9. steves_turn
    Member
    Posted 6 months ago #

    In your first image http://snag.gy/U6vqx.jpg, if you forced it to pickup the thumbnail, why is it 180x180? Also the pic looks weird I think because of the crop. Doesn't add_image_size( 'home-post', 360, 360, true ); & set_post_thumbnail_size( 360, 360, true ); just add an image with those dimensions upload upload? I think the trick is using that image which is created by the set_post_thumbnail_size( 360, 360, true ); SO, instead of the URL showing http://wp-sandbox/wp-copntent/uploads/2014/01/1.jpg it should be displaying http://wp-sandbox/wp-copntent/uploads/2014/01/1-360x360.jpg...right?

  10. Andrew
    Forum Moderator
    Posted 6 months ago #

    In your first image http://snag.gy/U6vqx.jpg, if you forced it to pickup the thumbnail, why is it 180x180?

    It's not picking up the thumbnail even though it was set to. What you're seeing as 180x180 is just applied by CSS, the "Natural" bit shows the actual image size.

    Doesn't add_image_size( 'home-post', 360, 360, true ); & set_post_thumbnail_size( 360, 360, true ); just add an image with those dimensions upload upload?

    Yep.

    SO, instead of the URL showing http://wp-sandbox/wp-copntent/uploads/2014/01/1.jpg it should be displaying http://wp-sandbox/wp-copntent/uploads/2014/01/1.jpg...right?

    Yep (assuming you mean the latter URL has an image size in the image name).

  11. steves_turn
    Member
    Posted 6 months ago #

    Thanks, then are you also stumped on how to pull the 360x360 image? I looked at the code last night, but just couldn't figure it out and I had to step away, haha. Also, what's interesting is that sometimes I see 'post-thumbnail' and other times I am seeing 'post-thumbnails' (plural). I thought for a minute it was just a simple typo in the code somewhere, but I don't think it is.

  12. Andrew
    Forum Moderator
    Posted 6 months ago #

    Thanks, then are you also stumped on how to pull the 360x360 image?

    The issue is certainly stumping, and I don't know why switching between the two image size functions causes this issue, but the issue is a lot easier to tackle now that it's narrowed down.

  13. Andrew
    Forum Moderator
    Posted 6 months ago #

    Btw I just tried a regenerating image plugin and it fix this issue at all: http://wordpress.org/plugins/force-regenerate-thumbnails/ . I think there was no error in the plugin.

    Again, the image returned to its correct dimensions when I re-uploaded it to the Media Library.

  14. Andrew
    Forum Moderator
    Posted 6 months ago #

    Btw I now think the explanation to this issue is really simple & there's no trickery whatsoever - I'll sleep on it though

  15. steves_turn
    Member
    Posted 6 months ago #

    So, is it just a matter of when upgrading from 1.7 to 2.02 v of Spun the 'home-post' does not yet exist (unless you upload a new image or reupload images)? Does that seem to be the issue? Also, you mentioned re-uploading DID fix it, right? You don't have to reset all of your feature images though, do you?

  16. steves_turn
    Member
    Posted 6 months ago #

    I can try to play with the code or just regenerate, thx

  17. steves_turn
    Member
    Posted 6 months ago #

    So Andrew - you were totally right in your prior modifications...I tested this method and it seemed to work

    Changed the following:
    IN template-tags.php (inc/template-tags.php)
    REPLACED function spun_get_image( $id, $size = 'home-post' ) { WITH
    function spun_get_image( $id, $size = 'post-thumbnail' ) {

    IN Stylesheet (style.css)
    ADDED .blog .hentry a .attachment-post-thumbnail,

    IN Theme Functions (functions.php)
    ADDED set_post_thumbnail_size( 360, 360, true );

    I think I need to modify another css attribute because I lost some of the gray overlay on the featured image by making those changes. I also reverted them back, because I just wanted to test it out. It would also pose a problem to others if they added a bunch of posts after the 2.02 update, you would have to reupload those images I think. Anyway, I don't think that is a fix, but maybe a possible workaround (minus the css issue).

  18. Andrew
    Forum Moderator
    Posted 6 months ago #

    So, is it just a matter of when upgrading from 1.7 to 2.02 v of Spun the 'home-post' does not yet exist (unless you upload a new image or reupload images)?

    Yes, I think it is that simple.

    When the theme used 'set_post_thumbnail_size' it was calling on the thumbnails attached to the 'post-thumbnail' name.

    When the theme switched to the 'add_image_size' function it was calling on the thumbnails attached to the 'home-post' name.

    Yes, when the theme upgraded there were no thumbnails attached to the 'home-post' name and so the theme could not get the thumbnails. Instead it loaded the full size images. Only when an image is uploaded to the gallery is the 'home-post' thumbnail generated.

  19. Andrew
    Forum Moderator
    Posted 6 months ago #

    Anyway, I don't think that is a fix, but maybe a possible workaround (minus the css issue).

    I think this is the fix we're looking for.

    The problem was the theme wasn't using the 'post-thumbnail' name for its Homepage thumbnails any more. It was instead using the 'post-home' name.

    So the solution to return to using the 'post-thumbnail' name is the right thing to do.

  20. Andrew
    Forum Moderator
    Posted 6 months ago #

    Are you using a Child Theme?

  21. steves_turn
    Member
    Posted 6 months ago #

    I think that's spot on...If you ask me the issue lies in this one line:
    function spun_get_image( $id, $size = 'home-post' ) {...I was trying to think of a way to modify that function to somehow use the 'post thumbnail' for the existing images and use 'home-post' for the new images, but somehow...also I think the set_post_thumbnail_size( 360, 360, true ); can work in conjunction with the add_image_size( 'home-post', 360, 360, true );. Wait a minute, what if we just modified the wording of 'home-post' to 'post-thumbnail'? I think that would fix it. I played with that and it did seem to work...I am missing the gray overlay still somehow...need to find that css, but I think it works

  22. Andrew
    Forum Moderator
    Posted 6 months ago #

    Wait a minute, what if we just modified the wording of 'home-post' to 'post-thumbnail'?

    But, what line of code are you referring to here?

  23. steves_turn
    Member
    Posted 6 months ago #

    I found the gray overlay, in the functions.php...I think that's it...you can check the

    site
    -I might need to clean some stuff up and there might be more to it than that...but seems to have worked

  24. steves_turn
    Member
    Posted 6 months ago #

    What line of code are you referring to here?

    I was referring to function spun_get_image( $id, $size = 'post-thumbnail' ) { IN template-tags.php (inc/template-tags.php), but you would have to update the functions.php and the css to also match post-thumbnail

  25. Andrew
    Forum Moderator
    Posted 6 months ago #

    Yes that's fine, that's where you can change 'home-post' to 'post-thumbnail'

  26. Andrew
    Forum Moderator
    Posted 6 months ago #

    It doesn't look like you've a Child Theme set up

  27. Andrew
    Forum Moderator
    Posted 6 months ago #

    You should avoid editing the parent theme files like that, first set up a Child Theme and I'll talk you through how to make the same changes but properly: http://codex.wordpress.org/Child_Themes

  28. steves_turn
    Member
    Posted 6 months ago #

    It doesn't look like you've a Child Theme set up

    Yeah, I was just testing it out...I will definitely setup a child theme first...I was just reading up on that. Thanks for the help thus far. It's good practice not to mess with the parent, I agree...to be continued once I setup it up

  29. steves_turn
    Member
    Posted 6 months ago #

    OK, I setup the child, but a little stumped on how to edit the functions.php with the updates I wanted as well as the template-tags.php file...any help there? Thanks!

  30. Andrew
    Forum Moderator
    Posted 6 months ago #

    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. Then you can modify that file (from within your Child Theme).

Reply »

You must log in to post.

About this Theme

About this Topic

Tags

No tags yet.