[How To] Create a Spotify follow button widget

Community Legend
‎2015-05-04 10:00 AM

Our Community Rock Stars with the Blog Maverick role can submit blog posts to be published on the Spotify Community Blog. This blog submission comes from Rock Star @JoeThomas.

 

Hey everyone! Joe here with more cool tips and tricks!

 

Today I'm going to show you how to get more followers using the follow widget. If you’re on the forums this is a must have as it’s a great way to attract an audience for your awesome playlists.

 

What do they look like?

 

You’ve probably seen one of these throughout the forums:

ht1

 

This is a follow widget. By simply tapping in the follow button you’ve just instantly followed them.

ht2

 

So what’s the advantage of having a follow button?

 

There are various reasons to get a follow button. One of the main reasons why I have one is that when someone from the forums wants to follow me, they have a quick and easy way of doing it--they don't have to go out of their way. 

 

So can I get one?

 

Yeah!

 

Really?

 

Uh-huh.

 

How?

 

  1. Open Spotify
  2. Go to your Profile Page by clicking your username in the top right corner. 
  3. Click on the three dots by your photo and hit ‘Copy Spotify URL’.
  4. Go back to this website.
  5. Paste the link into the box which says ‘Spotify HTTP Link (or Spotify URI)’. ht4
  6. Set the layout exactly how you want it to. Experiment!                               ht5
  7. Check the preview to see if the widget is swanky enough:
  8. Copy the HTML code below and paste it into your blog or website. ht7

 

HTM-wha?

 

HTML. It’s the language that brings the Internet together.

 

Oh. You didn’t mention me learning a language. You should have seen me in those Spanish lessons.

 

Don’t worry! You don’t need to know a thing about HTML. Just follow me (pun not intended):

 

If you’re trying to post it within a thread/message, simply hit HTML and paste the HTML code where you want it to go.

remastered stuff

 

Lookin’ good!

re

 

If you want to put the widget in your signature (the thing that’s at the bottom of every single one of your posts) then select My Settings:

ht10

 

Then under Personal Profile hit Personal Information:

ht11

 

Paste the code in the signature box and hit Save:

ht14

 

Boom! There you go.

re2

 

That's all I've got time for!

 

Want to make cool blog posts like this? Check out the Rock Star Program - it's right up your street!

 

~Joe (AKA @JoeThomas)

33 Comments
Community Legend

Thank you @JoeThomas

Community Legend

 I amount of times I kept clicking the Kudos button on the picture insted of the actual one was insane! 

Stephenwithaph
Regular

Awesome, thanks!

livinlargo
Garage Band

Can't seem to get it to work. I'm guessing it's because I don't have a number for my account just >spotify:user:livinlargo<

 

<iframe src="https://embed.spotify.com/follow/1/?uri=spotify:user:livinlargo&size=detail&theme=light&show-count=0... width="300" height="56" scrolling="no" frameborder="0" style="border:none; overflow:hidden;" allowtransparency="true"></iframe>

 

 

Keep getting this error message:

Your setting's value has been changed because invalid HTML was found. The invalid HTML has been removed. Please review the value and re-submit the form when you are satisfied.

cloudsmaker
Garage Band

I can't make it work neither in my signature nor in the post, too. It says that HTML is not allowed...

Could it be that only certain members with high ranks can do that?

 

diestro
Garage Band

I have @cloudsmaker same problem. When I edit the signature, the system says that the HTML is not allowed...

What can I do?

 

 

Community Legend

@diestro@cloudsmaker  Did you go to My Settings > Personal Profile > Personal Infromation > Signature? You may have gone to the mobile section, which says no HTML.

diestro
Garage Band

Yep @Mattosaurus , I make all the steps, and the problem still appear.

 

What can I do? :( 

Rock Star
Rock Star

Hey @diestro

 

HTML signatures are disabled for new community users because in the past people would abuse the signature space.

 

You should be able to add an HTML signature after you post a little bit more and rank up.

diestro
Garage Band

@MattSuda how much messages more need to activate this function?

 

Thank you for your help! 

Rock Star
Rock Star

Hey @diestro

 

I'll look into this and get back to you soon.

cloudsmaker
Garage Band

@diestro, turns out it's not about embedding the code itself, this forum has already implemented that so you only need to get your SpotifyURI and put it in the signature field

<a href="SpotifyURI">Follow me</a>

 

 

Community Legend

 Hey @diestro!

 

 I think you need to rank up to a Festival Fanatic. You can see all the different ranks and what they do here:

 

https://community.spotify.com/t5/Newcomers-and-Contribution/Community-Ranks-How-do-they-work/td-p/19...

cloudsmaker
Garage Band

@Mattosaurus (how do I actually mention/tag someone?),

It's not the case, myself I don't have Festival Fanatic yet, i'm only Garage Band and I managed to embed the Follow button.

HowTo: https://community.spotify.com/t5/Spotify-Community-Blog/How-To-Create-a-Spotify-follow-button-widget...

diestro
Garage Band

 @Mattosaurus I am a Bedroom Songwriter, I think that is more than Festival Fanatic, and I can't create the play button in my signature...

So what can I do?

 

@cloudsmaker The link redirects to this thread :(

Community Legend
@cloudsmaker According to the official rank list: https://community.spotify.com/t5/Newcomers-and-Contribution/Community-Ranks-How-do-they-work/td-p/19... You need to be a Signed Artist to @mention someone. Though diestro can somehow do it even though he's a really low rank. @diestro Not sure what's the problem... @MattSuda did you ever look into it?
Rock Star
Rock Star

Hey @diestro

 

I talked with one of the community managers.

 

They are not sure what is going on here. Your permissions are set to allow HTML in posts and signatures. 

 

Can you attach a screen shot of the page with the error?

 

Also, follow this guide to make sure you are embedding the follow button correctly:

https://community.spotify.com/t5/Beta-Spotify-Answers/Guide-How-to-embed-a-playlist-track-or-follow-...

gxhxoxsxtxfxm
Concert VIP

I am doing exactly as you are saying but I cannot add the HTML to my Signature. When I paste the code, I get this message:

 

Your setting's value has been changed because invalid HTML was found. The invalid HTML has been removed. Please review the value and re-submit the form when you are satisfied.

 

And then my entire HTML is gone and the textbox gets a green background. Has there been any changes in the way the form validation rules?

Rock Star
Rock Star

Hey @gxhxoxsxtxfxm

 

This could be because you are new to the community. HTML signatures for new users is disabled until you post a little bit more and your account gets older. We had a problem in the past where people would sign up just to spam and abuse the signature so those restricitons had to be put in place.

livinlargo
Garage Band

@MattSuda- I'm still new to the community but definately not a spammer and don't think I've "abused"  the message board- Idk why I can't add a follow button. It's not a big deal = I'm not looking for "followers" but I'd like to be able to connect to people w/a similar outlook on music. Thanx in advance for your time.