Reykjavik theme – Adding Social Network Links and Icons

Home Forums Reykjavik Reykjavik theme – Adding Social Network Links and Icons

Viewing 2 posts - 1 through 2 (of 2 total)
  • Author
    Posts
  • #21110

    Jose_Luis
    Participant

    Reykjavik theme – Adding Social Network Links and Icons

    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 →

    Hello,

    I’ve followed the steps in the user manual

    ** https://webmandesign.github.io/docs/reykjavik/#social-links
    ** https://support.webmandesign.eu/how-to-set-a-custom-social-icon/

    to add a New Link and Icon I’ve..
    1) Created a submenu in my Social Menu with de class multiestetica-icon
    2) Created the Aditional CSS showed above.

    — I am not able to see the icon (.svg, .png or whathever), although it does work changing the background color or putting a text.

    Regards and thanks for your help

    /* Uso de fuente de iconos*/
    .social-links .multiestetica-icon a::before{
    	font-family:'fontello';
    	/* Icono a usar dentro de la fuente. */
    	content: '\e999';
    }
    
    /* Ocultamos el icono por defecto, si el tema usa iconos SVG*/
    .social-links .multiestetica-icon svg{
    	display: none;
    }
    
    /* Forma alternativa de usar una imagen de icono: */
    .social-links .multiestetica-icon a::before { 
    	content: '';
    	display: inline-block;
    	width: 24px;
    	height: 24px;
    	background-image: url('./images/multiestetica.sgv');
    background-position: 50% 50%;
    background-repeat: no-repeat;
    	background-size: contain;
    }
    • This topic was modified 3 weeks, 3 days ago by  Jose_Luis.
    • This topic was modified 3 weeks, 3 days ago by  Oliver Juhas. Reason: Formatting code
    #21114

    Oliver Juhas
    Keymaster

    Hi Jose_Luis,

    In your custom CSS code you are declaring content: '\e999'; first but then you are overriding it with content: ''; below.

    To resolve the issue, try to put your /* Uso de fuente de iconos*/ CSS code to the bottom of your CSS code so it takes priority.

    If you are still experiencing an issue, please provide URL to the affected page so I can check personally.

    Best regards,

    Oliver Juhas
    WebMan Design

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

You must be logged in to reply to this topic.