4 replies to this topic

[acastrolorenzo]

Please Login or Register to see this Hidden Content

 

Please Login or Register to see this Hidden Content

  39.67K   26 downloadsHi everyone,

 

Lets see if you can help me with this customizations, I´ve an header done, where I´d like to do the following customizations:

 

- To include the social media buttons inside the nav bar

- To include an image on the header apart from the main logo

- To change the nav bar font 

- To change one of the links colour (from the nav bar)

 

I´ve attached an image with the current header and the desired design.

 

The website is: www.ouyapro.com and the password 0075

 

Let me know if this is possible, any help will be grateful!.

 

Thanks in advance

[Danny]

Hi,

 

1 & 2. In order to add social media icons to your NavBar you will require the help of a hook. I recommend you install the free plugin called ActionMap from the PageLines store.

 

3. The font of the navigation can be changed in the Typography settings.

 

4. To change one of the links, you will need to target that menu item (all menu items are given unique ids) and use custom CSS.

 

I have provided you with a link to our custom CSS documentation which should assist you.

 

If you're not comfortable with custom CSS or using hooks, I would suggest contacting one of our Pros, who will be able to assist you.

 

Please Login or Register to see this Hidden Content

[acastrolorenzo]

Ok thanks! 

[acastrolorenzo]

Hi Danny,

 

I´ve installed and activated Action Map, but I cannot see any change when Im logged... what should I do to put the social media buttons inside the nav bar?.

 

About the custom ID of the menu.. where can I see that? and how can I modifify the colour, typo of it?.

 

Sorry if they´re noob questions,

Thanks

[Danny]

The ActionMap is a plugin that assist you in finding the correct location, it doesn't do anything other than that. Once you have find the correct hook location using Action map, you use this to create your hook.

 

In your code, you will need to most likely use this:

Please Login or Register to see this Hidden Content

 

In order to find your menu's ID to style that particular menu, you need to use either Firebug or your browsers built-in web dev tools, see my image below as an example.

 

Please Login or Register to see this Hidden Content

You can use the ID, in your code for example,

 

Please Login or Register to see this Hidden Content