Viewing 13 posts - 1 through 13 (of 13 total)
  • Author
    Posts
  • #364557

    Hi

    How do i customise the socket area such that:

    1. I can add some simple text to the right of the social network icon.
    For example, fb.com/XXX
    2. Add my own social network icon that is not part of the standard available ones

    Hope to hear from you soon.

    Thank you!

    #364801

    Hi nigellim68!

    1. Try adding this to your custom CSS.

    #socket .social_bookmarks li { width: auto !important; overflow: visible !important; }
    #socket .social_bookmarks > .social_bookmarks_twitter:after {
        content: "Here is twitter";
    }
    #socket .social_bookmarks > .social_bookmarks_dribbble:after {
        content: "Here is dribbble";
    }

    2. Please see here, https://kriesi.at/support/topic/custom-social-bar-icons-replaceadd-enfold/. There are a few examples in the middle of the topic on how to add your own.

    Cheers!
    Elliott

    #365476

    Hi Elliott

    Thanks. I got 2 issues:

    (see URL in original post)
    1. I want the text BEFORE the icon
    2. The Icon is not middle aligned to the text.
    3. Can I increase the height of the socket area?

    Thanks and hope to hear from you soon.

    #365477
    This reply has been marked as private.
    #365575

    Hi!

    1. + 2. Change it to this.

    #socket .social_bookmarks > .social_bookmarks_twitter:before {
        content: "Here is twitter";
        float: left;
        margin-top:10px;
    }

    3. Add this.

    #socket { height: 50px !important; }
    

    Regards,
    Elliott

    #365888

    Thank you.

    1. How do I add some left space to the SOCKET TEXT?

    #366044

    Hey!

    Please add following code to Quick CSS

    span.copyright {
    margin-left: 10px;
    }

    Regards,
    Yigit

    #366162

    Thanks, Yigit.

    What if I want it to be center of the socket area? doable?

    #366167

    Hi!

    You can change the code to following one

    span.copyright {
    width: 100%; 
    text-align: center;
    }

    Best regards,
    Yigit

    #366174

    Thanks, Yigit.

    I followed the link you provided to add a custom icon using the following codes in the functions file:
    *
    * Peter added the following to
    * Allow custom social icons and text to
    * Sockets area
    */
    function avia_add_custom_icon($icons) {
    $icons[‘yoshome’] = array( ‘font’ =>’entypo-fontello’, ‘icon’ => ‘u2302’);
    return $icons;
    }
    add_filter(‘avf_default_icons’,’avia_add_custom_icon’, 10, 1);

    function avia_add_custom_social_icon($icons) {
    $icons[‘yoshome’] = ‘yoshome’;
    return $icons;
    }
    add_filter(‘avf_social_icons_options’,’avia_add_custom_social_icon’, 10, 1);

    My aim is to create a HOME icon but it is not showing in the Social Profile section of ENFOLD Customization Page

    #366459

    I figure it out; I have to put the codes under the line:

    if(isset($avia_config[‘use_child_theme_functions_only’])) return;

    More questions:
    1. How do I add space to the right of the social icons so they are not so close to the right side?
    2. How do I adjust the margin-top of the socket social icons?

    • This reply was modified 9 years, 11 months ago by nigellim68.
    #366462

    Hey!

    Try adding this code to the Quick CSS:

    #socket .social_bookmarks {
        right: 30px;
    }

    Cheers! 
    Josue

    #366465

    Thanks, Josue. It works.

    • This reply was modified 9 years, 11 months ago by nigellim68.
Viewing 13 posts - 1 through 13 (of 13 total)
  • The topic ‘Footer Socket customisation’ is closed to new replies.