Time Travel discussion

329 views
Group Announcements & Tutorials > How to embed images in your posts

Comments Showing 1-5 of 5 (5 new)    post a comment »
dateDown arrow    newest »

message 1: by Tej (last edited Jun 03, 2013 01:48AM) (new)

Tej (theycallmemrglass) | 1725 comments Mod
I had promised this tutorial a week a go and now that we have a great Book give away competition inviting us to post our pics to time travel into, I thought I best hurry up with this.

So here goes.

This tutorial is in two stages, 1:"How to Upload your photos to an imaging host website" and 2:"How to embed an image in your GR post".

If you already know or have your images uploaded to a host website then you are nearly there, just skip the first stage and head onto "Stage 2: How to embed an image in your GR post" further down the page. These tutorials might seem lengthy but they are not, I am just being very thorough with the steps and you'll find it easy as pie to embed your images when you know how :)


STAGE 1: How to upload your image to an image hosting website

I am going to use Flikr as an example because it is the most popular image hosting site. Personally, I use Tinypic.com for its resizing features and automatic embed codes for forums and websites. There are several others such as Photobucket but lets crack on with using Flikr.

Go to Flikr.com and sign up for a free account.

Once you are signed in, on you will see an Upload image button on the top menu bar. Click it.



You'll see that Flikr gives two different ways of uploading your images. One way, is to simply drag your images from your pictures folder (or wherever your images resides). If you are comfortable with that method go ahead and drag your images into the Flikr reservoir. Otherwise, click "Add" in the top left corner:



This will bring up your files dialogue box such as below.



Navigate to your image and double click it or highlight it then click open.

Flikr will now upload a thumbnail of it:



On the right side you will see "Upload 1 Photo" (assuming you uploaded only one)



Click "Upload to Photostream"



There, your image is now uploaded!






STAGE 2: "How to Embed an image in your GR post"

Ok, right mouse button click on the image you want to embed to bring up a pop up menu and then click "copy address link"



Now go to your Goodreads posting box and type in the line below:



This is basically your image holder text or tag. All that is missing from it is your image address link which goes inside the two quotation marks, so place your cursor in between the quotations, right mouse button click on it and select "paste" to paste your address link:



You should now have something like this (of course your image address link will be different to that shown below):




Click on preview at the bottom of your post (next to the post button) to test how your image will look in your post.



Chances are that it is too large or indeed you dont see the image at all because it is larger than the maximum size allowed. Goodreads only allow images up to 400 pixels in width and 1000 pixels in height. So to resize your image you need to include two more parameters, width="XXX" and height="XXX". Insert these words as shown below, experiment with your numbers for width and height (the highlighted parts), clicking preview each time to test how it will look. Remember maximum width is 400 and maximum height is 1000:



And that's it! I think having more images posted on these threads will give the site more vibrancy but dont go overboard with it, less is more as they say ;)


message 2: by Omar (last edited Jun 02, 2013 03:23AM) (new)

Omar Riaz | 22 comments Wow! you really took some time to make this tutorial. Thank U.
I know a bit of HTML and PHP but i still got few new things that didn't know before from you article.


message 3: by Harv (new)

Harv Griffin | 66 comments Thanks, Tej!

I tried to explain in a comment how to post pictures, but quickly ran up against the HTML problem: the comment would not display what I was typing or pasting; I considered substituting brackets for those little arrow-thingies, but said the hell with it.

I like to include the width and height of the pic as part of the file name, so when I get to GoodReads I can easily plug in the values.

Cheers!

@hg47


Cheryl has hopes her life will calm down soonish (cherylllr) | 902 comments Wow, thank you. I'm copying this over to the Tips thread in the Feedback Group: http://www.goodreads.com/topic/show/3...


message 5: by Denise (new)

Denise | 19 comments Too complicated. I'll just enjoy the posts by people who have figured this out. :-)


back to top