The latest tips and news from the Blogger team
Improvements to the Blogger template HTML editor
April 09, 2013
Posted by:
+Samantha Schaffer
and
+Renee Kwang
, Software Engineer Interns.
Whether you’re a web developer who builds blog templates for a living, or a web-savvy blog owner who prefers to make changes to your template using HTML, CSS or JavaScript, you may be interested in some enhancements that we made to
Blogger’s Template HTML Editor
.
Your blog’s HTML template is the source code that controls the appearance of your blog. This template can be customized to appear however you’d like. The improved HTML template editor now supports line numbering, syntax highlighting, auto-indentation and code folding to make editing your template much easier.
Suppose we wanted to move the date of a blog post underneath the post title, similar to the
Blogger Buzz blog
. To do this, follow these steps:
Click the “Template” tab on the Blogger dashboard, then the “Edit HTML” button, to see the new template HTML editor:
Locate the “Blog1” widget quickly using the new “Jump to widget” drop down:
This widget controls how your blog posts are displayed. The code inside the widget is folded by default. Clicking the new fold markers ‘►’ next to the line numbers expands the widget and reveals a set of “includable” tags:
Inside the “main” includable is the block of code that renders the post date:
Cut the post date code section and move it to where we want it, in this case, under the post title in the “post” includable:
To check our changes, click the new “Preview template” button to see the updates:
The post date is exactly where we want it, so tab back to “Edit template”, hit “Save template” and we’re done!
Finally, we’ve added a “Format template” button that automatically cleans up the indentation of the template, and made it possible to search for text by pressing “Ctrl+F” once you’ve clicked into the editor. To find and replace text occurrences one by one, use “Ctrl+Shift+F” or to find and replace all occurrences at once, use “Ctrl+Shift+R”.
We worked on this project as part of Google Australia’s
BOLD Diversity Internship Program
. We hope you enjoy the changes we’ve made!
(Cross-posted from the
Blogger Developers Network
)
Contribute Gadgets to Blogger
July 08, 2009
(cross posted from
Blogger In Draft
)
Calling all Developers! We've just launched several extensions to the Gadget API that will enable developers to build more relevant and engaging gadgets for Blogger.
As you may already know, every Blogger blog is a gadget container. What's more, every blog is an OpenSocial gadget container powered by
Friend Connect
. This means that as a gadget developer you can leverage social APIs to build engaging tools for bloggers and their audience.
In addition to leveraging social data, gadgets can now
access a blog's post and comment feed
via new JSON APIs. For example, with this data you could easily build a map gadget that maps the geo-location of posts, or a "Most Commented On" gadget that ranks posts by the number of comments they've received.
Need to be inspired? Recently we asked our users what gadgets they most wanted to see in Blogger. Hundreds responded and
here's their wish list
.
When you build a gadget for Blogger, it becomes available to millions of active bloggers. Just submit your gadget to us, and within minutes it will surface in the Blogger gadget directory where users can easily browse, configure, and add your gadget to their blog's sidebar.
So now that you know Blogger is a great distribution platform for your gadget, what are you waiting for?
Get started building Gadgets for Blogger now
.
Important Note
: The APIs and documentation are new, so there may be bugs. Let us know by posting to the Blogger Developer Group if you run into problems developing your gadget.
Labels
+1
3
10th Birthday
13
2010
1
accessibility
1
ads
1
adsense
7
Amazon
1
Android
2
Blog2Print
1
Blogger
26
Blogger birthday
1
Blogger Fiesta
2
Blogger Meetup
2
Blogger Stats
2
Blogger Template Designer
1
Blogger2Print
1
blogspot
2
BlogThis
1
blogworld
2
Buzz
1
calendar
1
Chrome
2
code
1
commenting
2
community
8
conference
2
custom domain
1
developers
2
DMCA
1
draft
1
dynamic views
5
events
2
feedburner
2
feeds
1
firefox
1
follow by email
1
following
2
foxytunes
1
FTP
1
gadgets
10
GAN
3
Google Analytics
1
Google Buzz
1
Google Sites
1
google+
10
grandcentral
1
help
2
ios
1
jump
1
knol
1
lightbox
1
mobile
5
monetize
3
music
1
navbar
2
New UI
4
next blog
1
OneTrueFan
1
openid
1
OpenSky
1
Page Creator
1
pages
1
pixelodeon
1
polls
1
post summaries
1
read more
1
recommend
1
SEO
2
Share
3
support
1
SXSW
1
template designer
2
twitter
1
video
2
videoblogging
1
Viglink
1
web fonts
1
webcall
1
youtube
3
zemanta
1
Archive
2020
May
2019
Jan
2018
May
2017
Mar
2016
Nov
May
Apr
Mar
2015
Dec
Sep
Jun
May
Jan
2014
Feb
2013
Dec
Sep
Aug
Jun
Apr
2012
Dec
Nov
Oct
Sep
Aug
Jul
Jun
May
Apr
Mar
Feb
Jan
2011
Dec
Nov
Oct
Sep
Aug
Jul
Jun
May
Apr
Mar
Feb
Jan
2010
Dec
Nov
Oct
Sep
Aug
Jul
Jun
May
Apr
Mar
Feb
Jan
2009
Dec
Nov
Oct
Sep
Aug
Jul
Jun
May
Apr
Mar
Feb
Jan
2008
Dec
Nov
Oct
Sep
Aug
Jul
Jun
May
Apr
Mar
Feb
Jan
2007
Dec
Nov
Oct
Sep
Aug
Jul
Jun
May
Apr
Mar
Feb
Jan
2006
Dec
Nov
Oct
Sep
Aug
Jul
Jun
May
Apr
Mar
Feb
Jan
2005
Dec
Nov
Oct
Sep
Aug
Jul
Jun
May
Apr
Mar
Feed
