How can I add a SoundCloud icon to link from my wordpress.com to my SoundCloud page?

• 

  timbreaustin · Member · Jan 14, 2015 at 9:18 am

  • Copy link
  • Add topic to favorites

  I have been able to put Twitter, Facebook, etc icons on my sidebar via widget, but I am unable to figure out how to put a small icon for SoundCloud with them. Is there a code for SoundCloud that I can place in a Text Widget?

  The blog I need help with is: (visible only to logged in users)

• 

  lizthefair · Member · Jan 14, 2015 at 3:30 pm

  • Copy link

  Since you’ve added the other icons by simply linking images to your social media accounts this is possible. All you need to do is find a soundcloud image and link it the way you did the others.

  The icon linked below matches your current set pretty well:

  http://www.iconarchive.com/show/the-circle-icons-by-xenatt/App-Soundcloud-icon.html

  If you download the icon at the size that matches the rest of your set, and add it to your media library, I can help you generate the code you need to add to your text widget.

• 

  timbreaustin · Member · Jan 16, 2015 at 11:48 pm

  • Copy link

  Thank you!! I uploaded the image and the file URL ishttps://timbreaustin.files.wordpress.com/2015/01/app-soundcloud-icon.png

  Is that what you need to generate the code?

  Thanks again!

• 

  lizthefair · Member · Jan 17, 2015 at 2:28 am

  • Copy link

  That should do it, here’s the code:

  <a href="[link to sound cloud account here]">
  <img title="SoundCloud" alt="SoundCloud" src="https://timbreaustin.files.wordpress.com/2015/01/app-soundcloud-icon.png" width="35" height="35" />
  </a>

  Just replace [link to sound cloud account here] with the link to your SoundCloud profile and paste the code at the bottom of the text widget where you have the code for the other icons (before the< /div> tag).

  Let me know if you have any trouble!

• 

  timbreaustin · Member · Jan 21, 2015 at 2:39 pm

  • Copy link

  Awesome, it worked perfectly! The icon is a bit blurry though so I found one that I think will be clear. Would you mind generating a new code please?
  It is uploaded in media and the new file URL is:
  https://timbreaustin.files.wordpress.com/2015/01/soundcloud-2.png

  Also, when the icon appeared near my others, it was on a line below them rather than in a single line with the others. It is still currently active so you can see. Is there a way I can fix this so that there is just one line of social media icons?

  Thanks so much!

• 

  lizthefair · Member · Jan 21, 2015 at 3:10 pm

  • Copy link

  The icon is a bit blurry though so I found one that I think will be clear. Would you mind generating a new code please?

  Done!

  Is there a way I can fix this so that there is just one line of social media icons?

  The problem is the widget area isn’t quite wide enough for all of the icons to share the row. We can fix that with CSS. If you paste the code below into the CSS box in your customizer you should be all set.

  #secondary.widget-area{
  	width: 200px;
  }

  In case you’ve never used the customizer before, you can get there from clicking Customize in the My Sites drop-down menu in the upper left corner of your site, or by clicking the link below:

  https://timbreaustin.wordpress.com/wp-admin/customize.php?url=https%3A%2F%2Ftimbreaustin.wordpress.com%2Fwp-admin%2Fwidgets.php

  Let me know if you have any questions about that!

• 

  timbreaustin · Member · Jan 21, 2015 at 11:21 pm

  • Copy link

  You are the best! Can’t thank you enough, its perfect now!!

• 

  lizthefair · Member · Jan 21, 2015 at 11:49 pm

  • Copy link

  Wonderful. I’m so glad you are happy with the results :)