overlay images on slider

(7 posts) (2 voices)

1. 

   localdirect
   Member

   Hi, i would like to overlay a couple of static images on the slider as per the attached screenshot. Its the white boxes that i want to add as i lost them when doing an update.

   Just wondering where i need to add the relevant code and what code properties will be required

   Cheers

   

   Attachments

   1. Aspect_Resourcing_Partners_screenshot..jpg (115.8 KB, 1 downloads) 8 months old

   Posted 8 months ago #
2. 

   Elliott
   Support

   Hello localdirect,

   Are you wanting to add some boxes for each slide? If so then you can place them in the description field. (see attached image)

   Or if you want them to display on top of each of the slides then you can try placing them in the header and position them with CSS so they display over the slider, http://mysitemyway.com/docs/index.php/Adding_stuff_to_the_header.

   

   Attachments

   1. 1.jpg (14.6 KB, 2 downloads) 8 months old

   Posted 8 months ago #
3. 

   localdirect
   Member

   Thanks for the quick reply, that has done the trick nicely just need to position them now

   One thing, there's a typo on the page you linked - used ' instead of " just before the first >

   Here's the site in the flesh

   http://www.aspectresourcingpartners.co.uk

   Great theme by the way, just switched my personal site over to it as well as this one for a client

   Posted 8 months ago #
4. 

   Elliott
   Support

   Should be fixed now, thanks for the heads up.

   Posted 8 months ago #
5. 

   localdirect
   Member

   Hmm, thought this was sorted but i just noticed the overlay images are on every page.

   I just want to have them overlaying the slider on the homepage, so how can i disable them on the internal pages?

   See http://www.aspectresourcingpartners.co.uk

   Here's the code i put into the header file:

   <div style = "position: absolute; top: 200px; left: 616px; z-index:2;">
   			<img src="http://www.aspectresourcingpartners.co.uk/wp-content/uploads/2011/09/connected.png"/>
   </div>
   			<div style = "position: absolute; top: 290px; left: -14px; z-index:2;">
   			<img src="http://www.aspectresourcingpartners.co.uk/wp-content/uploads/2011/09/careercomp.png"/>
   </div>

   Posted 8 months ago #
6. 

   Elliott
   Support

   You could surround them with this,

   <?php if (is_home()) { ?>
   your code
   <?php } ?>

   Or you could hide them with CSS,

   .your_box { display: none; }
   .is_home .your_box { display: block !important; }

   Posted 8 months ago #
7. 

   localdirect
   Member

   Thanks for this Elliot, the php code did the trick nicely

   Posted 8 months ago #

RSS feed for this topic

Reply

You must log in to post.