Custom Icon in Theme 'Reykjavik'

Home Forums Reykjavik Custom Icon in Theme 'Reykjavik'

Viewing 7 posts - 1 through 7 (of 7 total)
  • Author
    Posts
  • #19880

    wuesl
    Participant

    Custom Icon in Theme 'Reykjavik'

    Resolved

    Hey there! Have you noticed this support service is provided FREE of charge?
    If you like the speed and accuracy of resolutions, please consider supporting me with a small donation. Thank you

    Consider a donation →

    Hi Oliver,

    does the theme ‘Reykjavik’ has the possibility to upload Custom Icon Fonts?
    I guess not.

    Though the same issue like the theme ‘receptar’, isn’t.

    There you recommend the “Alternative way of using an icon image”.

    But where do I get the icons from that look like svg generated ones?

    Thanx
    Ulrich

    #19881

    Oliver Juhas
    Keymaster

    Hi Ulrich,

    You can use a 3rd party plugin such as https://wordpress.org/plugins/ionicons-official/

    If you mean social icon, please check the knowledge base article.

    Best regards,

    Oliver Juhas
    WebMan Design

    #19892

    wuesl
    Participant

    Hi Oliver,

    Thank you.

    The plugin isn’t tested very well.

    I prefer the “upload the image icon” method. Where can I get the images grom that fit the ones you are using?

    Thanx

    Ulrich

    #19893

    Oliver Juhas
    Keymaster

    Hi Ulrich,

    But you can use any plugin actually, that was just an example.

    Where can I get the images grom that fit the ones you are using?

    You haven’t actually specified what icons you mean. If you mean the 3 icons in widgets below the video at https://themedemos.webmandesign.eu/reykjavik/ than these are included within the theme. It’s Genericons Neue icons set. Please install the theme demo content to see how they are being used – basically all you need to do is to set the correct icon CSS class, such as:

    Best regards,

    Oliver Juhas
    WebMan Design

    #19894

    wuesl
    Participant

    Hi Oliver,

    I am talking about the icons of the social menu.

    I would like to add a telefon number with a telefon icon.

    How can I do this?

    Greetings
    Ulrich

    #19896

    wuesl
    Participant

    Hi Oliver,

    as you see now I managed to a telephone symbol to the social menu from ‘Neue Genericons’.
    But the symbol is bound to the ‘li’ tag instead of bound to the ‘a’ tag.

    Is there a solution?

    I also installed the awesome font plugin. But until now I didn’t managed an icon from the social menu. How can I do this?

    Thanx
    Ulrich

    #19898

    Oliver Juhas
    Keymaster

    Hi Ulrich,

    Social icons works differently in the theme, actually. It is not an icon font but SVG images. WordPress won’t let you upload SVG due to security reasons. So, the only way to set up custom social icons SVG images is via PHP code in your child theme.

    However, as you set an icon font CSS class on the social menu item, you can propagate the icon to be displayed on the actual link instead of the list item using custom CSS (here is an example for Genericons Neue phone icon):

    .menu-item.genericons-neue a::before {
    	content: '\f437'; /* Set this according to your icon font stylesheet. */
    	font-family: 'Genericons-Neue';
    	font-style: normal;
    	font-weight: normal;
    	font-variant: normal;
    	text-decoration: inherit;
    	text-transform: none;
    	speak: none;
    }
    
    .menu-item.genericons-neue::before,
    .menu-item.genericons-neue svg {
    	display: none;
    }

    I will consider adding the telephone icon to social icons set in next theme update.

    Best regards,

    Oliver Juhas
    WebMan Design

Viewing 7 posts - 1 through 7 (of 7 total)

You must be logged in to reply to this topic.