Static Image over Feature Slider
Posted 18 March 2013 - 09:28 PM
Hello! Working on a site and I'd like to add a hanging banner image on top of the feature slider so that the feature slider will rotate through on the home page but the banner image will remain, "hanging" from the top right corner. I'm just not sure how to go about adding this. Not sure if there is a way to do this with strictly css or if I'm going to have to add via php or something. ??? Any direction would be much appreciated!
The temp site is:
Thanks in advance!
Posted 18 March 2013 - 10:05 PM
I've never tried this, but this seems like it should be possible. However, not being a developer, I couldn't begin to explain how. My best guess is to replace the background image (not the slide -- the one that provides the shadow) with your image, specifically positioned and with a unique z-index. I wish I could be more help.
Since this is a customization, I'd recommend hiring one ofwho might be able to set this up for you quickly.
Posted 19 March 2013 - 08:12 PM
I figured out a work around... maybe. I added the banner into the universal sidebar and added that to the top of my home page template. Then, I made the universal sidebar background transparent. I figured I could bump up the top margin of the feature slider and set z-indexes to have the banner sitting on top of the features. But I can't seem to get the features any higher... it just pulls the white background. Any ideas on that? I really appreciate the help!!!
Code So Far:
Posted 20 March 2013 - 04:06 AM
The only ways I can think you might be able to do this would be to use a negative margin on the #features. Just use the id instead of adding the .content and other classes, see if that pulls the whole section up.
Of maybe look into using a hook within the feature slider to add the content into the slider? There's a hook for pagelines_feature_media_top you could try.
If you're new to hooks you could use the hooker plugin -then you can try and paste in the html for you image directly into the hook and position it with css.
Posted 20 March 2013 - 07:49 PM
Same problem when I use #features.
I installed Hooker. I can get the image to appear using the 'pagelines_outer_features' but when I try to adjust the margin the space just goes white. Nothing shows when using the 'pagelines_feature_media_top' hook - I don't see that hook in the Action Map.
Posted 21 March 2013 - 03:58 AM Best Answer
I would say try putting the image inside it's own div in the hook, then you can control it with css and edit the margin/z-index of the image.
- anlinares likes this
Posted 22 March 2013 - 07:42 PM
Nope. No luck. Still won't bump up the feature slider behind the image.... just bumps up the white space, even when using only #features, #feature_slider, or #feature_area. Using #cycle bumps up the slider but it cuts it off rather than displaying behind the image. (See screenshot)
Posted 22 March 2013 - 09:41 PM
Nevermind! #feature-area did the trick!! Too much time spent looking at code (was using #feature_area - oops!). Thank you for your help! Using the hook and putting it in a div did the trick!!!