thoughts about retinafy your indexhibit image

huangegg / 2015-08-18 14:27:01   

Hey friends, thanks to Indexhibit I am able to build a personal online portfolio myself. I am a fresh designer and always working with my retina macbook. So the image quality would be important to present my works. I have to say I know only a little about coding(I learned a bit html and css in codeacademy.com), but I am trying to think how to retinafy my indexhibit, please allow some unprofessional thinkings :)

I did a bit search work, these two posts are very practical and interesting.
indexhibit.org/forum/thread/15024/
indexhibit.org/forum/thread/16881/

the first post proposes, that you can replace the resized images in /files/gimgs/ folder, with twice wider and higher image. But a bit troublesome.

Another practical way I could do is using the original image url by HTML img tag with width attribute, see my example: kaiyuhuang.com/test/retinafy/

But this way doesn't solve the thumb image. for example:
kaiyuhuang.com/…
and horizontal exhibit format:
kaiyuhuang.com/photography/

So what I am trying to say is, I was wondering, if there is a way to change the setting of the resizing engine. For example, if we want a 400px wide image, the resizing engine resizes however a 800px image for us (instead of outputting a 400px image as usual). So the 800px image will be displayed in 400px area, which means retina. If it is possible, then all the images are retina automatically.

Any ideas?

huangegg / 2015-08-23 22:39:00   

hey friends, i'm gonna build my website further with the "img" tag as I mentioned, and leave the thumb image problem for a while.

but I really guess the solution is in the /ndxzstudio/lib/resize.php, but unfortunately I cannot read the code.

anyone has an idea? I will learn php after finish building the website.

nicolasdangelo / 2015-08-28 12:39:10   

hi huangegg,
i was wondering if you could explain in a bit more detail what to do to make this:

"Another practical way I could do is using the original image url by HTML img tag with width attribute, see my example: kaiyuhuang.com/test/retinafy/"

happen on a indexhibit site.

thank you!

huangegg / 2015-08-28 23:59:57   

hi nicolasdangelo , of course.
This way is not a smart way but a usable way. Do you see the difference of the two images in the link?(if you have a retina device)

So the first image is default setting by indexhibit. normal uploading, normal inserting. which means, i uploaded my original image(1000px wide), and indexhibit resizes it to 600px according to my setting. The resized 600px image is displayed in 600px area.

if you upload one image, you also get a link to the original image on your server. In my case it is /files/gimgs/x-stool-00_v2.jpg (1000px wide). so I use it with the html tag with "width" attribute: w3schools.com/tags/…

I write the code in the post. I limit the 1000px image to 600px wide, to get the second image. which is sharper than the first one in retina screen.

Is it understandable?

This thread has been closed, thank you.