Skip to main content

JS: Fetch the dynamic instagram posts on your static website

Got Stuck, Want to fetch the Instagram Posts on your static website and have no clue how to do that, No worries you are at the right place just follow the steps, and you are done, enjoy the hassle-free automated posts from your Instagram account to your up and running website. No more embedded iframe manual Instagram posts.

 Step 1: Include the following script after the jquery library

<script type="text/javascript"  src="https://www.jqueryscript.net/demo/Instagram-Photos-Without-API-instagramFeed/jquery.instagramFeed.js?v8"></script>

Step2: Add the following code in footer and place your Instagram username in place of following bold marked text

$(window).on('load', function(){
    $.instagramFeed({
        'username': 'Your Instagram Username',
        'container': "#instagram-feed1",
        'display_profile': false,
        'display_biography': false,
        'display_gallery': true,
        'get_raw_json': false,
        'callback': null,
        'styling': true,
        'items': 8,
        'items_per_row': 4,
        'margin': 1
    }); 
});

Step 3: Define your HTML div or section like following

<div id="instagram-feed1"></div>

Now Cheers !
Labels:

Comments

Post a Comment

Popular posts from this blog

React: Remember me functionality with React

Want to know how can you easily integrate Remember me on your website just follow the steps below and I am sure you will find this pretty easy. There is no rocket science to crack it you just need basic code knowledge only. Step 1: Add the react-cookie in your project    npm install react-cookie Step2: Add the following code in index.js import { CookiesProvider } from "react-cookie"; ReactDOM.render(      <CookiesProvider>           <App />      </CookiesProvider>,      document.getElementById('root') ); Step3: Add the following code in your component    import React, { useState } from 'react'; import { useCookies } from 'react-cookie'; const App = () => { const [name, setName] = useState(''); const [pwd, setPwd] = useState(''); const [cookies, setCookie] = useCookies(['user']); const handle = () => {      setCooki...
Post a Comment
Read more

React: Print Specific Section of the page with - ReactToPrint

  Want to know how can you easily print specific section of your website just follow the steps below and I am sure you will find this pretty easy. There is no rocket science to crack it you just need basic code knowledge only. Step 1: Add the ReactToPrint in your project    npm install --save react-to-print Step2: Add the following code in your component   import React, { useRef } from 'react'; import ReactToPrint from 'react-to-print'; const Example = () => {      const componentRef = useRef();      return (           <div>                <ReactToPrint                     trigger={() => <button>Print this out!</button>}                     content={() => componentRef}    ...
Post a Comment
Read more

JS: Cheatsheet

   Datatypes Difference Between Var, Let and Const Functions and its types Asynchronous operations in JS
3 comments
Read more