Viewing 12 posts - 1 through 12 (of 12 total)
  • Author
    Posts
  • #1339409

    I’d like to add the social icons to my footer in the column 1 widget to look like this: https://ibb.co/0D06bQC . I saw some existing threads on this, but none were able to help me out, so I started a new one.

    Thanks!
    Ryan

    #1339431

    Hey Ryan,

    Thanks for contacting us!

    1- Please enable debugging mode of Advanced Layout Builder by adding following code to bottom of Functions.php file

    //set builder mode to debug
    add_action('avia_builder_mode', "builder_set_debug");
    function builder_set_debug()
    {
      return "debug";
    }

    This will display shortcodes of the elements in a new window below Advanced Layout Builder

    2- Add Social Buttons element to your page and adjust it as needed.

    3- Copy the shortcode of Social Buttons element from debug field and paste it into the widget area you would like in Appearance > Widgets.

    If you need further assistance, please let us know :)

    Cheers!
    Yigit

    #1339472

    Thanks Yigit.

    I added that code to the bottom of my functions.php

    “This will display shortcodes of the elements in a new window below Advanced Layout Builder”

    I am not seeing this anywhere.

    Additionally, when I add the “social icons” content element to a page, nothing shows up in my preview. I have it set to “show defaults”

    Thanks,
    Ryan

    #1339538

    Hi Ryan,

    Your site is not loading at all on my end. Please make is accessible if you need help with activating debug mode.

    Best regards,
    Rikard

    #1339635

    Hey Rikard, I just tested the site and it loaded. Can you try again? thanks.

    #1339653

    Hi Ryan,

    When not using a child theme, code should be added under following line in functions.php

    if( isset( $avia_config['use_child_theme_functions_only'] ) )	
    {	
    	return;		
    }

    I moved it on your installation. Please review your website :)

    Best regards,
    Yigit

    #1339681

    Kaboom!

    Now I need to apply some styling changes to make the format mirror the top right header icons here – https://2j2.a9d.myftpupload.com/

    – Rearrange the order to facebook, instagram, linkedin, pinterest
    – make the icons a bit bigger
    – reduce the spacing between the icons
    – remove the hover text

    Thanks so much for all of the help

    Ryan

    #1339775

    Hi Ryan,

    I edited your element and gave it “custom-social” ID in Advanced > Developer Settings and then added following cdoe to bottom of Quick CSS field in Enfold theme options > General Styling tab

    /* Social widget */ 
    #custom-social .avia-related-tooltip {
      display: none !important;
    }
    #custom-social .av-share-box ul li a { 
       font-size: 18px; 
       width: 35px;
    }
    #custom-social .av-share-box ul li {
       display: inline-block; 
    }
    #top #custom-social .av-share-box ul { 
        display: flex; 
    } 
    #custom-social .av-share-box ul li.av-social-link-pinterest { 
       order: 4; 
    }
    #custom-social .av-share-box ul li.av-social-link-linkedin { 
       order: 3; 
    }

    Best regards,
    Yigit

    #1342934

    Amazing, thanks Yigit!!

    #1342966

    Hi,

    Great, I’m glad that Yigit could help you out. Please let us know if you should need any further help on the topic or if we can close it.

    Best regards,
    Rikard

    #1358905

    You can close this, thanks!

    Ryan

    #1358946

    Hi,

    Thanks for letting us know, I’ll close this thread for now then. Please open a new thread if you should have any further questions or problems.

    Best regards,
    Rikard

Viewing 12 posts - 1 through 12 (of 12 total)
  • The topic ‘Adding social icons to footer (not socket)’ is closed to new replies.