Images & Instagram

While you can add images to most of the pages in your app, having an Image page is a great way to display pictures of your property, as well as categorise them into separate galleries.

You can also add a link to your Instagram page, which will update on the app as you add pictures to it.

To start, add the Images page to your app.

Next click the add “+” and the image options appear.


 

To upload images from your hard drive, choose My Images.


This option allows you to add multiple galleries if you wish. For example, if you would like to show different areas of your hotel, you might want galleries called “Rooms”, “The Hotel”, “Restaurant” and “The Spa”.

After adding the gallery name, click “Send your pictures”. This will open up the Browse button which allows you to upload your images from file.

The maximum size of these images is 2000 x 2000 pixels, and can be .jpeg or .png, and there is no limit to the amount that can be added.

Once you’ve added the images, you have the option to add a title to it along with a description. This will appear once when a user clicks on an image to enlarge.

When you have uploaded all of your images and added any descriptions, click “OK” next to the Gallery Name.

You can edit this gallery at any point by clicking the arrow next to “Manage”. This will bring up the list of all your galleries.

To add more galleries, click the “+” sign again and follow the same process. Other galleries you add will appear in the “Galleries” menu in the top right corner of the screen on the app itself.

 

 

 

You’re also able to link your Instagram account to this page. To do this you’ll need to obtain a Client ID and an access token – we’ll explain how to do this below.

To get your client ID:


  1. Go to http://instagram.com/developer/ and login using your Instagram account details.
  2. Click "Register Your Application"

You should see a form named "Developer Signup".

     3. Complete the form as follows:

Your website: [Your website or https://criton.information-apps.com]

Phone number: [Your phone number]

What do you want to build with the API?: Integrate Instagram albums with my app

     4. Tick "I accept the API Terms of Use and Brand Guidelines"

     5. Click "Sign up"

     6. Now click “Register Your Application” again

     7. Click "Register a New Client"

You should see a form named "Register new Client ID" with two tabs, "Details" and "Security".

     8. In the "Details" tab, complete the form as follows:

Application Name: [Your app name]

Description: [A brief summary of your app]

Company Name [Your company name]

Website URL: https://criton.information-apps.com

Valid redirect URLs: https://criton.information-apps.com

Privacy Policy URL: [Your privacy URL]

Contact Email: [Your email address]

     9. In the "Security" tab, untick "Disable implicit OAuth"

     10. Click "Register"

     11. You should see the app you just registered, along with a client ID. Keep this page open, as you will need this client ID.

 

Now get your access token:

     1. Copy and paste the below URL into your browser - replacing "MY-CLIENT-ID" with the client ID you obtained in the above steps.

https://api.instagram.com/oauth/authorize/?client_id=MY-CLIENT-ID&redirect_uri=https://criton.information-apps.com&response_type=token

     2. Click "Authorize"

You should be directed to the Criton website. The URL in the top bar should look something like the URL below.

https://criton.information-apps.com/#access_token=54437633996.477ca6e.f00333622c14c48c2966b94eb359cb78f

     3. Copy the access token (this includes everything after "#access_token=" in the URL) and continue to the next step.

 

Add client ID and access token to app:

     1. Click "Edit" to edit your app

     2. In the left side panel, click "Settings" and then click "Instagram"

     3. Paste the access token into the "Access Token" box

     4. Copy and paste the client ID into the "Client ID" box

     5. Click "Save"

     6. In the left side panel, click "Editor" and then click "Features" to continue editing your app. You should now be able to add the images from your Instagram account!

 

This is the last of our Feature guides. The next section on our Support site deals with Styling for your App.