Jump to content
Sign in to follow this  
bijoubean

Changing Feature Navigation Thumbnail size

Recommended Posts

bijoubean

Hello, How can I change the default feature navigation thumbnail size...ie, I would like it to be larger and a different aspect ratio. The feature frame boarder would need to change accordingly too. I am using Platform Pro. Thanks!

Share this post


Link to post
Share on other sites
intellagentz

Caution: I'm not an expert. I use trial and error methods one line at a time. Using Chrome/Firebug, seems the code is this: #featurenav a span.nav_thumb, #featurenav a span.nav_thumb span.nav_overlay { display: inline; float: left; height: 50px; margin-right: 10px; vertical-align: middle; width: 80px; } I'd change the height and width to your needs (using Custom CSS code area) and then upload an image of corresponding size in the feature section thumb area and see what happens. If it doesn't work, you can always just delete the code from the Custom area. (I suspect the Feature section instructions will still read "50x30" though)

Share this post


Link to post
Share on other sites
intellagentz

Sorry, I already changed the height and width in the code above for the sake of trial...to 80 and 50..of course the original code calls for 50 and 30 respectively.

Share this post


Link to post
Share on other sites
intellagentz

Lets try this one more time..."30 and 50 respectively"

Share this post


Link to post
Share on other sites
bijoubean

Carl, That's exactly what I wanted! Worked like a charm. Thanks so much!

Share this post


Link to post
Share on other sites
bijoubean

How would I change the click on state? It appears that the highlight is still on the default size. Thanks!

Share this post


Link to post
Share on other sites
intellagentz

Try adding this to custom code (again, hopefully it works, if not, delete) #featurenav a span.nav_thumb span.nav_overlay { background: none; }

Share this post


Link to post
Share on other sites
intellagentz

Sorry, might have to add this too for the active slide. #featurenav a.activeSlide span.nav_thumb span.nav_overlay { background: none; } NOTE, this solution just removes the transparency effect for the active slides. To re-size the span transparency effect would involve re-sizing the file below and changing corresponding CSS values for positioning. Somewhat involved. http://www.savingphilanthropy.org/dev/wp-content/themes/platformpro/images/feature-thumb-overlay.png

Share this post


Link to post
Share on other sites
bijoubean

Carl, It's looking good and works for me. One last thing. We've removed the transparency effect for the active and inactive slides but it still shows up quickly when clicked on. Is there a way to remove that too?

Share this post


Link to post
Share on other sites
intellagentz

Try editing the first code above, by adding "!important" like so, #featurenav a span.nav_thumb span.nav_overlay { background: none !important; } gotta love CSS codes...why don't the propellor heads create additional parameters like "!really really important, for the love of God, please work" lol

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

Sign in to follow this  

×