Social Media Buttons in the Top Bar

How can I Add social media Icon Buttons in the top Navigation bar? And how can I align the text in the center of top nav bar in the child theme?

Hi,

You can add [social_buttons] shortcode to the top bar in Theme Settings -> Header -> Top bar. Could you please provide us your website so we can help you with text align?

Regards

It’s under Construction so won’t be able to see the contents. I tried the solution that was mentioned in one of the forums. But it dint work.

Sorry, but we need to see your website live to understand what is wrong.

There is nothing wrong. I just want to change the position of Our Contact on the top nav bar. I know I have to use align tag. but I do not know where do I have to change this setting.

Sorry, but we need to see your website to help you. You can’t use HTML tags in the top bar menu.

I would like to change the position of social media icons on the top nav bar. I have user [social media] shortcode in the Top Bar Settings and the icons appear on the left in the top Nav bar.

To prepare a CSS fix for your website, we need to see it. See its HTML structure.

ok. You have a look at it and help me out with it.

Can you also check Contact Us Page on the Main Menu Header? The Map does load up and it says javascript error. And the Text above the Contact form is not visible on the main website whereas it is visible in the Visual Composer page.

Attachments:

You must be logged in to view attached files.

So how do you want to position social buttons?
As for google map, be sure that you have added a Google map api key in Theme Settings -> General.

Regards

I want the Social Button on the right side of the Top Nav Bar. I also want website name in the center of the top nav bar which links back to the home page.

I also want to change the color of the top nav bar. Same yellow shade as the Color of logo in my website.

We can set your social buttons to the right, but in this case, the right menu will be hidden. And there is no any additional text area.
The color you can change in Theme Settings -> Header -> Top bar.

Regards

Yes, that will be great. You can hide the write menu and set the social button on the right. Can I add the Website Name in the text area where the [social button] shortcode is mentioned with some spacing between text and shortcode making the text appear in the center and social button on the right side?

I added the Google Map Api in the Theme Settings>General. I also changed the iframe in the visual composer. But the website still show the default Mao of Osla. Please help me out with it.

Here is a code to move social icons to the right. Unfortunately, you can’t place additional texts there.

.top-bar-right {
	display: none;
}

.top-bar-left {
	text-align: right;
}

Did you set google map geolocation coordinates to your own?

Yes I have changed it to my location.

and where do I have to copy the code to?

Can we log into your admin access and check the location? Copy the code to the Custom CSS field in Theme Settings.

Yeah, you can.

Can we manage to add space between the red marked thing in the image below? I want the text in the center of top bar.

Attachments:

You must be logged in to view attached files.

As we can see, you didn’t set your location coordinates. And it is not required to add visual composer google map inside our own map.

The text next to the map which consists of address and contact detail is also not visible on the main website, whereas it is visible in the visual composer page. Can you have a look at that also?

Yes, you already asked this question. It is not visible because the row containing this text is marked as “Disabled” with Visual Composer.

how do i enable that row?

Thanks for helping me out. I understood what all changes were required and changed it. Now the map is also visible and the text is also visible.

Great, you are welcome!

what do you have to say about Reply #15902? Is it possible?

Sorry, try to add the following custom CSS

.topbar-wrapp .social-icons {
	margin-left:15px;
}

[Author]

Posts