Add Facebook, Twitter, and Myspace buttons to your site – Webflow tutorial

By | February 15, 2020


As we know, social proof is the idea that
others endorse you or your business. And to demonstrate that, and to better connect people
with social accounts on your site, we’re going to cover Facebook, Twitter, and Myspace. Let’s start with Facebook. You can access the Facebook element the same
place all elements are listed of course we can find it under components. Let’s drag it into our design. And by default, we have our Facebook settings
here, but before we style anything, the website you type in here? The exact URL. Facebook will automatically pull (it’ll display
how many people have liked the URL you type in). If you’re looking to focus these likes on
a Facebook page? For instance, if you want to prompt people
to like your Facebook page, type out that direct link here. If you’re looking to set likes on a specific
URL, like a website, you can do that here ,too. Once we type it out, we can set a number of
properties related to styling. What we see on the screen is standard, but
we also have box, which orients things in a box (you might have to adjust the dimensions
here to get Facebook’s element to fit correctly). And we have button. This is obviously a more minimal approach
which combines the like button and the current like count. And we have locale, from which we can choose
any number of practical languages. Like Esperanto, or of course, upside down. For now, let’s keep it set on Standard,
with the default American English. That’s the Facebook element. What about Google Plus? That’s no longer a thing. So let’s do Twitter. Same thing here, let’s drag this in from the
Add panel. And with Twitter, there are two main options:
we can take the first approach of prompting users to Tweet something (this includes the
URL we want to share, and the text featured in the Tweet). And option two is even simpler: we can prompt
users to follow a particular Twitter account. So. To do the first one (the Tweet) we’ll need
the link (the URL we want to share). And we’ll need the Tweet text. Now. Twitter gives us the option of showing a bubble
here. But, Twitter no longer pulls the number, so
you end up with an ellipsis. And we can also select large button. Which replaces the small button with a large
button. The second one (the follow button) only requires
one thing. The user (the Twitter handle) needs to be
typed in. Now. Keep in mind. The @ symbol is already in the settings here,
so type the Twitter handle without the @ sign. But that’s Twitter. Finally, let’s cover Myspace. [Grímur] When I was 16. I was actually, like, muscle-wise, and athletic-wise. I was actually in my prime. That was Myspace. So. We covered adding a Facebook element to a
page, a Twitter element to a page, and Grimur’s still working on research and development
for Myspace. That’s adding social media buttons to your
Webflow project.

10 thoughts on “Add Facebook, Twitter, and Myspace buttons to your site – Webflow tutorial

Leave a Reply

Your email address will not be published. Required fields are marked *