Need'to display Instagram photos on WordPress?
Instagram was only launched in 2010, but is a large social network for sharing images, with half a billion users logging in every month and nearly 100 million messages posted every day.
Adding Instagram images to your WordPress website is a great way to make your posts and pages more engaging and to tap into the immense wealth of beautiful photos posted on the website every day.
WordPress makes it easy to add photos to pages and articles. The process is the same for both, so follow these steps to learn more.
But before, let's discover together How to Install a WordPress Blog in 7 Steps et How to search, install and activate a WordPress theme on your blog.
Then, back to why we are here.
Get an image on Instagram
The first thing you need to do is find the Instagram photo you want to embed on your WordPress website.
If you are using the Instagram app, find the photo you want to view, press the vertical select button (…) and then copy the share URL. Save this link somewhere, for example a plain text document. You can send the URL to yourself by email.
See also: Some WordPress security plugins for your blog
If you are on Instagram.com, find the photo you want to embed, and view the image in question. Click the link that displays the period in which the publication was made.
You will access a page with a unique URL for the image in question! Copy this link from the address bar, because that's what we'll use in the article / WordPress page.
How to create a post for Instagram photos on WordPress
With the image URL available on Instagram, it will be really easy for you to add the Instagram images to WordPress.
Also discover our tip on How to force WordPress to check for plugin updates
Start by creating a new article / page, or open an already existing one. Navigate to the section on the document where you want to display the image and wrap.
Paste the URL you copied. WordPress will automatically display the Instagram post.
Publish or update your message and that's it!
How to add Instagram posts to WordPress
Instagram also gives you the option to embed photos manually. If pasting the URL doesn't work or you want a little more control (You can choose to hide the description), this is the option you must choose.
Also read our guide on How to receive plugin recommendations on WordPress
Again, you'll need to find your photo, but embed it this time, an option that is only available by visiting instagram.com. As before, go to the entire photo page with the unique url.
Now, instead of copying the URL, click on the ellipses (…) at the bottom right and click " To integrate (Embed).
Instagram will offer you a code that you will need to copy. If you want to hide the legend, uncheck the box " include legend ».
Discover more How to give a unique style to different categories on WordPress
You can now embed the photo in an article or page. As before, you must: either add a new article or page, or modify an already existing one. You have to * switch to text editor mode and find the place where you want to paste the code of the photo, once that is done add the code.
Instagram generates a lot of code, but go back to the visual editor and you will notice that your photo has been added. If there is gray space where you expect to see a photo, don't worry, the photo will show on the frontend of your website.
Also read our article on: PayPal scams: How to recognize them?
Post or update the article or page, and you'll have an Instagram photo available!
Instagram is a super-engaging resource
Instagram is one of the most popular networks for offering images. Many of your visitors / customers are there and having content that they can share will be beneficial for you.
Also discover some additional premium WordPress plugins
You can use other plugins to display countdowns on your WordPress blog. In what follows, I propose some of them.
1. WPML
WPML is a premium WordPress translation plugin that allows you to translate your blog posts and website pages. It is advisable to make a full backup of your website before installing it.
Unlike most other translation plugins, WPML is compatible with most major themes and WordPress plugins. So you won't need to touch the code or the appearance of your website to make it work. It even allows you to translate a web page created with the different page builders.
See also 5 WordPress plugins to share the content of your blog
They offer 3 premium plans based on the number of features. Each premium plan offers unlimited use of the website. It is one of WordPress plugins oldest and most trusted translation tools for building your multilingual website.
Download | Demo | Web hosting
2. Ajax Search Pro
Ajax Search Pro is one of the best WordPress plugins premium real-time search bar on WordPress. It is highly customizable, with many features and options, and delivers the best possible results.
You can replace the WordPress search bar with a more efficient and dynamic search engine. In addition, this WordPress plugin has more than 60 colorful, and fully customizable themes that will save you time.
See our article on 10 WordPress plugins to improve the visual of your website
So you can focus more on the visual presentation of your search form.
Download | Demo | Web hosting
3. Octaboo
Octabook is a very easy-to-use premium WordPress plugin and Instant Appointment Booking tool for almost all types of services and service providers who want to offer appointment booking. online booking from a website.
It offers several features, including: support for multiple localization, configuration of services, dynamic pricing, notifications, etc., support for customizable fields for forms, customization of appearance, support for Google Calendar, an intuitive dashboard, export of data to csv format, and much more.
Download | Demo | Web hosting
Recommended Resources
Find out about other recommended resources to help you build and manage your website.
- How to add image to text in Elementor
- 7 aspects that will allow you to create a successful blog
- How to compress and resize images on WordPress
- 10 WordPress plugins to create attributes for your variable products
- 5 WooCommerce plugins to manage customer relations on a website
Conclusion
Here is ! That's it for this tutorial, I hope it will now allow you to display Instagram photos on a WordPress page or post.
However, you will also be able to consult our resources, if you need more elements to carry out your projects of creation of Internet sites, by consulting our guide on the WordPress blog creation.
Feel free to share this article with your friends on your favorite social networks. But, in the meantime, tell us about your Comments and suggestions in the dedicated section.
...
This suite of advice is really well done, it probably already exceed the 1000 subscribers.
Above 1000 it becomes difficult to follow all the subscribers, so it is necessary to find tips to remember those who are the most active while removing those who post a lot without ever giving back. To do this, the "Collections" tool allows you to create lists in order to follow the most loyal accounts more regularly.
Hello, I share your opinion and thank you for the return.
Hello,
Thanks for this tutorial. It helped me a lot to understand not only how to integrate instagram photos, but especially also to integrate facebook, twitter and other photos or publications, in an article. I don't know if these have been covered here, but this article has helped me understand.
On the other hand, I have a real concern when I integrate this instagram, facebook, twitter content in an article: I do not know how to center this content. These instagram, facebook and twitter content that we integrate always go to the left and that does not seem pleasant to me at all. So how do you position them in the middle of the article?
Goods.
Hello,
Thank you for the feedback. To center the elements, you will need to access the text editor while editing an article, and with some CSS rules, you will be able to center the element. For example, you can transform the main tag into "inline-block" and define a centered aligment or use the "margin: 0 auto; "