Viewing 11 posts - 1 through 11 (of 11 total)
  • Author
    Posts
  • December 2, 2021 at 11:28 pm #1331362
    Robeare

    Hi,

    I have followed the instructions from this thread https://kriesi.at/documentation/enfold/social-share-buttons/#how-to-add-custom-social-icons-to-enfold-options but am having my custom icon showing up and instead have a pencil icon.

    Here is the code I have inserted

    	// Register new icon as a theme icon
function avia_add_custom_icon($icons) {
	$icons['Google'] = array( 'font' =>'fontello', 'icon' => 'uF1A0');
	return $icons;
}
add_filter('avf_default_icons','avia_add_custom_icon', 10, 1);

// Add new icon as an option for social icons
function avia_add_custom_social_icon($icons) {
	$icons['Google'] = 'google';
	return $icons;
}
add_filter('avf_social_icons_options','avia_add_custom_social_icon', 10, 1);
    December 4, 2021 at 1:56 pm #1331539
    Mike

    Hey Robeare,
    Thank you for the link to your site, I believe your function should look like this:

    // Register new icon as a theme icon
function avia_add_custom_icon($icons) {
	$icons['icon-google'] = array( 'font' =>'fontello', 'icon' => 'uf1a0');
	return $icons;
}
add_filter('avf_default_icons','avia_add_custom_icon', 10, 1);

// Add new icon as an option for social icons
function avia_add_custom_social_icon($icons) {
	$icons['Google'] = 'icon-google';
	return $icons;
}
add_filter('avf_social_icons_options','avia_add_custom_social_icon', 10, 1);

    If this doesn’t help please include an admin login in the Private Content area so we can be of more assistance.

    Best regards,
    Mike

    December 6, 2021 at 10:03 pm #1331762
    Robeare

    Hi @Mike,

    I went head and added the code. It still looks to be a pencil on my end. How does it look in yours?

    December 6, 2021 at 10:03 pm #1331763
    Robeare

    Thanks Mike, I got it to work. I need the icon to have a hover background and it seems the css I have isn’t applying. 

    #top #wrap_all .av-social-link-google:hover a{
    color:#fff; 
    background-color: #9fae37; 
}
    December 7, 2021 at 5:19 am #1331789
    Rikard

    Hi,

    Thanks for the update. Please try this CSS instead:

    li.av-social-link-google:hover {
    color:#fff; 
    background-color: #9fae37; 
}

    Best regards,
    Rikard

    December 7, 2021 at 9:28 pm #1331898
    Robeare

    Thanks for the updated code, on mu end it is still not applying… Is it showing on your end?

    December 8, 2021 at 6:36 am #1331930
    Rikard

    Hi,

    No it’s no applying on my end either, where exactly did you add it? I checked a bit closer and the CSS you first posted should work, not the CSS I posted. If you need further help, then please include admin WordPress login details in private.

    Best regards,
    Rikard

    December 8, 2021 at 8:29 am #1331937
    Guenni007

    And you realy uploaded a fontello font to your enfold?
    the font is called fontello – that is what you can see on the enfold options page:

    because default font-name of enfold included fonts is entypo-fontello.
    if you have generated it on fontello.com all zip files will have a fontello-name – besides that you had to put in a font-name there on generating. This inserted font-name will be the one shown on that enfold-list.

    December 8, 2021 at 12:47 pm #1331957
    Rikard

    Hi,

    Thanks for helping out @guenni007 :-)

    Best regards,
    Rikard

    December 8, 2021 at 11:00 pm #1332037
    Robeare

    I added the css to enfold Quick CSS in the enfold settings. I have attached the login info below.

    December 9, 2021 at 6:50 am #1332067
    Rikard

    Hi,

    Thanks for that. I adjusted the code a bit in Quick CSS, and it’s applying now. Please review your site.

    Best regards,
    Rikard

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