IMPORTANT SUPPORT CHANGE:

Due to Ticksy platform technical issues, starting on 1st October 2017, we are closing this Ticksy account (at https://webmandesign.ticksy.com) in favor of our own https://support.webmandesign.eu

This will affect support provided for our Icelander, Monument Valley and Polyclinic WordPress themes.

Unfortunately, it is not possible to move tickets from Ticksy platform to our own support forum and once we close our Ticksy account, all of the data will be deleted on the Ticksy servers, including our customers accounts. However, please note that all the tickets here on https://webmandesign.ticksy.com were successfully resolved and closed.

Please do not open any new tickets here and use https://support.webmandesign.eu instead.

Thank you for understanding!
We are really sorry for inconvenience caused!

Take me to new Support Center

Okay
  Print

How to set a custom social icon?

In case you would like to set up a custom social icon that is not included with your theme use a custom CSS coding:

  1. First you will need to import your custom icon(s) as a content icon font. You will find the instructions for the procedure in your theme's documentation. (If your theme does not support custom icon font, you will need to use the image icon procedure below.)

  2. Then add this CSS code into your website (please edit the code to your needs):

    /* Using icon font: */
    .social-links .my-social-icon a::before {
        font-family: "fontello";
        /* Icon glyph code. Change it to your needs. */
        content: "\e999";
    }
    .social-links .my-social-icon svg {
        /* If the theme uses SVG icons, we need to hide the default one. */
        display: none;
    }
    /* Alternative way of using an icon image: */
    .social-links .my-social-icon a::before {
        content: '';
        display: inline-block;
        width: 24px;
        height: 24px;
        background-image: url('URL_TO_YOUR_ICON_IMAGE_HERE');
        background-position: 50% 50%;
        background-repeat: no-repeat;
        background-size: contain;
    }

    The "fontello" in the code above tells browser to use an icon from your custom content icons set (which is a font, basically).

    Then you need to set the correct icon glyph code so the correct icon is displayed. You can obtain the glyph code from Fontello when you were setting your custom icons set or simply click the "To display the icon font, please, use this CSS file:" link provided at Appearance » Icon Font page (your theme has to support custom icon font upload) and search for the desired icon there.

  3. Finally, you need to set up your custom CSS class you've used above (the my-social-icon class) for the social menu item:

    Setting up a custom social menu icon class

That's it. You custom social icon should now display in a social menu on your website.