Top Bar Contact Link

Support
#1

Hi there,

I need help formatting a contact link in my top bar. I have it set up now but I’d like for it to be bigger and maybe with an email icon if that’s possible. I’ve read some threads about how to add the mail icon through the FTP (in the social icons) but I don’t have access to that for this site. I’m curious if there’s another way to do that.

When I’ve tried to apply sizing to the type it works but then it throws off the alignment. Ideally I’d like “Contact Us” to be the same size as the menu type and right aligned.

Thanks for your help!

#2

Hi there,

Kindly add the CSS code below to X > Launch > Options > CSS:

.x-topbar-inner .p-info b {
	font-family: "Montserrat",sans-serif;
    font-style: normal;
    font-weight: 400;
    letter-spacing: 0.085em;
    text-transform: uppercase;
    font-size: 12px;
    line-height: 1;
}

.x-topbar-inner .p-info b:before {
    content: "";
    display: inline-block;
    font-family: "FontAwesome";
    font-style: normal;
    font-weight: normal;
    text-decoration: inherit;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    margin-right: 5px;
    font-size: 15px;
}

To find the correct selector of the CSS code above I used the Google Chrome developer toolbar. For more information:

And to find the list of font icons available in the theme I sued the page below:

http://demo.theme.co/integrity-1/shortcodes/icons/

Please consider that this type of requests is considered as a custom development, so we can not maintain the suggested code, we only can tell how we achieved that code so that you can have a path for further customization by yourself.

Thank you for your understanding.