Viewing 11 posts - 1 through 11 (of 11 total)
  • Author
    Posts
  • January 27, 2021 at 1:01 am #1275640
    Tia

    Hi
    I am trying to have two rows of 2 (4 in total) social icons in the 1st footer column of my site.

    I followed the code given in other threads for the icons twitter, youtube, and LinkedIn but I cannot see where (what site) I can get the corresponding email icon. I have used the HTML I get for the email icon available in enfold but it doesn’t line up with the others.

    I would also like both rows to be closer together so that the 4 icons line up better with the content in the middle footer column.

    Perhaps there is a better way of doing this?

    I have given site access details in the Private content.

    Thanks for your help with this.

    Regards
    Tia
    .

    January 27, 2021 at 10:31 am #1275701
    Victoria

    Hey Tia,

    Can you please put them in one widget and we will try to adjust it via CSS?

    Best regards,
    Victoria

    January 27, 2021 at 12:59 pm #1275771
    Tia

    Hi Victoria
    I’ve done that now.
    I think part of the problem is that the email icon is not the same type as the others (from the same source) so behaves differently.

    Usually, I can find what I want at fontello or someplace like that but I can’t really see where the twitter, youtube and LinkedIn are coming from (in this code I got from another thread). This makes me think that I should take a different approach.

    I will await your advice.

    Many thanks
    Tia

    January 27, 2021 at 10:17 pm #1275902
    Victoria

    Hi Tia,

    Here is the code you can put in Enfold > General Styling > Quick Css,  if it does not work, put into themes/enfold/css/custom.css

    
.sbox .avia-icon-list li {
  padding: 0px;
}

.sbox .avia-icon-list li span {
  line-height: 70px;
  padding-top: 5px;
}

    If you need further assistance please let us know.

    Best regards,
    Victoria

    January 28, 2021 at 1:51 pm #1276049
    Tia

    Hi Victoria
    That didn’t work and I would rather not add to the theme files as I am not using a child theme.

    I tried a different approach by just adding the 4 icons in a horizontal line in the first footer column. This looks fine but I would like to add a little spacing between each icon and also align the content of the 3 footer columns better. Can you suggest what html I can add to each widget to align them to the top (evenly). I tried some divs and css but it ended up changing the width of page layouts elsewhere – so I rolled back.

    Thanks for your help, I’m nearly there!

    Regards

    Tia

    January 28, 2021 at 9:26 pm #1276149
    Victoria

    Hi Tia,

    Could you please attach a mockup of what you’re trying to achieve? SO that we know what you need exactly and can help you better.

    Best regards,
    Victoria

    January 28, 2021 at 11:43 pm #1276186
    Tia

    Hi Victoria

    I attach a mock up in the private data.

    Essentially, a little better spacing between the 4 icons in column 1
    and also aligning the top of the content of the 3 columns to one another.

    Many thanks

    Tia

    • This reply was modified 3 years, 9 months ago by Tia.
    February 1, 2021 at 7:37 pm #1276912
    Tia

    Hi
    Did you get a chance to look at my issue?
    Thanks
    Tia

    February 3, 2021 at 12:16 pm #1277327
    Yigit

    Hi Tia,

    We are sorry for the late reply!

    I added following code to bottom of Quick CSS field

    #footer #custom_html-15 {
    top: 15px;
}

#footer #custom_html-15 .av_font_icon {
    margin-right: 20px;
}

    Then I decreased the font size of the icons to 30px from 40px and removed line break from 2nd footer area.

    Please review your website :)

    Best regards,
    Yigit

    February 3, 2021 at 3:24 pm #1277384
    Tia

    Thanks for that Yigit, I really appreciate it.
    You can close this thread now.

    Kind regards
    Tia

    February 3, 2021 at 3:29 pm #1277389
    Yigit

    Hi Tia,

    You are welcome!
    Let us know if you have any other questions and enjoy the rest of your day! :)

    Best regards,
    Yigit

  • Author
    Posts
Viewing 11 posts - 1 through 11 (of 11 total)
  • The topic ‘2 rows of 2 social icons in footer’ is closed to new replies.