WordPress has many plugins which help you integrate your Instagram account into your website, but the ProPhoto software has built-in features that will make the process pretty simple.
You can use several different ProPhoto tools to link to your Instagram profile or insert your latest Instagram images on your site.
Link to an Instagram account
The simplest way to integrate your Instagram profile on your website is to simply link to your profile from your website. There are several ways to do this in ProPhoto, but you’ll basically just paste the address of your profile into one of these tools – click to learn more about each:
- A link in a menu: Custom link
a simple menu link to your Instagram page
- A graphic/button anywhere in your layout: Graphics widget
(using a simple image, or a Tile design)
a graphics widget with multiple icon images
- Appearing below each post/page: Call To Action
(using a text link, simple image, or a Tile design)
the Call To Action area below a post with multiple icon images
- Appearing in a grid layout within a page or a layout template: Grid types
a custom ‘text below’ grid featuring social icons
There are lots of great sources of icons online if you don’t want to make them yourself. In the examples above, icons were obtained from https://www.iconfinder.com
Insert Instagram images with a grid
You may embed a grid of your latest Instagram images into a post, page, or template by using the Grids tools in ProPhoto. But before you can create an Instagram widget, you must authorize ProPhoto to read your Instagram account.
Authorize your Instagram account access
ProPhoto needs access to your Instagram images, but Instagram requires apps to be authorized before this can happen.
- Make sure you are using a web browser which has been signed into Instagram in one tab.
- In another tab, login to WordPress and visit this ProPhoto screen:
“ProPhoto > Settings > Site Settings > Social Media” - In the Instagram box down that page, click to authorize your account.
- Your website will store a token which allows your site to read the images and text from your public Instagram posts, and this area will tell you the account which is authorized.
You may click to de-authorize your account at any time.
Create an Instagram grid
Much like we explain in the Create a grid tutorial, you may insert a Grid widget into a template, or you may insert a grid into any post or page on your site. See those guides for details about all the grid options available to you when creating a grid.
After you have authorized ProPhoto to read your Instagram feed, you will have the option to create an Instagram feed grid type.
Insert your grid and view your site. You may need to edit the gutter, max columns, and item min/ideal/max width settings until you get the appearance you like best.
Customize the Instagram grid appearance
Just like other grids, you have two primary styles of grid to choose from – text below and rollover – and each one provides you with controls like font style selection, text alignment, rounded image corners, border, background color, and more.
You can apply your styling changes in the base template to affect all your grids uniformly, or you can override your general styling in a child template for one or more pages. Read more about the appearance controls for each grid style:
an Instagram widget type with ‘text below’ style
