Showing posts with label how to link to a pdf in blogger. Show all posts
Showing posts with label how to link to a pdf in blogger. Show all posts

Saturday, January 7, 2012

How to Share a PDF in Blogger

The past few months, as I've been blogging (and reading blogs), I realized that I needed more internet savvy skills than I possessed. Two things that I wanted to do were to "Make a picture into a link" and to post downloadable PDF's on my blog. Several blogs that I really admire and that inspired my little venture here, share lots of these. I think it is so cool and definitely attractive and interesting to readers!

I found great directions, HERE, on creating a picture link. Beware, it involves editing HTML code. I found this utterly fascinating, something that a couple of my high school buddies (Jeffrey and Josh) would get a huge kick out of now. In physics class, we used to debate why organizations like NASA were spending billions and trillions on space exploration. My platform was that space travel is a waste, why not just admire the moon and stars from here? They were champions of things like understanding the mysteries of space and the internet. I confess, I now appreciate HTML code, but I still think we should spend the space money on something like America's monstrous debt...



Here's how I share a PDF in Blogger
(I'm sure it's just one of many ways):

You need two things:
1) A gmail account. Although possibly yahoo and some of the others now have document capabilities, try it out, if it works post it in a comment!
2) A PDF file of your own making to share.

Step One
Sign in to your gmail account, click on "Documents" in the toolbar.
***Note: Google changed the setup so that all Google Docs has a new home. Now you sign in to your
      gmail account and click on "Drive" in the toolbar. After that all my directions below are the same.

Click the "Upload" button (just to the right of the "Create" button) and select "File...". Select the document you want to upload, choose "Start Upload" then you will see this.



Step Two
Click on the file to open it (when you wave your cursor over the file name, you'll see that it's a link). After opening, there will be a blue "Share" button in the right hand corner. Click on it and a little box with "Sharing Settings" will appear. The default setting is "Private, only the people listed below can access" with an option to "Change" beside it. Click Change.



Step Three
You will now see another menu with several options (below). Choose "Anyone with the link," and click "save."

Now, the moment we've all been waiting for!! A URL will appear. You can copy and paste the URL into any kind of link you want, simple text or in a picture link. You always have the option to go back to the same file (in Google Documents), open your document and choose "Share" to find the URL again or to make changes to share settings.





Step Four (creating a picture link in Blogger)
If you decide to do a picture link, upload the picture into blogger then click "Edit HTML." Sorry, couldn't resist this picture, it's the funniest thing I've ever seen. Baby P a year ago!


After you click "Edit HTML," a whole bunch of this will show up... It is the HTML code that describes the image above.

<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhFX5fTGwqW0CgecPFilOw-yhD198dXfrs86axucY0c2HR2J1vYhkkqJLDmTjmQ0nmx428_Qunw7agVjMcCyFH5nWo6BqdQtukoGD6nwrvUUuUFtEdv8nj6Udluxxsz7Vg9eaAf3s0gSTQ/s1600/029+-+Copy+%25286%2529.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="250" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhFX5fTGwqW0CgecPFilOw-yhD198dXfrs86axucY0c2HR2J1vYhkkqJLDmTjmQ0nmx428_Qunw7agVjMcCyFH5nWo6BqdQtukoGD6nwrvUUuUFtEdv8nj6Udluxxsz7Vg9eaAf3s0gSTQ/s320/029+-+Copy+%25286%2529.jpg" width="320" /></a></div>


The first URL (highlighted in yellow) is the one we are interested in, it is a link. By default the picture links to itself. If you click on that picture it will just take you to a page showing the picture alone, maybe with a few other pictures from this post. Try it. But...if you substitute your own URL for the highlighted URL (see teal highlighted below and be sure to keep the quotation marks) clicking the picture can take you wherever you want.

Below is the HTML for a picture link that will take you to the PDF I uploaded in Google Docs. I also added the HTML to open the PDF in a new window (highlighted in purple). Once you're done editing HTML, click "Compose" and that's it.





<a href="https://docs.google.com/open?id=0B_hV7G1vVKjjYTA4MzYxMjQtYmUwZC00NDUwLTg3NTEtYmM1ZDNhNzRlMWQ4"  target=”_blank” imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="250" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhFX5fTGwqW0CgecPFilOw-yhD198dXfrs86axucY0c2HR2J1vYhkkqJLDmTjmQ0nmx428_Qunw7agVjMcCyFH5nWo6BqdQtukoGD6nwrvUUuUFtEdv8nj6Udluxxsz7Vg9eaAf3s0gSTQ/s320/029+-+Copy+%25286%2529.jpg" width="320" /></a></div>





Here's a picture link that will take you to "Before the Throne of God" melody PDF in a new window.
It's not so bad! Those of you who are reading this and have real training in the codewriting arena have probably noted that I do not :). Please, don't be shy about making suggestions! 

P.S. If you found this helpful, link back and leave a comment! Thanks!