Identify The Gadgets In The Template, Reliably

When you tweak the code in a gadget, based upon my instructions, you'll be editing the template HTML. Or, you might be using the Layout wizard, to locate and remove a problem gadget.

You'll do most editing with widget code unfolded. You'll have a lot of code to sift through - and with many gadgets in your blog, there's always the chance that you'll see the code for one gadget, and confuse it for another.

If you delete or tweak the wrong gadget, you may not like what you get. Before deleting anything, or editing the template, take an extra minute, and find the specific gadget, by its name. This could save you a lot of grief.

Here, I'll look at the Welcome message in my Buzz blog.

This is what I did, as I tweaked it to make it show up only on the Home page.

So, welcome to The Buzz.

If I right click on the screwdriver / wrench ("dragonfly") under that gadget, and select "Copy Link Location" (or possibly "Copy link address"), I can paste the URL into Notepad for easy examination.

Alternately, use the Layout wizard, click on "Edit" - and stretch the gadget window out horizontally, until the entire URL is visible.

http://www.blogger.com/rearrange?blogID=6525860816441104874&widgetType=Text&widgetId=Text1&action=editWidget

The gadget in question is "Text1". To find the code to tweak, I use the Template "Edit HTML" wizard - and completely unfold the code for "Text1".

<b:widget id='Text1' locked='false' title='' type='Text'>
<b:includable id='main'>
<b:if cond='data:blog.url == data:blog.homepageUrl'>
  <!-- only display title if it's non-empty -->
  <b:if cond='data:title != ""'>
    <h2 class='title':gt;<data:title/:gt;</h2>
  </b:if>
  <div class='widget-content'>
    <data:content/>
  </div>
</b:if>

  <b:include name='quickedit'/>
</b:includable>
</b:widget>

That beats an eyeball based search, any day. It's 100% reliable, and takes just a few seconds to find the code for "Text1". After you do this a few times, you'll be able to hover the mouse, and spot the widgetId=Text1 in the URL display in the browser status area - and go straight to

The gadget in question is "Text1".

---

(Update 2014/12): If you use a text browser, you can locate and identify a problem gadget, much more easily.

---

>> Top

The Layout Template "Edit HTML" Wizard And "Expand Widget Templates"

Sometimes, when we're working on a problem that requires editing the HTML in a layout template, we need to understand the need to expand (or not expand) the widget templates. This month, for instance, we have hundreds of blogs containing malicious code, unknowingly installed by the blog owners. The malicious code must be removed, but the installed code aggressively prevents use of the "Page Elements" wizard, and the "Remove" button.

---

Note: The selection to "Expand Widget Templates" has been replaced, by folded lines of code, which are now expanded selectively.

---

When the "Page Elements" wizard can't be used to remove code, you have to use the "Edit HTML" wizard, and remove the individual gadget entries, one by one.

Here's what the unexpanded line entry for one problem gadget looks like

<div class='widget Gadget' id='Gadget1' />

That's easy enough to find - and to delete.

Here's what that entry looks like, expanded. To examine, and maybe modify, the gadget code, you have to select "Expand Widget Templates". To simply remove an entire gadget, on the other hand, do not select "Expand Widget Templates".

<div class='widget Gadget' id='Gadget1'>
<h2 class='title'>Maukie - the virtual cat</h2>

<div class='widget-content'>
<script type="text/javascript">
if (!window.gadgets || !gadgets.rpc) {
document.write('<script type="text/javascript"' +


'src="http://www.gmodules.com/gadgets/js/rpc.js?v\x3d9261b340ef5af1e5faca55914670c7\x26container\x3dblogger\x26debug\x3d0\x26c\x3d1">' 

+
'</scr' + 'ipt>');
}
</script>

...


</span>
</span>
<div class='clear'></div>
</div>

OK, the example above was heavily excerpted. If I was to include the entire code set for this one gadget, I would risk this post (my main page display) being subject to segmentation, caused by Auto Pagination. So, I gutted 95% of the interior code. But, you should get the idea.

The point is, when you need to remove malicious code, do not select "Expand Widget Templates". Then, find (as an example)

<div class='widget Gadget' id='Gadget1' />

and delete that one line.

