Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • March 21, 2017 at 12:49 pm #764149
    tobee_hh

    Hello, i would like to know how to apply multiple colors in one particular heading or menu item.

    For example:

    “test.entry”

    test should be red and .entry black.

    Thanks :)

    March 22, 2017 at 12:35 am #764468
    Nikko

    Hey tobee_hh,

    You would need to wrap it inside a span tag with and add some class to it then style it (or color it) using css.

    Best regards,
    Nikko

    March 22, 2017 at 10:16 am #764668
    tobee_hh

    Hey Nikko, thanks for the info. How would i do that in this example?

    March 22, 2017 at 10:35 am #764672
    Nikko

    Hi,

    Go to Appearance > Menus > select a menu, on the upper right corner you should see Screen Options, click on it and check CSS Classes. Expand a menu item by clicking on the dropdown icon then on this field CSS Classes (optional) add a class for example myclass. Then on Quick CSS (located in Enfold > General Styling), add this css code:

    .myclass .avia-menu-text {
    color: blue !important;
}

    Just adjust the color as you see fit. Put same css class name on other menu items you want to have same colors. Hope this helps. :)

    Best regards,
    Nikko

    March 22, 2017 at 11:00 am #764697
    tobee_hh

    Hey, this solution would only work if i want to apply one colour to one menu item, right? I want to apply multiple colours to one menu item.

    March 23, 2017 at 6:08 am #765156
    Rikard

    Hi,

    I’m not sure if that is possible, but you could try wrapping the words in spans and assign them id’s or classes like this:

    <span class="my-class">First</span><span id="my-id">Second</span>

    You can then target that class/id to change the colour.

    Best regards,
    Rikard

  • Author
    Posts
Viewing 6 posts - 1 through 6 (of 6 total)
  • You must be logged in to reply to this topic.