How to change uploaded image name-150×150.jpg to name-thumbnail?

  • Resolved colouro

    (@colouro)


    12 years, 7 months ago

    I have small thumnail images which I want to enlarge in div near by to mouse when I hover on them. I do this with jQuery::

    $(".attachment-thumbnail").hover( function(event) {
  var url = $(this).attr("src").replace("-150x150", "");;
 $("div").css( {top:event.pageY, left: event.pageX, 'background-image':'url('+url+')'}).toggle();
  });

    But the problem is that I get the biggest size of image and it loads slowly.
    I cant replace “150×150” with something like “300×225” becouse not all medium size images are sized to this dimensions.

    Maybe you can help me find the way to do this other way? Or maybe how could I change the wordpress resized images naming from “height x width” to “medium”?

Viewing 5 replies - 1 through 5 (of 5 total)

  • The best way to do it is to set up a custom image size for your site. this way any images that are uploaded will be sized to the dimensions that you want. You can do this in your functions.php file with add_image_size(). Then the image should be saved as the right file name, eg: file-345×125.jpg so you can do your replacing using your custom sizing.

    Just a note… Adding that won’t create new thumbnail images of any existing media files. it’s a limitation that’s known, an dhas bene discussed a bit, but hasn’t resulted in any changes so far. to get around this you need to re-upload any image files that you will want to use like this.

    Thread Starter colouro

    (@colouro)

    Thank you, I wil try.

    Hmm… I don’t know how you work that out. Did you use it like this?

    add_image_size('mynewsize', 300, 125, true);

    If yours is resizing to 100 x 300 you probably have the width and height the wrong way around. Also remember that true is needed as the last parameter to crop the image if you want to. In this application I’d say that you should crop it, otherwise you will get different sizes for each image depending on the width/height ratio.

    Just thinking too… If you want to have different sizes available, you can do this but it will require osme pretty hard-core modifications to your JavaScript, and you will need to have some of it produced by your PHP page to get the correct variables in there. It is possible, you just have to associate each thumbnail image with it’s corresponding larger image.

    Thread Starter colouro

    (@colouro)

    Sorry for late responding.

    Thank you very much!
    Now I can get it from jQuery. First time I didnt saw that there is a file with name 400×300 as I write in a function. But now I am very happy! ??

Viewing 5 replies - 1 through 5 (of 5 total)
  • The topic ‘How to change uploaded image name-150×150.jpg to name-thumbnail?’ is closed to new replies.