This thread is over two years old and may be outdated. Please create a new thread if you need help, or email us if you have an active Premium license.

Theme/Plugin conflict: menu icon

Resolved 5 replies themetheme-vantage
11 years ago · Last reply by Andrew Misplon 11 years ago

I’m using the Vantage theme on my site, and I think I may have a CSS conflict with one of my plugins (All-in-One Event Calendar by Time.ly). I am using menu icons on each page in my site, but the Calendar page is the only one where the menu icon won’t show up. I am not a programmer, but I know enough HTML to have found (in my browser’s inspector):

where it should be:

But I don’t know enough to figure out how to fix it. Anyone know how to remedy this?

Many thanks!

This is our free support forum. Replies can take several days.

Need fast email support? Get SiteOrigin Premium

Replies

5
  1. thesixthpoint 11 years, 9 months ago

    Oops, apparently I don’t even know how to include code in a post…

    I found:
    span class=”icon”></span

    (or replace "calendar" with the name of any other icon in the set)

  2. Andrew Misplon Staff 11 years, 9 months ago

    Is the site live? Might be able to help with CSS. Please send me a link if it is.

    • thesixthpoint 11 years, 9 months ago

      Hi Andrew,

      Thanks for your quick response. The site is not live yet. Is there a way to PM you login credentials?

  3. Andrew Misplon Staff 11 years, 9 months ago

    For sure, send them through to [email protected].

  4. Andrew Misplon Staff 11 years, 9 months ago

    I’ve resolved the issue for you. For reference. There are two conflicts we’ve seen with All In One Event Calendar. The widget does not function correctly in Page Builder. However it can still be deployed to a page not using Page Builder. In this case the second conflict was the page where the plugin was deployed to refused to show it’s menu icon selected for that page. We resolved using the following Custom CSS:

    .main-navigation .icon {
    color: #CCCCCC;
    display: inline-block;
    font-size: 16px;
    line-height: 0.5em;
    margin-right: 15px;
    }
    .main-navigation .icon:before {
    content: "\f073";
    font-family: FontAwesome;
    }

    The was still being inserted in the menu item, just the calendar class suffix was missing. So we used the class that was there .icon to deploy the desired icon, in this case a calendar: http://fontawesome.io/icon/calendar/.

Replies on this thread are closed.

Please create a new thread if you have a question, or purchase a SiteOrigin Premium license if you need one-on-one email support.

Have a different question or issue?

Start New Thread