If you look through our articles, you’ll notice we like to include a lot of real-life examples of effective social media marketing.
Not only do embedded social media posts add visual appeal, but they also make your content more engaging and interactive. If you’re not using an embed code to spruce up your content yet, keep reading.
We’ll tell you everything you need to know about this often overlooked media, and walk you through how to embed posts from each of these social networks.
Why Use an Embed Code?
You may be wondering why you should use embed codes instead of taking a screenshot of Tweets and social media posts. One of the primary reasons is images are static and non-interactive.
When you embed a Tweet, people can click the Twitter handle to be taken to the user’s profile, or even follow the account without leaving the page.
— Sprout Social (@SproutSocial) March 15, 2016
One of the biggest advantages of embed codes is that they make your content more engaging and dynamic, which can keep people on your site longer.
Embedding Social Media Posts on Your Website
Here are a few tips to get you started with using embed codes on your site.
First, if you’re using a CMS like WordPress that has a WYSIWYG or visual editor, you’ll need to make sure you’re pasting embed codes into the text/HTML editor instead.
Embed codes will just display as text if you paste them into the visual editor.
Second, you may want to align your social media posts to make them look organized with the rest of your content. To do this, in most cases you’ll just have to add a <center> tag around the embed code, so it would look like this.
embed code here
Don’t worry, you don’t have to be a web developer to use embed codes. As you’ll see from our guides, it’s very simple!
Now, let’s look at how to embed social media posts into your content.
How to Embed Facebook Posts
Step 1: Go to the Facebook post you want to embed, and click on the grey arrow in the corner. Click Embed.
Step 2: You’ll see two options. One link to preview what the post will look like, and another to see advanced settings.
The advanced settings will give you the opportunity to change the width of your post. If you don’t want to change the width, you can just copy the embed code as-is.
If you click the advanced settings, after you change the width just click on get code and copy the embed code.
Step 3: Add the embed code where you want the post to appear on your page and check out your finished product.
How to Embed Tweets
Step 1: Find the Tweet you want to share, and click on the three little dots at the bottom.
Step 2: Click Embed Tweet.
Step 3: Copy the embed code in the box. If you only want the text and none of the extra media like photos or videos, you can uncheck the Include media box.
Step 4: Paste the embed code into the page you’d like the Tweet to appear on and you’re done.
— Sprout Social (@SproutSocial) May 5, 2016
How to Embed Google+ Posts
Step 1: Find the Google+ post you’d like to embed. Hover over it and click the arrow that appears in the upper right corner. Click on Embed post.
Step 2: Copy the embed code.
Step 3: Paste the embed code where you want the post to appear on your site. Then you’ll have the final product.
How to Embed Pinterest Pins
Step 1: Find the pin you’d like to embed, and hover over it until you see the magnifying glass. Click the pin.
Step 2: Click the three dots at the top, then Embed.
Step 3: You’ll be taken to the Pinterest Widget Builder where you can customize the look of the pin before you embed it.
Step 4: Once you’ve customized the look, scroll down and you’ll see two lines of code. You’ll need to copy both of these. If you’re embedding multiple pins into a single page or post, you only need to paste the second line of code (the pinit.js script) once.
Step 5: Paste the embed code where you want your pin to show, and you’re done.
How to Embed Pinterest Boards
Step 1: Go to the Pinterest board you want to embed and copy the URL.
Step 2: Go to the Pinterest Widget Builder and select board.
Step 3: Paste the URL of the Pinterest board you copied in step one, and choose the size you’d like.
Step 4: Copy the two lines of code at the bottom.
Step 5: Paste the embed code where you’d like it to appear on the page, and you’re set.
How to Embed Instagram Posts
Step 1: Click the Instagram post you want to embed. Then, click the three small dots at the bottom.
Step 2: Click Embed.
Step 3: Copy the embed code. You can choose to exclude the caption if you only want to embed the image or video.
Step 4: Paste the embed code where you want the Instagram post to appear on your page, and you’re done.
How to Embed Vine Videos
Step 1: Find the Vine you want to embed, then hover over the three dots at the top. Click Embed.
Step 2: In the new window that pops up, you can change the settings to get the perfect look for your Vine.
Step 3: Scroll down and copy the embed code.
Step 4: Paste the embed code where you want your Vine to appear, and enjoy endless loops of fun.
How to Embed YouTube Videos
Step 1: Go the YouTube video you want to embed, and click the share button right above the description.
Step 2: Click the Embed tab.
Step 3: This step is optional. If you click “show more,” additional options will be displayed. Change any of these settings if you’d like, then copy the embed code.
Step 4: Paste the YouTube embed code where you’d like the video to appear on your site and take a look at your video.
How to Embed SlideShare Presentations
Step 1: Open the SlideShare presentation you’d like to embed. Click the share button beneath the presentation’s title.
Step 2: Sharing options will pop up in the presentation. Click the embed code.
Step 3: After clicking the embed code, new options will show up to change the size of the presentation, as well as choose which slide you’d like to be displayed first. Once, you’ve set your options, copy the embed code.
Step 4: Paste the embed code where you’d like the presentation to appear on your site and you’re done.
How to Embed Tumblr Posts
Step 1: First, make sure you’re signed into Tumblr, otherwise you won’t be able to grab the embed code. Click the post you want to embed. Then click the embed button at the top of the screen.
Step 2: You’ll be taken to a new page with an embed code. You can change the language of the post if you’d like, then copy the code.
Step 3: Paste the embed code into your page and you’re done.
Embedding Social Media Posts in WordPress
If your site is built on the WordPress content management system (CMS), there’s a cool shortcut that makes embedding social media posts and other media quick and easy.
For certain social networks, you can paste the URL of the post you want to embed directly into the WordPress visual editor, and it will automatically embed on the page.
Some of the popular social networks this tactic works with are:
- Reddit (comments)
You can find the full list here. It’s a huge time saver.
Depending on your site’s development, you may need to tinker with the embed codes to get them to work correctly. But the value of adding these links is tremendous. You can even dive deeper with social media analytics tools from Sprout Social so you can see just how well your own social strategies are going.
As long as you follow this guide, you’ll be headed in the right direction to properly using embed codes.