Indexhibit Support

By default, the visual index format chooses the first image of each exhibit to appear as thumbnail. Is it possible to change that? Any way to customize things in order for us to choose the images we want for thumbnails?

Also, is it possible to make image hovering in the visual index format? I mean, for different thumbnails, to have different images appearing on hover? (for thumbnail A, to have image hover A, for thumbnail B to have image hover B, and so on...).

Any hints on this would be more than welcome!

My site:
mariovideira.com/testes/zbit/

thanks in advance!

- With ndexhibit Legacy, you could with a slight change in the visual_index code (and some work with Photoshop after that) set up your own thumbnails. But I haven't found yet the relevant section of the code in Indexhibit 2.0 (there was quite a few changes...).

- Randomizing the visual index would be of interest to me. I haven't found the answer to that (even on Legacy) despite numerous searches on the forum. There was a format which allowed you to order the Visual Index though, but I am fairly certain it was not updated yet.

- If you are a tad familiar with CSS, the format.visual_index file have some dynamic CSS at the end of it that allow you to tinker with the thumbnails or the caption. Thus, some effects now fully managed by CSS should be pretty simple to add, like having a different opacity on hover.
Putting another image on hover is possible, but I guess way more work intensive. You'll probably have to change a bit of CSS, PHP and HTML, and I suspect you'll end up with a system that will not be automatized and a bit of a pain each time you'll want to update the site.

Those are very small hints on which I am not elaborating as the very little know-how I have is mostly linked to the older Indexhibit template.

Hi mpcv
What you can do is upload an image to your exhibit and put in in first place. so this one will be shown in the visual index. And if you go in the exhibit admin you can set it as "inactive" (it will get a red border in the list) so this one will not show up in the actual exhibition but will be the one in the visual index.
hope this helps.

Thank you for your help!

Paulchen25:
I tryed that and it works just fine! It's a simple and very smart way to control the images we want for thumbnails!

Laecke:
I also think having other images as hover should be very hard to accomplish (at least for someone that knows only the basics of html/css like me...).

I saw some good examples of this:

janeumann.de/

melaniegueret.com/

carolinefabes.com/

but I don't know how this could be done, the customization should not be easy... however, If somebody knew how to help on such customizations, the help would be welcome!

For the option you mentioned about opacities on hover, I just made one test:

mariovideira.com/testes/zbit/

I've inserted this code in my style.css file:

.picture { background:#7FFFD4; }
a img:hover { opacity:.30; }
.top a img: hover { opacity:1; }

My problem is that the area below the image where the caption is, just got coloured as well. Any Ideas how I could have the color only behind the image, but not in the caption zone?

I tryed to work this around in the format.visual_index file, but with no luck... Any Ideas?

Also, the code I've inserted affects not only the visual index thumbnails, but also the other images of my site.

When I click on a thumbnail and I enter inside a project, the Images of the project also have the color and the hover. When I hover my logo ou my social networks' icons they are affected by the opacity on hover.

I believe this is because all the ".picture" calls every image of my site.

How could I control this, in order to this colored and opacity hover affect just the visual index thumbnails (and having the caption area without color)?

Thanks in advance!

about the visual index hovering ther is a post by someone in this forum. but i cant remember. maybe this is what you are looking for (or a starting point)

at the end of the style.css

/*makes image links to fade when mouse over in the visual index format*/
.picture_holder .picture a:hover {
opacity: 0.8;
}

Thanks Paulchen25!

Using ".picture_holder" instead of ".picture", solves one of the issues.

Now only the visual index thumbnails are afected by the opacity hover, like I wanted. This way the images inside each project and the logo and social networks' images are not affected by the opacity hover.

For the color issue, i'll keep searching in the web...

Thanks again!

i don't know what you mean by color issue but if you want a color to apear "under" your visual index images try adding:

.picture_holder .picture {background-color:#663399;}

! note that this a different style than the one in the other poste> without the a:hover
so it puts a background color to your image witch will be visible when hovering because of the change of opacity.

Hi Paulchen25! And once again thanks!

The color issue that I was mentioning above, is basically what you can see here:
mariovideira.com/testes/zbit/

If i put a colored background, the color isn't just under the image, but also in the caption area below each image. I don't know how to "isolate" the image area from the caption area.

My objective was to have color only under the image and not in the caption area below the image (so that the caption area could be transparent, with no backgroung, with the general color of the site background).

Is it possible to control this?

Thanks!

Hello,

I am trying to follow the instructions on this page / and on the forum.
My css is very basic (trial and error style). Here is my website:

lamasfeir.com/

I would like to know if the following is doable in this version:
The grey colored icons (on the main page) become colored upon hovering + clicking it would take you to the page of the project. Any easy example (encouragement) would be very much appreciated.

(the icons are still a dummy flat picture).

Thanks in advance.

This is a version 2 thread but you're running a Legacy version site - we try to keep both in separate threads so people don't get confused.

You are after a custom Visual index - it's doable with Version 2
The "grayscale image on hover" is rather easy implementing with css3.

Thank you for responding.
So you are suggesting i use css3 in the version i have now.
No need to go over and reinstall Version 2.

Thank you

What do you mean reinstall version 2? You are running the Legacy version...

Sorry i meant install version 2 not REinstall.
By Legacy version you mean the old version.
Yes i am confused. Sorry.

There used to be a visual index plugin for the legacy version but it was limited comparing to the new version. I'm not sure if it's still around in the forum anymore...
So you either do things manually, using html and css and pasting the code to the text area of your home page, or you upgrade.

Thank you very much Arsondpi for your patience.
I will try to figure out the coding.