Viewing 10 posts - 1 through 10 (of 10 total)
  • Author
    Posts
  • #1208027

    I want to add the social icon for houzz.com to my social profile but it is not available in the dropdown list. I searched fontello and it is not part of the “Entypo” font you guys include, however it is in the “Font Awesome” fontello font. Is there a way I can add this icon to the dropdown list? I’m pretty savvy with traditional web development so even if its complicated, I can handle it.

    • This topic was modified 4 years, 6 months ago by milkytech. Reason: added temp wp-admin login for enfold admin
    #1208423

    Hey milkytech,

    You can download the houzz icon in fontello: http://fontello.com/
    Then upload it in Enfold > Import/Export > Iconfont Manager.
    You can check further instructions here: https://kriesi.at/documentation/enfold/icon/#adding-your-own-fontello-or-flaticon-icons-

    Best regards,
    Nikko

    #1208439

    perhaps I should have clarified. I am wanting to add this custom icon to my social profile so it can be displayed and linked along with my other social icons in the footer socket. I am not able to edit the socket using the advance layout builder (as far as I know) so this method doesn’t help me although I have uploaded my custom icon using this method so now I just need to figure out how to substitute my custom icon for a different icon that I am not using.

    #1208454

    I got it done. In case anyone else needs to do this, this is how I did it:

    1. added 'Houzz' => 'houzz', to the array on line 4460 in the file: register-admin-options.php (this adds Houzz to the Social Icon dropdown list in your Social Profiles in the theme editor)
    2. created a custom houzz icon based on the new logo (the available icons out there were the old logo) using illustrator.
    3. at fontello.com imported the installed theme entypo-fontello config.json file (\wp-content\themes\enfold\config-templatebuilder\avia-template-builder\assets\fonts) then added the .svg file I just created in illustrator and downloaded the new font with the same name (entypo-fontello) that is the exact same font as previously installed but with the addition of my custom icon. Upload the 5 new font files downloaded from fontello and overwrite the installed files including the config.json.
    4. drop one of the new font files into the website fontdrop.info to get the unicode of the new icon. use this unicode to add to the arrays in both of these files in the same font folder: charmap.php and charmap-compat.php. (I have no idea if this is necessary but can’t hurt)
    5. added 'houzz' => array( 'font' =>'entypo-fontello', 'icon' => 'ue92d'), to the array at line 245 approx in the functions.php file.
    6. thats it! now you can choose your new icon from the dropdown list and add it to your social profile to use in the footer socket or wherever else you need it.

    There is a good chance this will break with a theme update so just keep track of these php edits and keep a copy of the new font incase it needs to be uploaded again in the future.

    You can see the finished product in the socket of my website: https://golden-painting.com (eventually to be moved over to the domain that currently hosts an html site – avayoupaint.com)

    #1208994

    Hi milkytech ,

    There’s a hook you can use for it avf_social_icons_options, you can add this code in functions.php of your child theme instead:

    function avia_add_custom_social_icon($icons) {
    	$icons['Houzz'] = 'houzz';
    	return $icons;
    }
    add_filter('avf_social_icons_options','avia_add_custom_social_icon', 10, 1);

    Best regards,
    Nikko

    #1209006

    cool, thank you

    #1209008

    Hi,

    Did you need additional help with this topic or shall we close?

    Best regards,
    Jordan Shannon

    #1209012

    Following up on Nikko’s hook, I found this thread and so here is the code you can add to the child theme functions.php so it doesn’t break with theme updates. This code is for multiple icons so edit as necessary (also, probably best to upload a custom font with the additional icons rather than overwriting the installed font as I did.)

    // Houzz - Register new icon as a theme icon
    function avia_add_custom_icon($icons) {
    	$icons['houzz']	 = array( 'font' =>'entypo-fontello', 'icon' => 'ue92d');
     	$icons['qq']	 = array( 'font' =>'fontawesomeregular', 'icon' => 'uf1d6');
     	$icons['wechat']	 = array( 'font' =>'fontawesomeregular', 'icon' => 'uf1d7');
    	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['Houzz'] = 'houzz';
     	$icons['QQ'] = 'qq';
     	$icons['WeChat'] = 'wechat';
    	return $icons;
    }
    add_filter('avf_social_icons_options','avia_add_custom_social_icon', 10, 1);
    #1209013

    @Jordan_S – You can close it.

    • This reply was modified 4 years, 6 months ago by milkytech.
    #1209154

    Hi milkytech,

    We’re glad that we could help :)
    Thanks for using Enfold and have a great day!

    Best regards,
    Nikko

Viewing 10 posts - 1 through 10 (of 10 total)
  • The topic ‘Social Icon not available’ is closed to new replies.