How to Add HTML Embed Codes to Your Website [Quick Tip]
If you want to curate others’ content from social media or just make your own
But wait a second … before we get into the nitty-gritty of this tip, what the heck does “embed” mean? And what is HTML? If you don’t know how to code at all, no worries — embedding external content is extremely easy. Let’s take a second to break down the basics.
What does embed mean?
Embed means to integrate external content into another website or page. You embed something when you place a block of code — called an embed code — into the HTML editor of another website. When you hit ‘Save’ or ‘Publish,’ the media then renders on the published page.
Embedded content is referenced with HTML. HTML is one of the most basic languages used on the web to design and lay out web pages.
You often see this code when you’re in the “back end” of your blog post. There’s where you’ll add your embed code.
Most social and multimedia websites have an option to generate an embed code right in each individual post. Here’s an example of an embed code for a HubSpot YouTube video:
And here’s the embedded result.
Want to do the same thing on your blog posts and pages? Let’s go over how you can generate an embed code for the top social sites.
Below, we cover these steps in more detail for each platform. In general, you’ll want to:
- Generate the embed code.
- Access your content management system and paste the embed code in your HTML viewer.
- Finished! You have embedded content into your website or blog.
Let’s dive into each step.
1. Generate the embed code.
Before embedding external content, you must first generate an embed code for the post or page you want to embed on your website.
We’ll go over how you can do that on most of the major social and content networks.
Embed a Facebook Post
To embed a Facebook post, do the following:
- Navigate to Facebook on your desktop browser and go to the post that you’d like to embed.
- Click on the three dots on the upper right-hand corner of the post.
- On the drop-down menu, click Embed.
- A pop-up will appear, where you have the option to include the full post and access advanced settings. For beginners, we recommend leaving the options as they are and simply clicking Copy Code.
- Finished! You’ve got your embed code.
Embed an Instagram Post
Want to embed an Instagram post? The process is similar to Facebook’s. Note that you can only embed posts from the desktop version and not the mobile …read more
Source:: HubSpot Blog
