Customize over and over

repetepete / 2010-07-10 09:39:41   

Thanks huge amounts to everyone involved for the amazing and extremely useful Indexhibit as well as this unbelievably helpful forum. Indexhibit was my first introduction to web design and CSS, and have since created several Indexhibit sites.

I'm trying to customize the over and over exhibition format so that the title and caption text floats to the right of the image rather than underneath. Is it best to do this by customizing the PHP file (if so how? please) or would it be better done through CSS? I have tried adjusting the style sheet by tinkering around with the #img-container p and #img container but cannot isolate the text from the image.

I've looked through the forum and have found some threads on how to customize the slideshow format, but nothing for over and over and my PHP skills are fairly minimal.

I hope this makes sense! Cheers, Pete

Vaska A / 2010-07-10 10:07:19   

Yes, you would customize the format itself but you need to use CSS to make this happen.

Can you show us what you have done so far?

repetepete / 2010-07-17 17:45:00   

I'm trying to build an 'about the team' page for a jewellery company. Here's a link to the page using the standard over and over format -
http://derekbirchjewellers.com/index.php?/information/the-team/

Instead of having the info text under each image I would like it to appear to the right. (Thanks for the quick response, and sorry for my delay.... been cycling around France.)

arsondpi / 2010-07-17 20:34:33   
been cycling around France

??? cool!!! ... thinking of doing something similar over here towards the end of the month...

Anyhow - not the correct, or perfect way to do this but css will do the trick:

  1. #img-container p img {  float: left; margin: 0 20px 20px 0; }
  2. #img-container p {clear: both;}
  3. #img-container p span { padding: 0; margin: 0; width: 400px; display: block; }
  4. #img-container p br { display: none; }

repetepete / 2010-07-19 10:35:17   

Thanks arsondpi. To add the lines of CSS do I need to remove any of the existing rules from my style sheet? Also, do I need to add anything into the index.php for over and over?

repetepete / 2010-07-23 13:38:43   

Sorry to pester, but does anyone know if I need to add anything to the index.php file of Over and Over to get the CSS arsondpi has suggested to work?

Thanks

arsondpi / 2010-07-23 14:28:50   

Did you try inserting it by editing the css part of the actual plugin?

repetepete / 2010-07-23 16:41:22   

Brilliant. Job done!
http://derekbirchjewellers.com/index.php?/information/the-team/

Thanks arsondpi. Enjoy your bike ride.

repetepete / 2010-07-27 10:50:35   

Argghh! I've just noticed that extra margin and padding I had to add to get the text to evenly appear next to the column of images has also affected various other section of the site; including images using other exhibition formats. See following lines taken from the style sheet -

#content p {width: 400px; margin-bottom: 100px; }
#img-container p {width: 400px; padding-bottom: 100px;}

Should the second line of CSS you gave me nullify the content of the corresponding CSS rule in the style sheet? If so, this doesn't seem to work. I have tried to follow various CSS introduction tutorials and am quite comfortable modifying style-sheets that already contain rules... but am not sure how and where to put the CSS in index/ php files. I guess what I'm asking is in the function dynamic CSS section of the exhibit php file can I create a list of whatever #rules I like and then to make them function all I have to do is add corresponding rules to the style-sheet?

Thanks and sorry if this sounds a little confusing.

argh / 2011-06-28 06:58:26   

hey arsondpi, this thread is pretty old, but still...
i´m trying to do the same thing as repetepete.

where exactly do i have to insert your code?

i put it in the exhibit.over and over.php, but it doesn´t change anything.

thanks for any advice...

lx / 2011-06-29 12:26:26   

Yes, it has to be inserted in the dynamic css at the bottom of the exhibit.over and over.php (with spaces instead of " ", of course).

  1. function dynamicCSS()
  2. {
  3.     return "#img-container p img { float: left; margin: 0 20px 20px 0; } #img-container p { clear: both; } #img-container p span { padding: 0; margin: 0; width: 400px; display: block; }";
  4. }

Maybe you need more width than suggested in arsondpi's line 3 (#img-container p span)? Try a value of 1000px and check out what's happening.

lx / 2011-06-29 12:32:00   

Well, the code tag pitfall… I hope, it's comprehensible anyway.

srcieslinski / 2013-07-01 16:30:29   

Does this work in CMS 2, over and over version 1.1? I cannot find exhibit.over and over.php only format.over_and_over.php?

arsondpi / 2013-07-01 17:07:45   

Legacy customizations and formats don't work for the new version.
The best way is to search the forum *or* post a new thread about it and explain what you're after
:-)
(this is a Legacy version 2 year old thread).

This thread has been closed, thank you.