Docs

[Jason]

Im not sure i understand by bumping. How do I identify the number of my mdnu item

Eg .current-menu-item.menu-item-187 a {
box-shadow: none !important;
}.

There is menu-item-187

[Jason]

Can i take a look of some of the sites that use X?

I’m disappointed with X and im disabling it and using thr Sydney theme because i find that more appealing.

In the site title , my site shows Adeford | Empower Innovation . But i want it to show Adeford – Empower Innovation. How do i accimplish that ?

Also , how do i identity the number of my nav bar menu item?

Happy New Year, by the way!

[Rad]

Hi there,

You’ll have to use browser developer tools and inspect your site’s element. Example, you can see something like this

<li id="menu-item-7701" class="x-megamenu col-4 menu-item menu-item-type-post_type menu-item-object-page current-menu-item page_item page-item-259 current_page_item menu-item-has-children menu-item-7701">........</li>

This id="menu-item-7701" means #menu-item-7701, and class="...menu-item-7701..." means .menu-item-7701

Hence you can do it in either of this CSS, because these are both the same

.current-menu-item.menu-item-7701 a {
box-shadow: none !important;
}

#menu-item-7701.current-menu-item a {
box-shadow: none !important;
}

About the title, you should install any SEO plugin and change its format. Like SEO Yoast, the theme has no direct capability to alter those formats, it only displays the title supplied by the system.

Thanks!

[Jason]

Thanks a ton! May i know of few sites that use the X theme, so that i may gathet inspiration from them?

I’m sorry, i keep on asking you the same question, but please help me all that you can .

Please tell me how i can make a site like the screenshots

I also didn’t mean my seo title! I meant my title shown on a browser window

Please take a look at my site. It has Astrid theme installed and I want my site with X to be exactly like that! It’s so cool. Just take a look at my site now. Look at the button too!

I also wanr to makw a site like the last screenshot (from vidiseo.com)

[Rue Nel]

Hello There,

Thanks for updating in and for sharing some screenshots. You can check several sites using X and have some inspiration by check ing out our X Theme Showcase section. You can visit it here: https://theme.co/x/showcase/

Hope this would help.

[Jason]

I’m sorry, i keep on asking you the same question, but please help me all that you can .

Please tell me how i can make a site like the above screenshots

I also didn’t mean my seo title! I meant my title shown on a browser window

I also want to make a site like the last screenshot (from vidiseo.com)

[Christian]

What you want to achieve in your screenshots are technically possible but would require some customization which is outside the scope of our support. You might want to contact our trusted partners who caters X setup and customization needs. Please see https://community.theme.co/custom-development/

Regarding the window title, X uses the dash (-) as separator and not the pipe (|) so what you see in your site is not a part of X. See the attachment.

I recommend that you take some time to go through our Knowledge Base to know how X and Cornerstone works and see all the features you can use.

Thank you for understanding.

[Jason]

Hey thanks! Happy new year!

1.). See , currently for my homepage, i use the Layout Fullwidth template. And i have updated the css code to make the nav bar transparent. But i dont want a container element. I want it to be plain and clean like the latter part of howtowebby.com . But when i update the template to no container Header and footer, the text overlaps the nav bar! Please help.

Can you login to my site and update the code and notify me of the changes that you have applied.

2.)Also remember the button tgat you had created for me? Will i be able to create a similar button by usjng one of the button styles in my Customizer

3.) I also do not like the mobile nav bar option. See screenshot. Can I change it to some other design

[Rue Nel]

Hello There,

Thanks for writing in!

1] The text overlaps the navbar because you have added this custom css code:

.x-navbar {
    position: absolute;
    width: 100%;
    background-color: transparent !important;
    box-shadow: none;
    border: 0;
}

If you change the position from absolute to relative, the issue should be resolved.

2] You can use the transparent regular button to have the same effect as the button you have created for the navbar.

3] Could you please send us some example or screenshots of how the mobile navbar will look like?

Please let us know how it goes.

[Jason]

sure! thanks a lot. screenshots will come a bit later

[Rue Nel]

You’re most welcome.
If you need anything else we can help you with, please let us know.

[Jason]

Here are the screenshots . I dont much like the deisng of the nav bar on a mobile device. Any tips on how to change the look of it. I want the little nav bar toggle to look something like premium.wpmudev.org

[Joao]

Hi There,

Please add the following code to Appereance | Customizer | Custom | CSSS

.x-btn-navbar, .x-btn-navbar.collapsed {
    background: none;
    box-shadow: none;
}

@media(max-width: 769px) {
.x-navbar {
    background-color: white;
} }

Hope that helps

Joao

[Jason]

Thanks. It really helped!

One last thing in this topic . My nav bar is transparent. I have enabked an option for that.

On large devices (laptops, desktops) i want the nav bar to be transparent. The nav bar link colour is black, but in mobile devices, i want the font colour for thr nav bar links to bd white but with a black background! Is that possible!

[Joao]

Hi There,

It is possible, but your logo is also black. so it will disappear on it.

My reccomendations for you to build a website that looks good at this stage is to keep stuff simple, we can help you with whatever you need, but keeping things simpler will help you achieving better results than trying to overthink every single thing.

To achieve what you are looking for update this :

@media(max-width: 769px) {
.x-navbar {
    background-color: white;
}} 

To this:

@media(max-width: 769px) {
.x-navbar {
    background-color: black;
} 
.x-navbar .desktop .x-nav>li>a>span {
    color: white;
}
}

Hope it helps

Joao

[Author]

Posts