"An error occurred. please refresh the page and try again" - Blogger doesn't allows saving of rearrangement widgets in the Layout page - how to fix this?
Blogger's using blogspot blog tool might have come across the error message "An error occurred. please refresh the page and try again" while trying to save the blogs layout after a rearrangement of the blog widgets. ie bloggers may not be able to save the changes made on their blogspot blog's layout.
I also had a similar experience. Usually this error happens after you edit the Blog's HTML to display some widgets only on mobile version of the website or you might have tried to remove the attribution / copyright widget.
Here I am sharing what I did to prevent this error.
1. Login to the blogger website www.blogger.com
2. Go to your blog's admin panel
3. Click on the Template tab on the menu
4. Click on EDIT HTML button to open the HTML code of your blog on the Editor
5. If you are are not confident on editing using blogger's HTML editor then copy the HTML code to Your favourite HTML editor
6. Save a copy of HTML as a backup code
7. On the other copy you can do modification for applying to your live blog.
8. Find the occurence of " mobile='only' " text in the code .
mobile='only' attribute is added to widgets which are intended to display only on mobile devices. Once this is added and the code is saved using the blogger's HTML editor, then that widget will not be displayed on the LAYOUT page of the blog. So when you try to rearrange widgets and try to save the Layout, the hidden widgets will prevent it from saving. So to fix the issue you have to remove all the occurences of " mobile='only' " attribute in the widget definitions.
In my blog's code there was an occurence of " mobile='only' "
<b:widget id='HTML1' locked='false' mobile='only' title='CROZOOMMobAd' type='HTML'>
<b:includable id='main'>
<!-- only display title if it's non-empty
<b:if cond='data:title != ""'>
<h2 class='title'><data:title/></h2>
</b:if>-->
<b:if cond='data:blog.pageType == "index"'>
<div class='widget-content'>
<data:content/>
</div>
</b:if>
<b:include name='quickedit'/>
</b:includable>
</b:widget>
<b:includable id='main'>
<!-- only display title if it's non-empty
<b:if cond='data:title != ""'>
<h2 class='title'><data:title/></h2>
</b:if>-->
<b:if cond='data:blog.pageType == "index"'>
<div class='widget-content'>
<data:content/>
</div>
</b:if>
<b:include name='quickedit'/>
</b:includable>
</b:widget>
9. So I removed the " mobile='only' ". Since this widget is to be displayed on mobile version of the website, I used another blogger function data:blog.isMobile. Modified code is given below:
<b:widget id='HTML1' locked='false' title='CROZOOMMobAd' type='HTML'>
<b:includable id='main'>
<b:if cond='data:blog.isMobile'>
<!-- only display title if it's non-empty
<b:if cond='data:title != ""'>
<h2 class='title'><data:title/></h2>
</b:if>-->
<b:if cond='data:blog.pageType == "index"'>
<div class='widget-content'>
<data:content/>
</div>
</b:if>
</b:if>
<b:include name='quickedit'/>
</b:includable>
</b:widget>
<b:includable id='main'>
<b:if cond='data:blog.isMobile'>
<!-- only display title if it's non-empty
<b:if cond='data:title != ""'>
<h2 class='title'><data:title/></h2>
</b:if>-->
<b:if cond='data:blog.pageType == "index"'>
<div class='widget-content'>
<data:content/>
</div>
</b:if>
</b:if>
<b:include name='quickedit'/>
</b:includable>
</b:widget>
10. After this changes, I pasted the code to blogger's HTML Template editor and saved it.
11. Then I clicked on the "LAYOUT" tab in the menu
12. On the Layout page, added the widget rearrangements and saved.
This time no error appeared and everything seems to be fixed...
Try it and post your comments...
