Blogger offers the ability to add images however it does not offer the option to add documents directly into your blog, whether or not you are self hosted. If you are using Blogger to publish your posts, they do not offer this. There is a way to do this by self hosting the document somewhere else. This tutorial will explain two ways of adding a document to any post, either by using a link, an embed picture or thumbnail.
Using Google Documents
1. Login to your Google Account or in Blogger in design view, click on the “My Account” link on the top right corner and click through to Google Documents from that screen. Once you reach the Google Documents screen, click on the Upload button to drop down the menu. Click on the “Files…” option, like you see in the picture below.
2. Next choose the file located on your hard drive that you want uploaded to Google Documents. A box will pop up with options. Make sure you un-check the top two boxes before you click on “Start upload”. These options are to change the formatting of the document to suite Google viewing better and most often messes up the formatting of your original document.
3. Once your selected file has completed uploading, you will see the file listed in your Google Documents screen. Right-click on the file name, click “Share” to expand the menu and then click “Share…” again, like you see in the picture below.
4. A “Share settings” box will pop up. Automatically your document with be set to private and only you can view. Make sure to change who can access the document. I have changed the access to “Anyone who has the link can view” which will allow access from anywhere the document link is located, for example on a website, in an email, etc. Highlight and copy the link under “Link to share” as you see in the picture. Close the box.
5. Go back into your Blogger post. Click “Edit Pages”, if you already wrote the post you want to place to document in or New Post, if you haven’t yet. Make sure you are on the compose tab, highlight the text you want to link the document to within the post. Click on the link button on the toolbar and when the link box pops up check the “Text to display” box to make sure it has the correct text you want to link to typed there. Next, right-click in the “Website address” text box and paste the link that you previously copied in step #4. Click on “OK” and you should now see your text has a hyperlink. Click on “Publish Post” to view your new post, double check the previously hyperlinked text to ensure you are actually linking to the correct document.
This is a pretty basic way to link a document but for me, I wanted a little more punch to my pdf document link. There is another way to link a document using embedit.in that uses embed code into your post and creates an image of your document.
1. Go to embedit.in and upload your file from your hard drive by the clicking on the “Select Files” button. You will have to log in using Open ID, Twitter, Facebook, etc so that you can edit your embed documents later.
2. Once you have uploaded the document, click on the “Customize” tab on the document details screen. Here you will choose the appearance, privacy settings and grab the embed code. I wanted a thumbnail of my pdf document because I inserted 4 documents using this tool, like a portfolio. You can individually upload documents, making them each separate with individual embed codes or you can upload several documents at the same time which creates a collaboration of all the documents you uploaded at the same time. You can do this by holding down the “Ctrl” button while clicking on each document when you are selecting which documents to upload. Doing it this way will only give you one embed code to insert into your blog post, similar to a slideshow.
4. Now go into your Blogger post design screen and click on the “Edit HTML” tab. Right click within the code where you want to locate the document, paste the embed code/script and then click on “Publish Post”. You cannot view the results of the document embed code without publishing first. You can always go back into edit, if the code isn’t in the correct place.
5. The results should show the embed code as a picture of your document. I chose to do this with a thumbnail version because I wanted to line up several thumbnails for a portfolio directly on my blog page. The thumbnail of your document will show like the image below, wherever you placed the embed code in your blogger post. This tool would work for WordPress as well.
After adding a link to my pdf documents using both of the above methods I viewed both pdf documents. I found the results of the Google Documents method to be noticeably less quality visually than of the embedit. For me, quality is everything when you are trying to sell yourself through a portfolio and for that, my personal preference would be embedit whenever I want to link a document into a blog post.
This tutorial was written by Stacey of This Lil Piglet. Stacey claim to fame is by going from a “City Mom to Farmer Joe, This Lil Piglet will keep you on your hooves and give you everything you need to raise barn animals OR kids.”