Problem solved.

And next time, be more selective what gadgets you install in your blog.

>> Top

Editing The Blog Template

The template is like the skeleton of your body - you can't see it (easily), but the success of the blog depends upon its being there, and being structured properly.

If you're going to have a blog, and publish it effectively, eventually the dashboard Layout and the Template Designer pages won't do enough for you. You're going to want to get to the details, underneath the GUI processes.

You access the template editor using the dashboard Theme page, where you will find (among other options) the "Edit HTML" button.

Click on "Edit HTML".



Clicking on "Edit HTML", you may get a serious warning to read.

Directly editing HTML may affect the way some features work and is only recommended for advanced users. Editing template HTML may unpredictably affect other Blogger features. We recommend using the Template Designer first, where you can Add CSS under the Advanced section.

Should you choose to click on "Proceed", you'll be into the "Edit HTML" display.

Edit carefully. Some changes may require editing / removing multiple lines of code.



With a Classic template, you have just one major activity when you're in "Edit HTML" - and that's what the name suggests, you edit the HTML. You'll have some CSS code, but no XML - so it's all relatively straightforward.

With a Layout template, you'll have a few extra options.

• Backup ("Download a copy") the template.
• Upload the template ("Backup / Restore").
• Revert widget templates to default.
• Revert to classic templates.
• View classic template. If you started the blog with a classic template, and upgraded to layout, you can look here to find any left behind HTML accessories and tweaks. You can add as "HTML / JavaScript" gadgets, any well defined accessories and tweaks.

With a Designer template, you'll have one additional minor option.

• Revert the template to Layout.

And with a layout template, you'll have "Edit HTML", but with a few more tweaks than with a classic template. You'll have CSS and HTML - and XML - code to edit. And don't overlook the possibility of using HTML code in place of XML code, in a layout template.

One of the least understood selections in the Template "Edit HTML" wizard is the option to "Expand Widget Templates" , which has been replaced by selectively unfolding any gadget to be edited. Just understand when to unfold - and when to not unfold.

Remember that Blogger blogs offer many possibilities. Some code can be installed using HTML / JavaScript gadgets, as an alternative to adding code to the template using "Edit HTML".

And please, as always - backup the template, before and after using Template Editor.

Duplicate Blog Posts? Remove The Duplicate!

As a savvy consumer, you likely love to hear about offers for 2 for the price of 1, of something that you buy frequently. That's a great deal, normally.

It's not for blog posts, though.

When you start to see double in your blog, chances are that you duplicated the Blog Posts entry in the template. It's not hard to fix, fortunately.

Edit the blog template, using the dashboard Template - "Edit HTML" wizard. Do not expand or unfold any widgets.

If you unfold either 'Blog1' or 'Blog2', you will have to find the end of the unfolded gadget section, which could be hundreds of lines later. If you delete 1 too many, or 1 too few, unfolded lines, you will get a syntax error.

Error parsing XML: ... The element type "b:section" ...

Deleting just one line (see below) is way easier, believe me.

Look for two lines, in the Body of the template, which may or may not be immediately next to each other in sequence:

<b:widget id='Blog1' locked='true' title='Blog Posts' type='Blog'/>

...

<b:widget id='Blog2' locked='true' title='Blog Posts' type='Blog'/>

Remove:

<b:widget id='Blog2' locked='true' title='Blog Posts' type='Blog'/>

Leaving:

<b:widget id='Blog1' locked='true' title='Blog Posts' type='Blog'/>

Save the change. You will get a stern warning when you save, demanding that you confirm that you really want to delete "Blog2". Obviously, you do. And don't forget to clear browser cache, and restart the browser, to reliably test your change.

Remember to save a copy of the template, before and after doing this.

And now, since you're here, and if you just removed a duplicate post template from your blog, help me to help others, and think why you're here.

• What changes have you made, to the blog?
• What accessories have you installed?
• Any templates - Blogger or third party? - installed?
• Any changes between classic and layout templates?
• What Blogger features / wizards do you use?
  • Draft Blogger?
  • New, or Old, Post Editor?
• What third party services have you ever allowed to access the blog directly, to install something?

Solving this problem starts with you.

>> Top