Author Topic: sOCIAL MEDIA BUTTONS  (Read 18665 times)

Offline LBRUCE5

  • Newbie
  • *
  • Posts: 7
  • Karma: +0/-1
    • View Profile
sOCIAL MEDIA BUTTONS
« on: October 12, 2013, 02:51:25 PM »
I am trying to change the social media buttons. I do not use skype and a few of the other buttons listed but I do use instagram and a few different one. I would like to add custom buttons. How would I be able to achieve doing this. This is one of my many concerns but social media is the most important part of any business at this time.

Your help is most appreciated, Thank everyone in advance ;) ;D ::)

Offline Loreto

  • Newbie
  • *
  • Posts: 40
  • Karma: +3/-0
    • View Profile
Re: sOCIAL MEDIA BUTTONS
« Reply #1 on: October 12, 2013, 04:12:33 PM »
I think you can do it in the "design"--> Layouts, and the put the cursor over the "html...social icons" and click edit in the popup window, the you can edit the html block, sure there is another way, but this is the way I do.  ;)

Offline LBRUCE5

  • Newbie
  • *
  • Posts: 7
  • Karma: +0/-1
    • View Profile
Re: sOCIAL MEDIA BUTTONS
« Reply #2 on: October 15, 2013, 07:27:55 AM »
Thank You very much for your help. I have in fact found a way that is more direct to what I have been looking to do with my site. If anyone need help with changing the icons feel free to message me and I will be sure to help and talk you through it. I will be making a video about it soon and I will post it here for everyone to view. Hope this helps everyone out.

Offline Riin

  • Newbie
  • *
  • Posts: 43
  • Karma: +3/-0
    • View Profile
    • Happy Fuzzy Yarn (wholesale)
Re: sOCIAL MEDIA BUTTONS
« Reply #3 on: June 06, 2014, 03:40:52 PM »
I think you can do it in the "design"--> Layouts, and the put the cursor over the "html...social icons" and click edit in the popup window, the you can edit the html block, sure there is another way, but this is the way I do.  ;)

I could only figure out how to change the links there, not the actual icons. How *does* one change the icons?

Thanks.

Riin
Riin Gill

Offline Riin

  • Newbie
  • *
  • Posts: 43
  • Karma: +3/-0
    • View Profile
    • Happy Fuzzy Yarn (wholesale)
Re: sOCIAL MEDIA BUTTONS
« Reply #4 on: June 15, 2014, 09:14:09 AM »
Can anyone help with this? I need to add Pinterest and Ravelry icons. I tried replacing default_html5/image/footericon.png with a new image, but now no icons appear. Anyone? Help?
Riin Gill

Offline abantecart

  • Administrator
  • Hero Member
  • *****
  • Posts: 4358
  • Karma: +298/-10
    • View Profile
    • Ideal Open Source Ecommerce Solution
Re: sOCIAL MEDIA BUTTONS
« Reply #5 on: June 15, 2014, 09:24:51 AM »
What is the problem with Loreto suggestion?
Please  rate your experience or leave your review
We need your help to build better free open source ecommerce platform for everyone. See how you can help

Offline Riin

  • Newbie
  • *
  • Posts: 43
  • Karma: +3/-0
    • View Profile
    • Happy Fuzzy Yarn (wholesale)
Re: sOCIAL MEDIA BUTTONS
« Reply #6 on: June 15, 2014, 11:09:17 AM »
I don't understand where you actually change the icons that way. I only see where to change the links.
Riin Gill

Offline Basara

  • Administrator
  • Hero Member
  • *****
  • Posts: 5774
  • Karma: +274/-2
    • View Profile
Re: sOCIAL MEDIA BUTTONS
« Reply #7 on: June 16, 2014, 03:19:44 AM »
I don't understand where you actually change the icons that way. I only see where to change the links.

Icons are showing using CSS rules
Code: [Select]
<a href="http://www.facebook.com/AbanteCart" target="_blank" title="Facebook" class="facebook">Facebook</a> see the CSS class="facebook" ?
To add your own image upload it to the server ../resources/image/ folder then use simple HTML code to insert image
something like this
Code: [Select]
<a href="http://www.facebook.com/AbanteCart" target="_blank" title="Facebook"><img src="http://www.yoursite.com/resources/image/newicon.png" alt="Smiley face" width="42" height="42">
</a>

Offline Riin

  • Newbie
  • *
  • Posts: 43
  • Karma: +3/-0
    • View Profile
    • Happy Fuzzy Yarn (wholesale)
Re: sOCIAL MEDIA BUTTONS
« Reply #8 on: June 16, 2014, 06:38:45 PM »
Oh! Duh!

Thanks!
Riin Gill

Offline Riin

  • Newbie
  • *
  • Posts: 43
  • Karma: +3/-0
    • View Profile
    • Happy Fuzzy Yarn (wholesale)
Re: sOCIAL MEDIA BUTTONS
« Reply #9 on: June 16, 2014, 08:28:55 PM »
Ok, I did that, but now there are really big spaces between the icons. My icons are 32 x 32 pixels, and the spaces are approximately 45 pixels wide. I looked in the stylesheet to see if I could adjust it, but the stylesheet doesn't think those big spaces are there. Any recommendations on how to make those spaces a lot smaller?
Riin Gill

Offline Basara

  • Administrator
  • Hero Member
  • *****
  • Posts: 5774
  • Karma: +274/-2
    • View Profile
Re: sOCIAL MEDIA BUTTONS
« Reply #10 on: June 17, 2014, 01:27:19 AM »
This is related to your HTML code. Try to inspect element in your browser or install Firebug browser addon to check where is problem

Offline Riin

  • Newbie
  • *
  • Posts: 43
  • Karma: +3/-0
    • View Profile
    • Happy Fuzzy Yarn (wholesale)
Re: sOCIAL MEDIA BUTTONS
« Reply #11 on: June 17, 2014, 10:44:35 AM »
I installed Firebug and found the width of the icon area specified under DOM, but it won't let me edit it there, and it's not at all clear to me where I'm supposed to edit it.
Riin Gill

Offline Riin

  • Newbie
  • *
  • Posts: 43
  • Karma: +3/-0
    • View Profile
    • Happy Fuzzy Yarn (wholesale)
Re: sOCIAL MEDIA BUTTONS
« Reply #12 on: June 17, 2014, 03:26:07 PM »
Also, I found out the icons aren't showing up on all browsers. When I look at my site on Firefox on my Mac, they're there. When I look on my ipad, there are blank squares where the icons should be. On my assistant's PC, with IE 11, they were just broken image links, and when she looked at it with Firefox, they were just text links. So now what?
Riin Gill

Offline Basara

  • Administrator
  • Hero Member
  • *****
  • Posts: 5774
  • Karma: +274/-2
    • View Profile
Re: sOCIAL MEDIA BUTTONS
« Reply #13 on: June 18, 2014, 01:24:12 AM »
Hi.
Please post your site url and html code from html icons block.

Offline Riin

  • Newbie
  • *
  • Posts: 43
  • Karma: +3/-0
    • View Profile
    • Happy Fuzzy Yarn (wholesale)
Re: sOCIAL MEDIA BUTTONS
« Reply #14 on: June 18, 2014, 11:25:58 AM »
I finally ended up just putting the links in the footer and skipping the block.
Riin Gill

 

Powered by SMFPacks Social Login Mod