Docs

[inextroverted]

HI – I really like the http://theme.co/x/ opening page with the fully extended menu bar. Can you tell me how to do this and how to change colour of the letters etc.

Thanks

[inextroverted]

Also how can I change the font size and colour of the top bar. thx

[Prasant Rai]

Hello There,

Thanks for writing in! To assist you with this issue, we’ll first need you to provide us with your URL. This is to ensure that we can provide you with a tailored answer to your situation. Once you have provided us with your URL, we will be happy to assist you with everything.

Thanks.

[inextroverted]

Hi – http://ayurvedaritualstoronto.com/

[Rupok]

Hi there,

Thanks for writing back.

You can add this under Custom > CSS in the Customizer.

@media only screen and (min-width: 980px) {
.x-navbar-inner > .x-container.max.width {
  width: 100%;
  max-width: 100%;
}
}

.masthead-stacked .desktop .x-nav {
  display: block;
  width: 100%;
}

.x-navbar .desktop .x-nav > li {
  width: 14%;
  text-align: center;
}

To change the background, color and font size of topbar :

.x-topbar {
  background-color: #1f2c39!important;
}

.x-topbar .p-info {
  color: #fff !important;
  font-size: 13px;
}

Hope this helps.

Cheers!

[inextroverted]

Awesome – a couple more things

1) The shopping cart and search boxes became huge – how about the background colour of the nav bar, and also the top height of my logo (in the customizer I can’t seem to get it less than what it is now even tried putting in negative numbers), lastly can I make the background area of the logo different as well, and can I put my logo in the top bar?

Thx

[inextroverted]

Just to clarify – best case scenario I’d like the woocommerence shopping cart logo/symbols to be inline with my logo that is stacked above the nav bar.

[inextroverted]

Sorry – one more can I get my nav bar/masthead area to remain full width but the content layout below it to be boxed following the customizer layout/design section?

Thank you and please!

[Friech]

Hi There,

To adjust the shopping cart menu item you can add this under Custom > CSS in the Customizer.

.x-navbar .x-nav > li.x-menu-item-woocommerce > a .x-cart {
	font-size: 10px;
    margin-top: 4px;
}

You can change the Navbar and Logobar Background color on Customizer under Renew panel look for the Navbar Background and Logobar Background option.

You cant adjust the logobar without resizing the logo itself, you can add this custom css

@media (min-width:  980px) {
	.x-navbar .x-nav > li.x-menu-item-woocommerce > a .x-cart {
	font-size: 10px;
    margin-top: 4px;
	}

	.x-logobar .x-container.max, .masthead-stacked .x-brand {
		  max-height: 50px;
	}

	.x-brand img {
		  width: 230px;
		  vertical-align: top;
	}
	.x-main.full, footer.x-colophon, .x-slider-container {
		max-width: 90%;
    	margin: 0 auto;
	}
}

Sorry, but moving the shopping cart menu item to the logobar requires a custom development that fall outside of support we can offer.

The last block of custom css above is for boxing your site content.

Hope it helps, Cheers!

[Author]

Posts