[Theme: Buttercream] Moving the Menu Bar on Top?

Glad you like the theme! There isn’t a way to do this easily but that might make a nice theme option… I’ll consider it for a future release!

hello ,
thank you sixhours for this theme. like you can see in my blog Lolly’s flavours i use your theme in grey and red. I would like to put the sidebar or the menu on the right . Could you help me to do this? I would like change the color of the font ( little bit more dark because my background is almost the same color) and finally could you create a button twiiter, facebook … in the same style of your theme ?

I’m sorry for my bad english.

Best regards.

Lolly

Ps: i would like add music on the left do you think is possible ?

Pretty much everything you want is possible but would require extensive CSS customization. I’d suggest posting your request on jobs.wordpress.net if you’re not familiar with WordPress/HTML/CSS. I am no longer accepting freelance work so unfortunately I couldn’t help with something like this.

an easy way to move the navbar to the top:
(this is best done with a child theme so that future updates won’t erase it, but you could just do it in the original CSS and then never update.)

find this line of code (starts at line 897):

.navbar {
	width: 100%;
	background-color: #593929;
	bottom: 0px;
	z-index: 100;
	padding: 0px;
	margin: 0px;
	border-top: 2px solid #422619;

change “bottom” to “top” in line 900
it should now look like this:

.navbar {
	width: 100%;
	background-color: #593929;
	top: 0px;
	z-index: 100;
	padding: 0px;
	margin: 0px;
	border-top: 2px solid #422619;

that’s it!
one note: it may appear the navbar disappears while you are logged into wordpress. this is due to the small top navbar from wordpress that drops down actually covering the very top of the site and thus the theme navbar. log out of wordpress and you will be able to see the navbar has moved to the top!

it may also behoove you to add some padding to the top so the menu does not overlap the header. i accomplished it thusly:
change the line from

padding: 0px;

to

padding: 10px 0px 20px;

this will add a 10px padding to the top, 0px to the left and right, and 20px to the bottom to space it off the main body. if you wish to have the header touching the main body do this instead:

padding-top: 10px;

hope this all helps!

to see what my site now looks like with these changes, see https://www.billboyles.info

actually i was viewing it wrong so the above code padding fix doesn’t work. it looked like it did when i was logged in, but when i was logged out it didn’t. for some reason i cant seem to delete or edit the comment.

finally fixed the code. here is all the code fixed so nothing overlaps and it all looks decent:

.navbar {
	width: 100%;
	height: 30px;
	background-color: #593929;
	top: 0px;
	z-index: 100;
	padding: 0px;
	margin: 0px;
	border-top: 2px solid #422619;
}
.searchbar {
	float: right;
	padding-top: 4px;
	padding-bottom: 4px;
}
.searchbar input[type="text"] {
	width: 100px;
}
#searchform #searchsubmit {
	width: 22px;
	height: 22px;
	border-radius: 16px;
	border: 0px none;
	border-bottom: 0px solid rgba(51,51,51,.2);
	border-right: 2px solid rgba(51,51,51,.2);
	font-weight: bold;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 10px;
	text-transform: uppercase;
	padding: 0px;
	color: #fff;

sorry for all the posts. if i could find a way to edit old posts i would have just done that. hope this helps everyone!

Any way to move the mobile version of the nav bar to the top?

Clintonjacob, for support with your own issue, create your own thread.