Action bar change color and aligment

compartamos

Good day

Can you please help me out to make the following:

on the page:

http://142.4.27.210/~enfoke/

change completely the action bar appearance:

a) align text on the right

b) Font size H2

c) yellow background

d) change color of phone icon to red

e) font color red

be able to add a third phone number with its phone icon or remove the href:tel so it has no links, and probably the phone icon itself since i have 3 numbers to place there.

thanks in advance for the help.

appreciate your time.

compartamos

sorry i forgot i want to add also an image up there one more image like a language flag. also would be cool to have the exact height of this bar controlled.

Albert

Hi,

1) To align action bar content to the right, you need to use the following css:

#Action_bar .contact_details { float: right !important; }

2) Heading font size can be changed under Theme Options > Fonts > Size & Style section.

3) What about "yellow background"?

4) Icon colors in Action Bar can be changed with the following css:

#Action_bar .contact_details i { color: #000 !important; }

5) All other details about changing color in Action Bar, you can find on http://forum.muffingroup.com/betheme/discussion/409/changing-social-icon-and-action-bar-icon-colors

6) These flags comes with WPML plugin so to get those images, you need to use WPML.

Learn more: Video Tutorials | How To | FAQ Vote on what comes next

compartamos

hey thanks you the man!

can you please help me out adding a third phone also with the phone icon for the 01800 number?

thanks again in advance for the time and help.

compartamos

as phone 2 on the action bar ive instered the following:

+52 (81) 12 34 45 93  Lada sin costo (01) 800 831 7093 <a href="http://142.4.27.210/~enfoke/home-2/"><img src="http://142.4.27.210/~enfoke/wp-content/uploads/2016/12/USAFlag50.jpg"></a> <a href="http://142.4.27.210/~enfoke/"><img src="http://142.4.27.210/~enfoke/wp-content/uploads/2016/12/mexfl50.jpg">

the thing is when i see the page theres is are some extra characters "> just after the second phone icon...

how can i get rid of them? and also addd a third phone icon to the 1 800 number?

thanks

compartamos

i forgot to mention i have this custom css inserted on betheme css 

#Action_bar .contact_details { float: right; !important; } 

#Action_bar .contact_details li { color: #fff; !important; }

#Action_bar .contact_details li a { color: white; }

#Action_bar .social li a { color: white; }

Albert

Adding additional phone number requires files customization what in reference to Item Support Policy is not allowed. So if you want to modify files and don't know how, you should contact with your web developer. Or if you don’t have any, we recommend to try the offer of solid and reliable customization experts WP Kraken.

P.S. For the Action Bar is responsible includes/header-top-area.php file.

Learn more: Video Tutorials | How To | FAQ Vote on what comes next

compartamos

on the action bar there are some extra characters "> just after the second phone icon... how do i remove them?

Albert

You got them because of your files customization and we suggest to check the code you used.

Learn more: Video Tutorials | How To | FAQ Vote on what comes next