Jump to content
Sign in to follow this  
brianecenterpointnhorg

Code to highlight grandchild title?

Recommended Posts

brianecenterpointnhorg

I love the iBlogPro look. However, my field testers find it easy to miss the grandchild links when they appear (our site doesn't have a lot of them so it's not hard to miss them). As a possible option, I'd like to have the main nav image occur/display in the title area of the grandchild sidebar. That way, the grandchild title will stand out. Not being much of a coder, I've tried a few things but am not getting the results I desire. Any help is very appreciated. Thanks.

Share this post


Link to post
Share on other sites
cmunns

I'm a bit confused by what you're looking for. You want the gradient from the nav bar to be in the header for the grandchild nav widget?

Share this post


Link to post
Share on other sites
brianecenterpointnhorg

Yes. Not sure I'll have that as the final solution but wanted to see what it would look like, then I'll adjust height, etc. If you have a better idea for highlighting the grandchild sidebar I am very open to suggestions. Thanks again.

Share this post


Link to post
Share on other sites
cmunns

maybe. I'll take a look if you can provide a link to your site.

Share this post


Link to post
Share on other sites
brianecenterpointnhorg

Sure. The temporary link (going live later this week) is centerpoint church . The link I am giving you takes you directly to a page that has a grandchild link in the sidebar. Thanks.

Share this post


Link to post
Share on other sites
bryan-hadaway

Try adding this to your Custom CSS:

	#subnav {
			font-size: 15px;
			background: transparent url(images/nav-bg.png) no-repeat 0px -1px;
			height: 38px;
			margin-bottom: 16px;
		}

Thanks, Bryan

Share this post


Link to post
Share on other sites
brianecenterpointnhorg

Hello Bryan and thanks for the suggestion. I think your code refers to the subnav rather than the sidebar granchild links area. I tried similar code but (again not being a coder) could not determine the correct #-thingy syntax in my guesses to get it to show up without messing up the sidebar layout. Do you know what the correct syntax would be that would allow me to use the code you provided but have it diusplay int he sidebar/grandchild navigation area?

Share this post


Link to post
Share on other sites
cmunns

If you don't want to mess with code you could just try using the accordion sidebar which has a gradient nav bg in the headers of the widgets. Then you can set them to collapse or not so it looks similar to what you have.

Share this post


Link to post
Share on other sites
brianecenterpointnhorg

I don't mind adding code (I've done that for a few select other things) but I haven't been able to get it to work yet. the code Bryan offered is close but doesn't address the sidebar itself. I tried the accordion and the ads or flickr section started overlaying the links. I simply set accordion as the option and it started overlaying (no other custom code) Thoughts?

Share this post


Link to post
Share on other sites
bryan-hadaway

I suspect this is not going to look very good: ` #grandchildnav li { background: transparent url(images/nav-bg.png) center center no-repeat; height: 30px; } ` But, I suppose it's worth a shot. Thanks, Bryan

Share this post


Link to post
Share on other sites
brianecenterpointnhorg

Thanks again Bryan. Using this in custom code just "as is" did not effect any change. So I added #sidebar right before it because in the base css the #sidebar seems to be used to specify that area. Doing that caused the image to occur on each list item (grandchild link). I'm trying to get the image to display on the sidebar title itself not the list items. Didn't realize of course it would be such a challenge.

Share this post


Link to post
Share on other sites
cmunns

Ask and you shall receive: ` #sidebar #grandchildnav { background: transparent url(images/nav-bg.png) top center no-repeat; } #sidebar #grandchildnav .wtitle{ background:none; padding-bottom:5px; } #sidebar #grandchildnav .winner{ background:url("images/post-bg-short.png") repeat-x scroll 0px 36px transparent; } ` BINGO!

Share this post


Link to post
Share on other sites
bryan-hadaway

Hi Brian, hopefully you can verify if that worked for you and mark this thread as Resolved. Thanks, Bryan

Share this post


Link to post
Share on other sites
brianecenterpointnhorg

Howdy. Thanks to you both for your efforts. This last piece of code looks formidable! I inserted it in my custom code and tested it. It did not have any effect. Then I temporarily added it to the stylesheet and still no change. I used dev tools to view the stylesheet. I saw several references to that area, but the new code was not present. I'm sure I am doing something wrong but I have other custom code in the Options and that code is working. I left the code in the custom c ode options in case you want to take a look. Here is a link to a page using the grandchild sidebar. Can you see anything I'm doing wrong? Sorry for the extended thread. Thanks very much.CenterPoint Church grandchild example

Share this post


Link to post
Share on other sites
cmunns

If you just get rid of the other references to this in the custom code section it should work. When you use the custom code area it places the CSS just before the body of the HTML ( and thus is the last to load, and since CSS is hierarchical it will take precedence) OR even just placing the code provided at the BOTTOM of the custom CSS you have would probably even do it

Share this post


Link to post
Share on other sites
brianecenterpointnhorg

Thanks I'll give that a try. I really appreciate your help. Pagelines is a great team and the products are fabulous.

Share this post


Link to post
Share on other sites
bryan-hadaway

Come back anytime for help. Thanks, Bryan

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  

×