HowTo · Technology

How to blog post in WordPress.com with Instagram pictures

Update: The steps here use Firefox browser. If you are using Chrome, the only difference is for the Featured Image.

This is how I add Instagram pics 1 by 1 from my account to WordPress.com post. There maybe better ways, like using Widget or Plugin but I want to be able to choose which Instagram pic I want to display in blog post.

Pre-requisite:

  1. WordPress.com blog
  2. Instagram account – your own or other people’s but pls credit the original poster if you are using someone’s pic/ask account owner first

I’ll use my own account – actually my dogs account, taken over by succulents and plants ;)

Steps:

  1. Go the to the account profile/page where the picture originated. You can login to your account but it’s not necessary.
    lessiefifisucculentscreenshot
  2. Select the picture you want to post in your blog.
    Unfortunately, we can only grab 1 picture at a time unless you have a Copy-Paste app/Clipboard – sth like that. For simplicity, this guide will be on grabbing 1 picture at a time. Copy the url address of the picture.You can either: copy the whole url which includes taken by <who> or just till the picture folder (highlighted yellow in the pic below, you can include or exclude “/”). If you selected the former, the picture will be visible in your WP post if the exact url is still active. If you selected the latter, the picture will still be displayed as long as the picture is still at the same url but account name may have changed. The latter way is safer in case the account owner changed profile name. I had changed from lessienfifi to lessiefifisucculents but that’s before I found out about Purslane, Portulaca and other flower plants … and I’m thinking of changing name again but I had some posts with the former method gah!
    lessiefifisucculent_postYou can also be more hardworking and right click the picture > View Page Info or other functions. The url is the same:
    lessiefifisucculent_post_viewpageinfo
  3. Post the Instagram picture url.
    In the WP post, you can either use Visual or HTML.If you use Visual, the moment you paste the url and hit Enter, you’ll see the Instagram picture – must hit Enter or the picture won’t appear. To enter another picture, you need to go to the end of the picture (you can click at the area right AFTER the picture or use the End key in keyboard just to be safe) and hit Enter again. Repeat Step 2.If you use HTML, you won’t be able to see the picture but you can manipulate the spacing and layout better because you don’t have to hit Enter. You can easily arrange several pictures per row though you’ll need a HUGE monitor to display it and this is not recommended considering WP templates also have borders usually – unless you change the display size.

    Example post (this is a screenshot, not actual post) and the HTML view for other instagram pics:
    lessiefifisucculent_instagrampostinwplessiefifisucculent_instagrampostinwphtml
    To adjust the picture size, left or right click on the picture and image toolbar will appear. You can drag and adjust the size with mouse or use the image toolbar to increase/decrease the size (change too much).

  4. Add Featured Image
    From the same View Page Info > Media tab > scroll to the bottom and it should display Image. This is your picture’s Address. You can right click the url and copy OR Location: left click the url and select the url path till it ends with .jpg. Copy that (right click > copy):
    lessiefifisucculent_post_viewpageinfo_media

    If you are using Chrome, right click the picture in Instagram and View Page Source. HTML tags will appear and don’t worry if you don’t know HTML programming language. Use Ctrl+F (Find) “.jpg”. This is the file format for the picture. The first hit is your picture. Copy from “https….jpg” (without the double quotes).
    Featured image Chrome
    You can open a new window to test > paste the image url and the picture should appear in original size uploaded.

  5. In the Featured Image section (left side of the navigation if you are using the new and easy write) > Set Featured Image > Add url > paste the url Address/Location > Set Featured Image. Pls only use a picture that belongs to you or obtained approval from original account to repost with credit.

That’s all. Easy? It gets easier after a few tries.

Advertisements

Leave a comment here

Please log in using one of these methods to post your comment:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s