Viewing 10 posts - 1 through 10 (of 10 total)
  • Author
    Posts
  • #199775

    http://kec.bz/in/greenbox.jpg

    I am trying to get that desired effect in the top menu, where two items (live chat and contact us buttons) will have little icon graphic and be a different color…. how can i that using css

    thank you

    #199808

    Hey kecster2!

    Edit header.php, find this code:

    /*
                                * Hook that can be used for plugins and theme extensions (currently: the wpml language selector)
                                */
                                do_action('avia_meta_header');
                            echo '</nav>';

    Below, add this code:

    echo "<div class='header-buttons'>";
    						echo "<a href='' class='header-button header-chat'>LIVE CHAT Online</a>";
    						echo "<a href='' class='header-button header-contact'>Contact Us</a>";
    						echo "</div>";

    Edit Quick CSS or custom.css then use this

    .header-buttons {
    position: absolute;
    right: 0;
    border: none;
    }
    
    .header_color .header-buttons a {
    display: block;
    padding: 5px 10px 5px 20px;
    float: left;
    color: white;
    }
    
    .header-buttons a.header-contact{ background: green url(ICON URL HERE) left center no-repeat; }
    .header-buttons a.header-chat{ background: blue url(ICON URL HERE) left center no-repeat; }

    You need to provide your own icon image as background. It should be transparent.

    Regards,
    Ismael

    #199961

    k. i have done everything you said and this is my result

    http://j2k.info/american/

    I need to have those two new items at the top of the page to replace the current ones

    #200058

    can you please help me out..

    #200446

    Hi!

    Please add following code to Quick CSS in Enfold theme options under Styling tab

    .header-buttons { top: 0; }
    .sub_menu { display: none; }

    It should look like this http://i.imgur.com/bSkhdZs.jpg
    Best regards,
    Yigit

    #202296

    it looks great, can i add menu items to the left of that top blue bar …

    http://j2k.info/american/

    #202332

    Hey!

    You can remove following code from Quick CSS

    .sub_menu { display: none; }

    And go to Appearance > Menus and create a new menu, add menu items you would like to display on header meta and check Enfold secondary menu. You may need to adjust the position using custom CSS, let us know and we can help you out

    Best regards,
    Yigit

    #202363

    check it out.. its looking almost there…

    now how can i move all the newly added menu items to the left (left aligned)..
    plus, change the colors of that menu to white

    #202365

    Hi!

    Please add following code to Quick CSS as well

    .sub_menu { left: 0; }
    .sub_menu>ul>li>a { color: white!important; }

    Best regards,
    Yigit

    #202376

    thank you

Viewing 10 posts - 1 through 10 (of 10 total)
  • The topic ‘menu color’ is closed to new replies.