Make it easy for others to add my custom gadget to their blog

Some of you may have a use-case similar to this blog, where you're suggesting that people add 3rd-party content to their blog. Fleshing out the instructions for

Add an HTML gadget, copy-paste the content...

can be very tedious. Instead, it's better if you just magically allow the user to do it themselves, with the click of a button!

Add Gadget request

Blogger hosts an endpoint for third-parties to easily forward the content that users might want to add in an HTML Gadget, at https://www.blogger.com/add-widget. 

This is an easy way to support your users adding the content is to create an HTML form that executes a get request, preloaded with the content - it's a form that lets the user select the blog that they want the gadget for.

<form action='https://www.blogger.com/add-widget' target='_blank'>
  <input type='hidden' name='widget.title' value='[Your widget title]' />
  <input type='hidden' name='widget.content' value='[Your widget content]' />
  <input type='submit' value='Add this to my blog!' />
</form>

Note: The widget.content itself being inline can be annoying, because you'll have to HTML escape it.

Custom Markup

Custom HTML markup, which is processed by the Layouts template engine, can be specified using the widget.template input. This is often useful for things like hiding the widget itself (in CSS) since it only contains JS, but you still want to give it a title to identify which HTML gadget it is.

<form action="https://www.blogger.com/add-widget">
  <input name="widget.title" type="hidden" value="Hidden gadget" />
  <input name="widget.content" type="hidden"
       value="&lt;script type='text/javascript'&gt;alert('Hello world!')&lt;/script&gt;" />
  <input name="widget.template" type="hidden"
       value="&lt;b:includable id='main'&gt;
  &lt;style&gt;#&lt;data:widget.instanceId /&gt;{display: none}&lt;/style&gt;
  &lt;b:include name='super.main' /&gt;
&lt;/b:includable&gt;" />
  <input class="flat-button" type="submit" value="Add hidden gadget to my blog!" />
</form>

Example - Hello world

The following example adds an HTML gadget with the following contents.

<script type='text/javascript'>alert('Hello world!')</script>

The full code for the form is shown below - note the < / > HTML tag escaping.

<form action="https://www.blogger.com/add-widget">
  <input name="widget.title" type="hidden" value="Hello World!" />
  <input name="widget.content" type="hidden"
       value="&lt;script type='text/javascript'&gt;alert('Hello world!')&lt;/script&gt;" />
  <input class="flat-button" type="submit" value="Add 'Hello World' to my blog!" />
</form>