[ashafeiParticipant]

Hello,

I have tried doing the following: <i class=”x-icon x-icon-home”></i>

But it doesn’t seem to work. When I inspect the page in chrome it shows that the size is 0x0. I have tried changing the size to fa-lg and still not working.

In Addition, I have tried to remove the menu borders but that didn’t work either (custom>CSS):

.x-navbar {
border-bottom: none;
box-shadow: none;
}

I must be doing something wrong but I wanted to check before I play with the CSS files.
I do have the child theme installed (Could that be the issue?)

[ChristianModerator]

Hey there,

Would you mind providing us with login credentials so we can take a closer look? To do this, you can make a post with the following info:

– Link to your site
– WordPress Admin username / password
– FTP credentials

Don’t forget to select Set as private reply. This ensures your information is only visible to our staff.

Thanks.

[ashafeiParticipant]

This reply has been marked as private.

[Rue NelModerator]

Hello There,

Thanks for providing the access to your site.

To remove the border in your menu items, please add the following css code in the customizer, Appearance > Customize > Custom > CSS

.x-navbar .desktop .x-nav>li>a {
    border: none !important;
}

When you add an icon code <i class="x-icon x-icon-home"></i> in your menu items, it will not work just yet. Please enable first the Legacy font classes by going to Settings > Cornerstone or if you are using the latest version of Cornerstone, please go to Cornerstone > Settings.

Temporarily, you can please add the following css code in your child theme’s style.css

.menu-item .x-icon-home:before {
    content:"\f015";
}

Hope this helps.

[ashafeiParticipant]

Perfect… The menu borders are removed… Thank you.
How can I align it to the left?

Thank you

[ashafeiParticipant]

Hello,

– Cornerstone > Settings doesn’t have the option to enable Legacy font classes. How can I enable it to be able to use other icons besides the home icon?

– Is there a way to align the entire menu to the left?

Thank you in Advance.

[FriechModerator]

Hi There,

With the latest X|Theme, legacy font classes is enable by default. See your menu blog item, I added a home icon there.

Please update your X|Theme to the latest version as you already have the latest Cornerstone to avoid compatibility issue.

You can add this under Custom > CSS in the Customizer to float the menu on left side.

.masthead-inline .desktop .x-nav {
	float: left;
}

Hope it helps, Cheers!

[ashafeiParticipant]

Thank you.. the float works fine…

I have updated the theme.
Still the only icon that works is the home icon!!!

I tried changing the icon from the menu section, but it’s not working. This is what I have now: <i class=”x-icon x-icon-bullhorn”></i> Blog

[ChristopherModerator]

Hi there,

Please check this link to learn how to add icons to your page :

https://theme.co/changelog/#theme-4-0-0

Hope it helps.

[ashafeiParticipant]

Would you please give me an example. i.e. how do you add this icon to a menu link: Unicode: f075 <i class=”fa fa-comment”></i>

[FriechModerator]

Hi There,

Simple replace the class prefix fa with x-icon

<i class="x-icon x-icon-comment"></i>

Hope it helps, Cheers!

[ashafeiParticipant]

Thanks Friech… I have added it but still not working. I’m not really sure what am I doing wrong. Check out the screen shot.

[FriechModerator]

Hi There,

You did great, it is just the issue becoming weird. The latest version of X/Cornerstone should give you the icon with just the class, and this is true when I first check your site (see my reply above).

But now it rely on the data-x-icon attribute.

<i class="x-icon x-icon-comment" data-x-icon="&#xf075;"></i>

Please delete the Cornerstone via FTP and re-install it, it should be updated to 1.2.3 at the same time.

Thanks.

[ashafeiParticipant]

Excellent. Thank you for all of your help..

[ChristianModerator]

You’re welcome. Glad we could help. 🙂

[Author]

Posts