[T3EXT DAY] Plugin for Instagram

[T3EXT DAY] Plugin for Instagram

Photograph sharing in social community, Instagram, is trending rapidly. With more than 400 million dynamic clients, it is no big surprise more brands are jumping on board that Instagram prepares. While there are numerous business tools for Instagram, the inquiry for website designers turns out to be: how can you integrate Instagram in a website?

What does it do?

Plugin to display gallery, feeds and phototile with clean, customizable and responsive feeds from multiple Instagram accounts.

It's awesome TYPO3 extension which provides you a very attractive frontend display of Instagram images in different view (eg., gallery, phototile) at your TYPO3 website.

1. Instagram Gallery

Typo3-NsInstagram-Gallery

2. Instagram Feeds

Typo3-NsInstagram-Feeds

3. Instagram Phototile

Typo3-NsInstagram-Phototile

1. Overview:

Extension Key:ns_instagram
Extension URL:https://extensions.typo3.org/extension/ns_instagram/
Documentation:https://docs.typo3.org/typo3cms/extensions/ns_instagram/
Support:https://github.com/nitsan-technologies/ns_instagram/issues
Version:1.0.0
Category:Frontend Plugin
TYPO3 version:(6.0.0 - 8.9.99)

2. Installation:

The extension needs to be installed as any other extension of TYPO3 CMS:

2.1. Install Extension from EM:

Step 1: Switch to the module “Extension Manager”.

Step 2: Get the extension -

  • Get it from the Extension Manager: Press the “Retrieve/Update” button and search for the extension key 'ns_instagram' and import the extension from the repository.
  • Get it from typo3.org: You can always get current version from http://typo3.org/extensions/repository/view/ns_instagram/current/ by downloading either the t3x or zip version. Upload the file afterwards in the Extension Manager.

Step 3: Now install the Extension.

Step 1: Go to Template Module.

Step 2: Switch to Root page.

Step 3: Select Info/Modify option from drop-down.

Step 4: Click on Edit the whole template record button.

Step 5: Switch to Includes tab.

Step 6: Search for Extension and after search click on extension name.

Verify that your selected extension move to the selected items.

2.2. Preparation: Include static TypoScript:

The extension ships some TypoScript code which needs to be included.

Typo3-NsInstagram-install-2

3. Instagram API Configuration:

3.1. To activate the Twitter service for your TYPO3 site :

Step 1: Signup with Tour Instagram Account at here https://www.instagram.com/accounts/login/?next=/developer/

Step 2:"Register new Client ID" at there.

Typo3-NsInstagram-config-1-1

Step 3: Go to "Manage Clients" you will get "CLIENT_ID", "REDIRECT_URI" from there.

Typo3-NsInstagram-config-2-2

Step 4: Replace "CLIENT_ID" and "REDIRECT_URI" in below URL which you get from there.

https://www.instagram.com/oauth/authorize?client_id=CLIENT_ID&redirect_uri=REDIRECT_URI&scope=basic+public_content&response_type=token

Step 5: Now you may get "Access Token" in URL. Copy that and Paste it in to this Extension.

Typo3-NsInstagram-config-3

Configuration:

Step 1: Switch to the Template module and select Info/Modify.

Step 2: Switch to the root page of your site.

Step 3: Select Constant Editor from drop down.

Step 4: Select Category - PLUGIN.TX_NSINSTAGRAM_FEED (5) And PLUGIN.TX_NSINSTAGRAM_PHOTOTILE(5).

Step 5: Add Access Token and Add Jquery (Optional) in it.

Step 1: Go to page module.

Step 2: Select page where you want to add this Extension.

Step 3: Switch to Plugin tab.

Step 4: Open the General Plugins.

Step 5: Shift to plugin tab.

Step 6: Select Instram option as per the requirement.

4. Clear Cache:

Please, clear cache from top panel 'Flush frontend caches' & 'Flush general caches'. It will be also great to clear cache from Install tool too.

5. Support:

Feedback & Suggestions:

Just download & try the EXT:ns_instagram extension. You can write down your feedback/suggestion/comments to below comment box. So, we will adapt it for next version of EXT:ns_instagram.

Now, show your beautiful Instagram Feeds at your great TYPO3 site

  • Get it from the Extension Manager: Press the “Retrieve/Update” button and search for the extension key ns_instagram and import the extension from the repository.
  • Get it from typo3.org: You can always get current version from http://typo3.org/extensions/repository/view/ns_instagram/current/ by downloading either the t3x or zip version. Upload the file afterward in the Extension Manager.
    • Switch to the root page of your site.
    • Switch to the Template module and select Info/Modify.
    • Click the link Edit the whole template record and switch to the tab Includes.
    • Select [NITSAN] NsTwitter (ns_instagram) at the field Include static (from extensions):
    • Step 1: Switch to the root page of your site.
    • Step 2: Switch to the Template module and select Info/Modify.
    • Step 3: Select Category = PLUGIN.TX_NSINSTAGRAM_FEED (5) And PLUGIN.TX_NSINSTAGRAM_PHOTOTILE (5)
    • Step 4: Add Access Token and Add Jquery (Optional) in it.
    • Step 5: Now Add plugin in to page where you want to show your Instagram Feeds. Checkout following Screen-Shots.

Sanjay Chauhan - TYPO3 Technopreneur

Ein junger Technologie-Enthusiast und Unternehmer. Mit 24 Jahren war er Mitbegründer von NITSAN - einer TYPO3-Agentur in Bhavnagar, Indien. Er ist ein gefragter Vermarkter von NITSAN, akkreditiert mit dem Management von Kundendienstteams, Kooperationen mit Agenturen und Kunden, Projektausführungen und mehr. Ein Tech-Typ im wahrsten Sinne des Wortes, Sanjay ist der eigentliche TYPO3 Guru bei NITSAN.

Hinterlasse einen Kommentar

Diese Webseite nutzt Cookies

Diese Webseite nutzt Cookies zur Verbesserung des Erlebnisses unserer Besucher. Indem Sie weiterhin auf dieser Webseite navigieren, erklären Sie sich mit unserer Verwendung von Cookies einverstanden.