Jump to content
Sign in to follow this  
irenemolinar

Customize Navigation Bar?

Recommended Posts

irenemolinar    0
irenemolinar

HELP MEEE !!! :-(( My PageLine Site: http://irenemolinar.com Let me start by saying PageLine its a wonderful product and a penny well spent. For someone like me with little web design knowledge, I found it easy to get my site ready for content. I just need to customize the navigation bar (I think this will be a helpful feature to add to pageline setting > color control). Ive been driving myself crazy for the past 24hr trying to figure it out. When I couldn't find out how to change the background color of he navigation bar across the whole page and no just the wrap or container. I just settled for uploading a background image in the color control. Setting it to scroll and repeat-x. This works for now and gives me the looking im going for, but im afraid it wont look right on different devices. background2.jpg I later found a forum posted by Danny that I thought would solve my nav bar madness. The code to customize the navigation bar and hover background colors. http://www.pagelines.com/forum/discussion/14766/most-commonly-asked-css-tweaks-for-platformpro#Item_27 I thought this would be the answer to my prayers, but (forgive me if my terminology is incorrect) for some reason I cant call #primary-nav. This is the code I would like to use:

			#primary-nav {
				background-color: #e92883;
				background-image: url('http://irenemolinar.com/wp-content/uploads/2012/01/background11.jpg') repeat-x;
			}
	
			.sf-menu li, .main_nav ul.sf-menu a:focus, .sf-menu a:hover, .sf-menu a:active {
				background-color: #f27db4;
			}
	
I believe the code is correct. Ive placed it in the custom css, and when that didn't work in the style.css file. I thought well maybe its not called #primary-nav, so I tried to find that code. It was not located in the style.css file but I did find it in the rtl.css
#primary-nav { background-color: transparent;}

I thought Ok heres my problem, this code is telling it not to show anything, so I replaced it with my custom code, and still nothing. PLEASE HELP!! Im running out of hair to pull. Other Questions: * Interested in adding Vimeo to my site. How would I achieve this look http://www.pagelines.com/exhibit/randi-events/? * Love the Social Icon under Header and Footer. But how can I add custom icon links , and move them from the header into one of the the columns in the footer?

Share this post


Link to post
Share on other sites
kastelic    6
kastelic
Try changing this: [code]#primary-nav{ background-image: url('http://irenemolinar.com/wp-content/uploads/2012/01/background11.jpg') repeat-x;}[/code] to this: [code]#nav{ background: url('http://irenemolinar.com/wp-content/uploads/2012/01/background11.jpg') repeat-x }[/code];

Share this post


Link to post
Share on other sites
irenemolinar    0
irenemolinar
Still need a little help with the hover Tried this, but isn't working [code] .sf-menu li, .main_nav ul.sf-menu a:focus, .sf-menu a:hover, .sf-menu a:active { background-color: #f27db4; }[/code] I know that this code edits the nav links [code] .main_nav li a{ padding: 4px 10px; text-decoration: none; display: block; border: 1px solid transparent; border-bottom:none; color:#ffffff; }[/code] so i tried this code [code] .main_nav li a:hover, .main_nav li a:active { background-color: #f27db4; }[/code] but it didnt work either.. Any suggestions.

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  

×