Monday, November 25, 2013

Blogger Errors - And How To Fix Them

I've only been blogging for a while, but what really ticks me off is the annoying messages I sometimes get while trying to publish, save, or preview a post in Blogger. Maybe you've got one of these problems before:

1.  Save Error

"An error occurred while trying to save or publish your post. Please try again."
Oftentimes, getting this message meant that I had to copy all my HTML code into Notepad, sign out, close my browser, and open it again. If I'm lucky, it disappears after a browser restart. (Figure 1)

An error occurred while trying to save or publish your post. Please try again.
Figure 1

 2. Fail to Load Error

"Your preview failed to load. Please close this window and try again."
When I press the preview button on the right hand side, a new tab/window opens with this message. (Figure 2). Again, a browser restart might work, but I won't bet on it. (Figure 2)

Your preview failed to load. Please close this window and try again.
Figure 2

The note seems nice at first glance - just "try again" and it'll work, right? Not for me, at least. After some investigation, I noticed that the problem only occured on posts where I uploaded pictures. Text-only pages were totally unaffected by this bug.

There are two ways to upload images to Blogger:


1. "Insert Image" in menu bar (no errors)

Basically, you press the button in the menu bar with a landscape on it (Figure 3). Then, you select pictures on your hard drive and upload them to the site.

Insert Image
Figure 3

Looking at the HTML code for a sample image shows the following:

<div class="separator" style="clear: both; text-align: center;">
<a href="http://3.bp.blogspot.com/-7y8CKmxrIhs/UpP9VcqRfjI/AAAAAAAAANw/WZUt_SYNZzI/s1600/image.PNG" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://lh3.ggpht.com/-7y8CKmxrIhs/UpP9VcqRfjI/AAAAAAAAANw/WZUt_SYNZzI/s1600/image.PNG" /></a></div>

The code is short and simple, linking to the image file on an external server.

2. Drag And Drop (may cause errors)

This was the method I used - I simply dragged the photos straight into my browser from Windows Explorer.


Looking at the HTML code (same image as above) shows the following:

<div class="separator" style="clear: both; text-align: center;">
<img alt="" src="data:image/png;base64,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" />

It seems that the entire image was converted into a long string of text, a technique called a "data URI". This might cause rendering issues in browsers (sometimes the picture doesn't display properly) and probably isn't accepted by Blogger. That's why they give us the error.

Another reason why this could cause an error is because the code is extremely long. If you are embedding multiple images, the file size of the page could potentially rise over 1MB, the maximum allowed by Blogger. I don't know why there isn't a message saying that it's over, but I've clearly gone over that limit (and got an error) when uploading a bunch of pictures at ten megapixels each.


To fix those errors, simply use "Insert Image" to upload your pictures. It works for me, and I've never gotten another of those pesky messages since. Try for yourself and post your results in the comments section below. ◕‿◕

Back To Top