Custom Themes - Posterous for Developers

Global Elements

This is a listing of all the {Elements} that you can use anywhere on a theme file. There are many you can use only in certain Blocks, so that's detailed in the next section.

Name	Description
{PageTitle}	Page title to be used in your <title> tag on your page. e.g. joe's posterous - Article name here'
{Title}	Name for your site e.g. joe's site
{Description}	Subheading / description for the site e.g. 'A place for my thoughts and ideas', if set
{Favicon}	URL to default Posterous 16x16px favicon:
{RSS}	URL to the RSS feed for posts, e.g. http://yoursite.posterous.com/rss
{PosterousBar}	Deprecated.
{PosterousURL}	URL to Posterous homepage (http://posterous.com)
{SiteURL}	URL to your Posterous homepage, e.g http://yoursite.posterous.com
{BlogURL}	URL to your Posterous blog, e.g http://yoursite.posterous.com/blog
{CurrentURL}	URL for the current page a reader would be on, no matter what page they might be looking at, e.g. post list page, post page, tag page or search page -- e.g. http://yoursite.posterous.com/tag/my-tag
{PortraitURL}	URL for profile image of the site owner. Can also specify PortraitURL-35 or PortraitURL-75 to get those respective sizes.
{Profile}	Text of site owner's user profile
{ProfileLink}	URL to site owner's user profile
{ProfileExternalLinks}	Returns HTML of linked images of each autopost service the site owner has set up, linked to their respective autopost sites
{OwnerName}	The name of the site owner, e.g. 'Garry Tan'
{Tag}	Current tag that the site viewer is seeing, e.g. 'My Tag'
{GlobalTagURL}	URL to link to the Posterous Global Tag search for the current tag
{SiteViews}	Number of times a site has been viewed
{CurrentPage}	Current page number, e.g. 1
{TotalPages}	Total number of pages, e.g. 10
{SearchQuery}	Text of a user's search query, e.g. 'hammocks'
{SearchSort}	Type of search sort, e.g. 'bestmatch'
{PageType}	Returns 'list', 'show', 'tag', 'search', or 'page', depending on which type of page you are currently viewing. This is best used for styling particular HTML elements depending on what type of page is being viewed.
{PageTitleCssEscaped}	Identical to PageTitle, except the string is represented as an escaped UTF-8 hex string
{TitleCssEscaped}	Identical to Title, except the string is represented as an escaped UTF-8 hex string

Blocks

There are two types of blocks -- blocks that can appear anywhere within a theme, and blocks that have to do with a blog post itself.

Top level blocks
These are blocks that can appear anywhere in the theme. They usually have something to do with the site, or the current page that the user is on, whether it is a tag page, search page, listing page, or blog post page.

Post-level blocks
These are blocks that can appear in {block:ShowSidebar}, {block:Show} and {block:Posts}. These are blocks that pertain specifically to a post itself.

Name	Description
PosterousBar	Useful for customization of the Posterous Bar
Posts	Defines active post area, loops over every post to be shown
Flash	Deprecated
HeaderImage	Shown if there's a header image defined for the site
ListSidebar	Shown for post listing pages
List	Shown for post listing pages (same as ListSidebar)
ShowSidebar	Shown for post pages
Show	Shown for post pages (same as ShowSidebar)
Description	Description / subheading
Pagination	To show page numbers and navigation
PreviousPage	Link to previous page
NextPage	Link to next page
Tag	Contents shown if visitor is viewing a tag
TagList	Contents shown if there's a tag to show
TagListing	Loops over each tag to be shown
TagListingMore	Contents shown if there are additional tags to expand
TagItem	A tag item itself, not selected
TagItemSelected	A tag item itself, shown if selected
Contributors	Shown if there are contributors for a site
Contributor	Loops over contributors for a site
ContributorMore	Contents shown if there are additional contributors to expand
AutopostSites	Returns true if there are autopost sites to be shown.
SearchPage	Shown if the user has done a search
Search	Shown if the user has done a search (same as SearchPage)
SearchResultMany	Shown if there are more than 1 search results
SearchResultNone	Shown if there are no search results
SearchResultOne	Shown if there is one search result
SearchSortBestmatch	Shown if the search sort is Best Match
SearchSortInteresting	Shown if the search sort is Most Interesting
SearchSortRecent	Shown if the search sort is Most Recent
NotSearchOrTag	Shown if the site viewer has not selected a search or a tag
Subscription	Allows a user to subscribe or unsubscribe
SubscriptionLoading
SubscriptionSubscribed	Shown only if a viewer is following this Space
SubscriptionUnsubscribed	Shown only if a viewer is not following
SubscriptionAdmin	Shown only if a viewer is the admin of the Space.
SubscriptionContributor	Shown only if a viewer is a contributor to the Space.
SubscriptionNonUser	Shown only if a viewer is not logged in to the Space.
SearchBox	Interactivity for search input box
ShowOnClick	Interactivity for showing a hidden div when the user clicks on something
ShowOnHover	Interactivity for showing a hidden div when the user moves their mouse over something
IndexPage	Shown for post listing pages (same as ListSidebar, shown for Tumblr theme compatibility)
HasPages	The contents of this block are rendered only if this site has pages.
Pages	Loops through all pages for the purpose of page navigation.
HasLinks	The contents of this block are rendered only if this site has links.
Links	Loops through all links in a category for the purpose of navigation.
ShowOrList	Shown for post pages and list pages.
Page	Shown for static pages only.
Homepage	Shown for the post listing page of a site only
LinkCategories	Loops through all link categories for the purpose of link navigation.
Archive	Loops through all archives for the purpose of navigation.
HasArchives	The contents of this block are rendered only if this site has archives.
ArchiveYear	Loops through all archives for the purpose of navigation.
ArchiveMonth	Loops through all archive months for the purpose of navigation.
ArchiveList	Contents shown if visitor an archive
HasAdsense	The contents of this block are rendered only if this site has Adsense Enabled.
PosterousHeader	Useful for positioning of the Posterous Bar

Name	Description
Author	Show info about the author of the post
AuthorUser	Shown if post is written by a registered user
AuthorEmail	Shown if post is written by an email submission by a user who is not registered
Title	Shown if there is a title for a post.
PostSummary	Used for theme compatibility only.
Text	Used for theme compatibility only.
Regular	Used for theme compatibility only.
Responses	Shown for responses
ResponsesList	Shown for responses on post list pages
ResponsesShow	Shown for responses on post pages
NoteCount	Shown for comments (theme compatibility)
PostNotes	Shown for comments (theme compatibility)
NewDayDate	Used for theme compatibility only.
SameDayDate	Used for theme compatibility only.
Private	Contents shown only if post is marked as private
SMS	Contents shown only if post was sent via SMS
EditBox	Links for site owners to perform admin actions on posts
More	Allows for customization of the Read More section of an excerpted block. Is not shown if there is no excerpt shown / needed.
Favorite	Interactivity for allowing logged in users to favorite posts
Fans	Shown if there are fans (people who have faved) of a particular site post
Fan	Loops over fans of a post. A fan is a Posterous user who has favorited the post.
PostLocations	Shown if the post has location data
PostLocation	Loops over post locations
BodyExcerpt	Experimental tag for showing excerpts. Subject to change.
BodyExcerptReadMore	Allows for customization of the Read More section of an excerpted block. Is not shown if there is no excerpt shown / needed.
PostImage	Show a summary post image
Tweet	Add Twitter's official Tweet button
FbLike	Add the fb:like button to your posts.
Sharing	Contents shown only if social sharing is enabled (Twitter, Facebook, etc.)
ViaMobile	The contents of this block are rendered only if the post was created via a mobile app (iPhone, Android, etc.).

Block

PosterousBar

Useful for customization of the Posterous Bar

Can be used inside
Any block

This allows for customization of the posterous bar. You can use this to cause the bar to fly out left or right, and/or make the default state clear vs. opaque.

If omitted, we just put a default clear, left-flyout posterous bar in the top right corner of the page.

Example

{block:PosterousBar direction="right" translucent="false"}{/block:PosterousBar}

Parameters

Name	Description
direction	(optional) May be 'left' or 'right' -- defaults to right.
translucent	(optional) May be 'true' or 'false', defaults to 'true'

Elements

Elements that you can reference in this block also include Global Elements

Block

Posts

Defines active post area, loops over every post to be shown

Can be used inside
Any block

A Posts block wraps the entire area for a post. On a Post Listing page (e.g. http://yourblog.posterous.com/), this will loop over every post on a given page.

For examples and more information, please take a look at our Intro by Example to see how a {block:Posts}{/block:Posts} works.

Example

                {block:Posts}...{/block:Posts}

Elements

These are all elements that you can use in any {block:Posts/}. They can also be used in any {block:ShowSidebar/} or {block:Show/} blocks as well.

Note that that these elements apply to everything inside the block and all child blocks that are contained within it as well.

Name	Description
{Title}	Title of the post
{Body}	Body of the post (full text / HTML)
{PostID}	Unique identifier for the post (e.g. 719390)
{PostViews}	Number of views the post has received thus far, not including the user's own views.
{FavoriteCount}	Number of times the post has been favorited
{TagsAsClasses}	If the post has tags, then it will return all of the tags of that post as items you can use in classes. This is useful if you want to theme a post based on the type of tag it has. We will replace all spaces in tags with underscore (_) characters. e.g. Tag 1, Tag 2, Tag 3 translate to the text: 'Tag_1 Tag_2 Tag_3'
{Permalink}	This is the URL link to your post. e.g. http://yourblog.posterous.com/article-name
{ShortPermalink}	This is the post.ly URL short link to your post. e.g. http://post.ly/...
{ResponseCount}	Shows number of responses for this post.
{ResponseCountPluralized}	Returns an s if there is more than one response on the post. Useful for pluralization, e.g. 0 responses, 1 response, 2 responses
{PostAuthorPortraitURL}	This is the URL to a portrait for the author of this post. You can also specify PostAuthorPortraitURL-35 or PostAuthorPortraitURL-75 to get the two sizes of portraits we support. You can use PostAuthorPortraitURL-XX where XX is any number, but we'll just choose the most appropriate size available.
{DayOfMonth}	Based on the display date of the post. e.g. '1' to '31'
{DayOfMonthWithZero}	Based on the display date of the post. e.g. '01' to '31'
{DayOfMonthSuffix}	Based on the display date of the post. Ordinalized suffix for DayOfMonth, e.g. 'st', 'nd', 'th', 'rd'
{DayOfWeek}	Based on the display date of the post. e.g. 'Monday' to 'Sunday'
{ShortDayOfWeek}	Based on the display date of the post. e.g. 'Mon' to 'Sun'
{DayOfWeekNumber}	Based on the display date of the post. e.g. '0' to '6'
{DayOfYear}	Based on the display date of the post. e.g. '1' to '366'
{WeekOfYear}	Based on the display date of the post. e.g. '1' to '53'
{Month}	Based on the display date of the post. e.g. 'January' to 'December'
{ShortMonth}	Based on the display date of the post. e.g. 'Jan' to 'Dec'
{MonthNumber}	Based on the display date of the post. e.g. '1' to '12'
{MonthNumberWithZero}	Based on the display date of the post. e.g. '01' to '12'
{Year}	Based on the display date of the post. e.g. '2009'
{ShortYear}	Based on the display date of the post. e.g. '09'
{AmPm}	Based on the display date of the post. e.g. 'am', 'pm'
{CapitalAmPm}	Based on the display date of the post. e.g. 'AM', 'PM'
{12Hour}	Based on the display date of the post. e.g. '1' to '12'
{24Hour}	Based on the display date of the post. e.g. '0' to '23'
{12HourWithZero}	Based on the display date of the post. e.g. '01' to '12'
{24HourWithZero}	Based on the display date of the post. e.g. '00' to '23'
{Minutes}	Based on the display date of the post. e.g. '00' to '59'
{Seconds}	Based on the display date of the post. e.g. '00' to '59'
{Timestamp}	Based on the display date of the post. Shown in Unix Epoch time (number of seconds since 1970) e.g. '1244609779'
{TimeAgo}	Based on the display date of the post. e.g. '10 minutes ago' or '3 hours ago' or '2 months ago'
{NoteCount}	Shows number of comments for this post. (tumblr compatibility only -- posterous themes should use block:Comments instead)
{NoteCountWithLabel}	Number of comments with a label, e.g. "24 comments" (tumblr compatibility only -- posterous themes should use block:Comments instead)
{EventMap}	A Google Map for Events About page. There must a location associated with the site and there must be a page with the title "About" in order to display the map.

Elements that you can reference in this block also include Global Elements

Block

Flash

Deprecated

Can be used inside
Any block

This block is no longer supported and will be ignored.

Example

                {block:Flash}...{/block:Flash}

Elements

Name	Description
{Flash}	Deprecated

Elements that you can reference in this block also include Global Elements

Block

HeaderImage

Shown if there's a header image defined for the site

Can be used inside
Any block

This block will show one set of code if a site has a header image set, and will show a different block of code (after the {Else}) if a header image is not set.

If this block is omitted, users of the theme will not be shown options to set a header image when that theme is selected.

Example

            		{block:HeaderImage}
            			<a href="{SiteURL}" style="border: none;">
            			  <img src="{HeaderImageURL}" alt="{Title} - {Description}"/>
            			</a>
            		{Else}
            			<div class="header">
            				<h1><a href="{SiteURL}">{Title}</a></h1>
            			</div>

            			<div class="subhead">	  		
          					{Description} 
            			</div>
            		{/block:HeaderImage}

Elements

Name	Description
{HeaderImageURL}	URL for the image to show. If you'd like a scaled version of this image, you can also ask for HeaderImageURL-500, or HeaderImageURL-1000 to get images scaled to those maximum dimensions (500x500 and 1000x1000). You can use {HeaderImageURL} on its own if you want to be able to use images of any size, based on whatever the user has given.
{Else}	Else clause. All things after this will be shown only if there is no header image for this site.

Elements that you can reference in this block also include Global Elements

Block

ListSidebar

Shown for post listing pages

Can be used inside
Any block

A list page is the post index page. Contents of this block are only shown on a listing page, e.g. the url http://yoursite.posterous.com/

Note that {block:ListSidebar} is the same as {block:List}.

Example

                {block:ListSidebar}...{/block:ListSidebar}

Elements

Elements that you can reference in this block also include Global Elements

Block

List

Shown for post listing pages (same as ListSidebar)

Can be used inside
Any block

See {block:ListSidebar}.

Example

                {block:List}...{/block:List}

Elements

Elements that you can reference in this block also include Global Elements

Block

ShowSidebar

Shown for post pages

Can be used inside
Any block

A Show page is the post page. Contents of this block are only shown on a post page, e.g. the url http://yoursite.posterous.com/your-article

Also see: see {block:Show}.

Example

                {block:ShowSidebar}...{/block:ShowSidebar}

Elements

Elements that you can reference in this block also include Global Elements

Block

Show

Shown for post pages (same as ShowSidebar)

Can be used inside
Any block

Anything within {block:Show} will be shown on post pages as well as static pages.

If you want something to be shown only on post pages, see {block:ShowSidebar}.

Example

                {block:Show}...{/block:Show}

Elements

Elements that you can reference in this block also include Global Elements

Block

Description

Description / subheading

Can be used inside
Any block

Included for compatibility with Tumblr themes. Not recommended for Posterous theme use.

Example

                {block:Description}{Description}{/block:Description}

Elements

Elements that you can reference in this block also include Global Elements

Block

Pagination

To show page numbers and navigation

Can be used inside
Any block

This is an example of the default pagination block:

To theme this default pagination block, customize this CSS:

.pagination {
  padding: 3px;
  margin: 3px;
}
.pagination a {
  padding: 2px 5px 2px 5px;
  margin: 2px;
  border: 1px solid #ccc;
  text-decoration: none;
  color: #ccc;
}
.pagination a:hover, .pagination a:active {
  border: 1px solid #ca9d00;
  color: #ca9d00;
}
.pagination span.current {
  padding: 2px 5px 2px 5px;
  margin: 2px;
  font-weight: bold;
border: 1px solid #ca9d00;
  background-color: #ca9d00;
  color: #FFF;
}
.pagination span.disabled {
  padding: 2px 5px 2px 5px;
  margin: 2px;
  border: 1px solid #eee;
  color: #ddd;
}

Examples

                {block:Pagination/}

This will place a default block for pagination, as shown above.

                {block:Pagination}
                  
                  {block:PreviousPage}
                    <a href="{PreviousPage}">Previous</a>
                  {/block:PreviousPage}

                  {CurrentPage} of {TotalPages}
                  
                  {block:NextPage}
                    <a href="{NextPage}">Next</a>
                  {/block:NextPage}
                  
                {/block:Pagination}

This is an example of overriding the default behavior of the pagination block by supplying content. It is mainly supported for compatibility with Tumblr themes. If you want to just use it in your Posterous theme, use of the Pagination block is optional -- you can just use {block:PreviousPage} and {block:NextPage} on its own.

Elements

Elements that you can reference in this block also include Global Elements

Block

Link to previous page

Can be used inside
Any block

This block allows you to refer to to a URL with the next page. It will not appear if there is no previous page, e.g. you are on page 1. It will also only appear on post listing pages.

Example

                {block:PreviousPage}  
                  <a href="{PreviousPage}">Previous</a>  
                {/block:PreviousPage}

Elements

Name	Description
{PreviousPage}	URL for the previous page in this series.

Elements that you can reference in this block also include Global Elements

Block

Link to next page

Can be used inside
Any block

This block allows you to refer to to a URL with the previous page. It will not appear if there is no next page, e.g. you are on the last page of the post list. It will also only appear on post listing pages.

Example

                {block:NextPage}  
                  <a href="{NextPage}">Next</a>  
                {/block:NextPage}

Elements

Name	Description
{NextPage}	URL for the next page in this series.

Elements that you can reference in this block also include Global Elements

Block

Tag

Contents shown if visitor is viewing a tag

Can be used inside
Any block

This is an example of a tag block that might appear in a site theme:

This content would be shown only if the user had selected a tag to be viewed. An example URL for this would be http://garry.posterous.com/tag/productdesign.

Example

          			{block:Tag}
                  Filed under 
                  <h2 style="margin-top: 0px; color: #111">{Tag}</h2>
                  <a href="{GlobalTagURL}" style="display: none;" id="see_all_tags">
                    See all posts on posterous with this tag »
                  </a> 
          			{/block:Tag}

This example shows the markup used for the above screenshot. {Tag} and {GlobalTagURL} are two of the global elements that are most useful when used in this block.

Elements

Elements that you can reference in this block also include Global Elements

Block

TagList

Contents shown if there's a tag to show

Can be used inside
Any block

This is a wrapper block to be used with {block:TagListing} (see below)

It can be used both at the top-level (shows contents only if the site has at least one tag defined) and in the context of a post (shows contents only if the post has at least one tag).

Example

                {block:TagList}...{/block:TagList}

Elements

Name	Description
{NumTags}	The total number of tags on a site. Appears only when {block:TagList/} is not a child of {block:Posts}

Elements that you can reference in this block also include Global Elements

Block

TagListing

Loops over each tag to be shown

Can be used inside
{block:TagList/}

Want to list the tags for a given post or site? This is the block to use!

TagListings are actually quite versatile -- they can be used in two different contexts. One is at the top level, often as a navigational element in {block:ListSidebar}:

They can also be used to display tags for a given post, as a child of {block:Posts} when viewing a post:

The enclosed content in this block is only shown if tags exist for the site or for the post. This block will loop over each tag for a given site or post.

Also, this is a block that actually takes parameters -- you can control how many tags are shown. If the number of items is exceeded, you can also specify interactivity that can allow the site visitor to expand the list to see all of them.

Examples

{block:TagList}
	<div class="list-tags" style="margin-top: 30px;">
	<h5>Tags</h5>

	<ul style="margin-top: 0px;">
		{block:TagListing collapsible='true' count='10' action_id='seemore_link'}

			{block:TagListingMore}
				<li><a href="#" id='seemore_link'>View all {NumTags} tags »</a></li>
			{/block:TagListingMore}

			{block:TagItem}
				<li><a href="{TagLink}">{TagName}</a> <span class="instances">({TagCount})</span></li>
			{/block:TagItem}

			{block:TagItemSelected}
				<li><b style="color: #444;">{TagName}</b>  <span class="instances">({TagCount})</span></li>
			{/block:TagItemSelected}

		{/block:TagListing}
	</ul>
	</div>
{/block:TagList}

This is the markup needed to produce the screenshot above for viewing tags for a whole site.

Note how we pass parameters to the TagListing block -- the action_id references the seemore_link, which is a link inside the TagListingMore block. The theme engine will now register that anchor link as the activator to expand the list of tags, should the number of tags exceed 10.

Also, notice that there is a difference between TagItem and TagItemSelected -- this is how we cause a bold state to occur when the item is selected.

  							{block:TagList}
  							  <div style="font-size: 11px; line-height: 14px; color: #aaa; margin-top: 20px;">
  							    <b>Filed under</b>  //  
  							      {block:TagListing}
  							        <a href="{TagLink}" style="color: #666">{TagName}</a>  
  							      {/block:TagListing}
  							  </div>     
  							{/block:TagList}

This is the markup needed to produce the screenshot above for viewing tags for a given post. It's much simpler because we don't specify a maximum number of tags and thus there is no collapsible interactivity. Notice that we wrap the whole thing using {block:TagList} so that it doesn't appear if there are no tags for that post.

Parameters

Name	Description
collapsible	Pass true/false. This will determine if the block will add javascript interactivity to enable an expandable view of all tags. Default is true.
count	For listing tags for a site, the default is 10. For listing tags for a post, the default is null, denoting no limit.
action_id	When collapsible is set to true, you should pass the id of the anchor link that will cause the tag area to expand.

Elements

Name	Description
{TagName}	Text of the tag, e.g. 'Product Design'
{TagLink}	URL to this tag, e.g. http://garry.posterous.com/tag/startups
{TagCount}	The number of times this tag appears for this post or site, e.g. 4. Only appears when listing tags for the site, and not for viewing tags in a {block:Posts/}

Elements that you can reference in this block also include Global Elements and {block:TagList/}

Block

TagListingMore

Contents shown if there are additional tags to expand

Can be used inside
{block:TagListing/}

Shows contents only if there are additional tags that are collapsed and need to be expanded. Typically this contains a link that says "more" or "view all".

Example

  	{block:TagListing collapsible='true' count='10' action_id='seemore_link'}

  		{block:TagListingMore}
  			<li><a href="#" id='seemore_link'>View all {NumTags} tags »</a></li>
  		{/block:TagListingMore}

  		...

  	{/block:TagListing}

This is shown only if there are more tags to be listed that are currently collapsed, e.g. if 'collapsible' is set to true and 'count' is set to some number that is less than the number of tags that exist for this post or site.

Notice how action_id is set to the anchor link inside this block. This is how you tell the theme engine what to make clickable for an expansion of the collapsed tags.

Elements

Elements that you can reference in this block also include Global Elements, {block:TagListing/}, and {block:TagList/}

Block

TagItem

A tag item itself, not selected

Can be used inside
{block:TagListing/}

This block is used to denote a tag item that is not selected. It's an optional block, so if you just want to show a tag item even if it's not selected, just omit this block entirely.

Note also that this only applies to top level blocks when viewing tags for the whole site. It won't work when inside a Posts block.

Examples

{block:TagListing}
  {block:TagItem}
    <li><a href="{TagLink}">{TagName}</a> <span class="instances">({TagCount})</span></li>
  {/block:TagItem}
{/block:TagListing}

Shows only if this tag item is NOT currently being viewed by the user.

{block:TagListing}
  <li><a href="{TagLink}">{TagName}</a> <span class="instances">({TagCount})</span></li>
{/block:TagListing}

This shows how you can omit the TagItem. This would cause the tag to show up even if the site viewer was viewing that tag.

Elements

Elements that you can reference in this block also include Global Elements, {block:TagListing/}, and {block:TagList/}

Block

TagItemSelected

A tag item itself, shown if selected

Can be used inside
{block:TagListing/}

This is the exact opposite of TagItem -- it shows its contents only when the site viewer is viewing a tag page.

Same rules apply -- it's optional and you can also just omit using TagItem and TagItemSelected inside a TagListing block if you just want the tag to show up all the time.

Note also that this only applies to top level blocks when viewing tags for the whole site. It won't work when inside a Posts block.

Example

{block:TagListing}
  {block:TagItemSelected}  
      <li><b style="color: #444;">{TagName}</b>
      <span class="instances">({TagCount})</span></li>  
  {/block:TagItemSelected}
{/block:TagListing}

Shows only if this tag item is currently being viewed by the user.

Elements

Elements that you can reference in this block also include Global Elements, {block:TagListing/}, and {block:TagList/}

Block

Contributors

Shown if there are contributors for a site

Can be used inside
Any block

If there are contributors other the owner of the site, this block will be shown.

Here's what this block would look like:

Example


{block:Contributors}
    <h5>Contributors</h5>

    <ul class="contributors">
    {block:Contributor collapsible='true' count='5' action_id='seemore_contribs_link'}
    
      {block:ContributorMore}
          <li><a href="#" id="seemore_contribs_link">View all {NumContributors} contributors »</a></li>
      {/block:ContributorMore}
        
      <li>
        <a href="{ContributorProfileLink}">
            <img src="{ContributorPortraitURL-20}" />
        </a> 
        <a href="{ContributorProfileLink}">
            {ContributorName}
        </a>
      </li>                                        
    {/block:Contributor}
    </ul>
{/block:Contributors}

Elements

Elements that you can reference in this block also include Global Elements

Block

Contributor

Loops over contributors for a site

Can be used inside
Any block

This will actually loop over each contributor for a site, if it exists.

See {block:Contributors} for a detailed example.

Example

                {block:Contributor}...{/block:Contributor}

Elements

Name	Description
{ContributorPortraitURL}	URL for the portrait image for this user. Choose between ContributorPortraitURL-35 and ContributorPortraitURL-75 for the two sizes of user profile images.
{ContributorName}	Display name of contributor, e.g. Garry Tan
{ContributorProfile}	Text of user profile of contributor
{ContributorProfileLink}	URL link to profile page of the contributor
{NumContributors}	The total number of contributors on a site.

Elements that you can reference in this block also include Global Elements

Block

ContributorMore

Contents shown if there are additional contributors to expand

Can be used inside
{block:Contributor/}

Shows contents only if there are additional contributors that are collapsed and need to be expanded. Typically this contains a link that says "more" or "view all contributors".

Example

                {block:Contributor collapsible='true' count='5' action_id='seemore_contribs_link'}
                  {block:ContributorMore}
                      <li><a href="#" id="seemore_contribs_link">View all {NumContributors} contributors »</a></li>
                  {/block:ContributorMore}
                  
                  ...
                                                                      
                {/block:Contributor}

This is shown only if there are more contributors to be listed that are currently collapsed, e.g. if 'collapsible' is set to true and 'count' is set to some number that is less than the number of contributors that exist for this site.

See {block:Contributors} for a detailed example.

Notice how action_id is set to the anchor link inside this block. This is how you tell the theme engine what to make clickable for an expansion of the collapsed contributors.

Elements

Elements that you can reference in this block also include Global Elements and {block:Contributor/}

Block

AutopostSites

Returns true if there are autopost sites to be shown.

Can be used inside
Any block

The contents of this block are only shown

Example

{block:AutopostSites}
  <h5>My Other Sites</h5>
  {ProfileExternalLinks}
{/block:AutopostSites}

Original way to output autopost sites as links.

Elements

Elements that you can reference in this block also include Global Elements

Block

SearchPage

Shown if the user has done a search

Can be used inside
Any block

This will be shown only if the user has entered a search.

SearchPage and Search are synonyms for the same block.

Example

{block:SearchPage}
	<h3>
		{block:SearchResultOne}
			One result found searching for
		{/block:SearchResultOne}

		{block:SearchResultMany}
			{SearchResultCount} results found searching for
		{/block:SearchResultMany}

		{block:SearchResultNone}
			No results found searching for
		{/block:SearchResultNone}
	</h3>
	<form method='get'>
		<input type='hidden' name='sort' value="{SearchSort}"/>
		<input type='text' name='search' value='{SearchQuery}' id="searchbox"/>
		<input type='submit' value='Search' class="searchbox_button" id="searchbox_button"/>
		  <a href="{CurrentURL}">clear</a>
	</form>

	<ul>
			<li style="margin-left: 0px;">Sort by</li>
			<li>
			  {block:SearchSortBestmatch}
			    <b>Best match</b>
			  {Else}
			    <a href="{CurrentURL}?search={SearchQuery}&sort=bestmatch">Best match</a>
			  {/block:SearchSortBestmatch}
			</li>
			<li>
			  {block:SearchSortRecent}
			    <b>Most recent</b>
			  {Else}
			    <a href="{CurrentURL}?search={SearchQuery}&sort=recent">Most recent</a>
			  {/block:SearchSortRecent}
			</li>
			<li>
			  {block:SearchSortInteresting}
			    <b>Most interesting</b>
			  {Else}
			    <a href="{CurrentURL}?search={SearchQuery}&sort=interesting">
			      Most interesting
			    </a>
			  {/block:SearchSortInteresting}
			</li>
	</ul>
	<br/>
	<a href="{PosterousURL}/explore/?search={SearchQuery}">
	  Search all of posterous for <b>{SearchQuery}</b> »
	</a>

{/block:SearchPage}

Shows only if this tag item is currently being viewed by the user.

Elements

Name	Description
{SearchQuery}	Text of the user's search query. e.g. 'red herrings'
{SearchResultCount}	The number of posts that are returned by the search
{SearchSort}	The type of search that was performed, e.g. bestmatch, interesting, recent
{Else}	Everything after this tag will show if it is NOT a search page.

Elements that you can reference in this block also include Global Elements

Block

Search

Shown if the user has done a search (same as SearchPage)

Can be used inside
Any block

This is a synonym for the SearchPage block.

See {block:SearchPage}

Elements

Elements that you can reference in this block also include Global Elements

Block

SearchResultMany

Shown if there are more than 1 search results

Can be used inside
{block:SearchPage/}

See {block:SearchPage}

Example

                {block:SearchResultMany}...{/block:SearchResultMany}

Elements

Elements that you can reference in this block also include Global Elements and {block:SearchPage/}

Block

SearchResultNone

Shown if there are no search results

Can be used inside
{block:SearchPage/}

See {block:SearchPage}

Example

                {block:SearchResultNone}...{/block:SearchResultNone}

Elements

Elements that you can reference in this block also include Global Elements and {block:SearchPage/}

Block

SearchResultOne

Shown if there is one search result

Can be used inside
{block:SearchPage/}

See {block:SearchPage}

Example

                {block:SearchResultOne}...{/block:SearchResultOne}

Elements

Elements that you can reference in this block also include Global Elements and {block:SearchPage/}

Block

SearchSortBestmatch

Shown if the search sort is Best Match

Can be used inside
{block:SearchPage/}

This is shown only if the search sort is set to Best Match

See {block:SearchPage}

Example

                {block:SearchSortBestmatch}...{/block:SearchSortBestmatch}

Elements

Name	Description
{Else}	Else can be used in this block to theme the opposite, e.g. when the search sort is not set to best match.

Elements that you can reference in this block also include Global Elements and {block:SearchPage/}

Block

SearchSortInteresting

Shown if the search sort is Most Interesting

Can be used inside
{block:SearchPage/}

This is shown only if the search sort is set to Most Interesting

See {block:SearchPage}

Example

                {block:SearchSortInteresting}...{/block:SearchSortInteresting}

Elements

Name	Description
{Else}	Else can be used in this block to theme the opposite, e.g. when the search sort is not set to most interesting.

Elements that you can reference in this block also include Global Elements and {block:SearchPage/}

Block

SearchSortRecent

Shown if the search sort is Most Recent

Can be used inside
{block:SearchPage/}

This is shown only if the search sort is set to Most Recent

See {block:SearchPage}

Example

                {block:SearchSortRecent}...{/block:SearchSortRecent}

Elements

Name	Description
{Else}	Else can be used in this block to theme the opposite, e.g. when the search sort is not set to most recent.

Elements that you can reference in this block also include Global Elements and {block:SearchPage/}

Block

NotSearchOrTag

Shown if the site viewer has not selected a search or a tag

Can be used inside
Any block

The contents of this block are only shown on a normal list or show page -- and not shown when a site viewer is visiting a search or tag page.

This is useful if there is a feature, like the RSS button or search bar, that might not make sense when on a search or tag page. Posterous doesn't support searching a particular tag, for instance, so that's why we hide that functionality in our default themes.

Example

                {block:NotSearchOrTag}...{/block:NotSearchOrTag}

Elements

Elements that you can reference in this block also include Global Elements

Block

Subscription

Allows a user to subscribe or unsubscribe

Can be used inside
Any block

This block lets you place an area on your Space where the user can click to subscribe or unsubscribe.

The red arrows denote the state changes that would occur after the user clicks on Subscribe or Unsubscribe.

Examples

{block:Subscription}{/block:Subscription}

Simplest way to add a subscription area, with default behavior

{block:Subscription}
  {block:SubscriptionUnsubscribed}
  		<a href="{SubscribeLink}">Follow this Space »</a>
  {/block:SubscriptionUnsubscribed}

  {block:SubscriptionSubscribed}
  		<strong>You're following this Space</strong> (<a href="{UnsubscribeLink}">Edit</a>)
  {/block:SubscriptionSubscribed}

  {block:SubscriptionContributor}
  		<strong>You're a contributor here</strong> (<a href="{UnsubscribeLink}">Edit</a>)
  {/block:SubscriptionContributor}

  {block:SubscriptionAdmin action_id='psubs4_action' content_div='psubs4_content'}
  		<strong>You own this Space</strong> (<a href="{UnsubscribeLink}" id="psubs4_action">Edit</a>)
  {/block:SubscriptionAdmin}

  {block:SubscriptionNonUser}
  	  <a href="{SubscribeLink}">Follow by email »</a><br/>
  	  Get the latest updates in your email box automatically.
  {/block:SubscriptionNonUser}

  {block:SubscriptionLoading}
  	<img src="/images/loading.gif" alt="Loading...">			
  {/block:SubscriptionLoading}
{/block:Subscription}

Verbose way to customize this block and text within this block

{block:Subscription}
  {block:SubscriptionUnsubscribed action_id='psubs1_action' content_div='psubs1_content'}
  	<div id="psubs1_content">
  		<a href="{SubscribeLink}" id="psubs1_action">Follow this Space »</a>
  	</div>
  {/block:SubscriptionUnsubscribed}

  {block:SubscriptionSubscribed action_id='psubs2_action' content_div='psubs2_content'}
  	<div id="psubs2_content">
  		<b>You're following this Space</b> (<a href="{UnsubscribeLink}" id="psubs2_action">Edit</a>)
  	</div>
  {/block:SubscriptionSubscribed}

  {block:SubscriptionContributor action_id='psubs3_action' content_div='psubs3_content'}
  	<div id="psubs3_content">
  		<b>You're a contributor to this Space</b> (<a href="{UnsubscribeLink}" id="psubs3_action">Edit</a>)
  	</div>
  {/block:SubscriptionContributor}

  {block:SubscriptionAdmin action_id='psubs4_action' content_div='psubs4_content'}
  	<div id="psubs4_content">
  		<b>You own this Space</b> (<a href="{UnsubscribeLink}" id="psubs4_action">Edit</a>)
  	</div>
  {/block:SubscriptionAdmin}

  {block:SubscriptionNonUser action_id='psubs5_action' content_div='psubs5_content'}
  	<div id="psubs5_content">
  		<b>Get updates</b> (<a href="{UnsubscribeLink}" id="psubs5_action">Edit</a>)
  	</div>
  {/block:SubscriptionNonUser}

  {block:SubscriptionLoading}
  	<img src="/images/loading.gif" alt="Loading...">			
  {/block:SubscriptionLoading}
{/block:Subscription}

Old obtrusive way of doing things, here for reference only. (deprecated, do not use in new code)

Elements

Name	Description
{SubscribeLink}	URL that you can link to if you want the user to subscribe, best used in {block:SubscriptionUnsubscribed/} and {block:SubscriptionNonUser/}
{UnsubscribeLink}	URL that you can link to if you want the user to unsubscribe, best used in {block:SubscriptionSubscribed/}, {block:SubscriptionContributor/} and {block:SubscriptionAdmin/}

Elements that you can reference in this block also include Global Elements

Block

SubscriptionLoading

Can be used inside
{block:Subscription/}

Example

                {block:SubscriptionLoading}...{/block:SubscriptionLoading}

Elements

Elements that you can reference in this block also include Global Elements and {block:Subscription/}

Block

SubscriptionSubscribed

Shown only if a viewer is following this Space

Can be used inside
{block:Subscription/}

The contents of this block are shown only if the site viewer is following and not a contributor or admin.

See {block:Subscription/} for its use in context.

Example

                {block:SubscriptionSubscribed}...{/block:SubscriptionSubscribed}

Parameters

Name	Description
action_id	This indicates the id of an HTML element (preferably an anchor tag) that will be used for interactivity. When the user clicks this element, the user will be unsubscribed. These parameters are deprecated and are not recommended for use by theme designers moving forward. (deprecated)
content_div	This denotes the entire area to be hidden once the user clicks the action element. These parameters are deprecated and are not recommended for use by theme designers moving forward. (deprecated)

Elements

Elements that you can reference in this block also include Global Elements and {block:Subscription/}

Block

SubscriptionUnsubscribed

Shown only if a viewer is not following

Can be used inside
{block:Subscription/}

The contents of this block are shown only if the viewer is not following. The opposite of this block is SubscriptionSubscribed.

See {block:Subscription/} for its use in context.

Example

                {block:SubscriptionUnsubscribed}...{/block:SubscriptionUnsubscribed}

Parameters

Name	Description
action_id	This indicates the id of an HTML element (preferably an anchor tag) that will be used for interactivity. When the user clicks this element, the user will be unsubscribed. These parameters are deprecated and are not recommended for use by theme designers moving forward. (deprecated)
content_div	This denotes the entire area to be hidden once the user clicks the action element. These parameters are deprecated and are not recommended for use by theme designers moving forward. (deprecated)

Elements

Elements that you can reference in this block also include Global Elements and {block:Subscription/}

Block

SubscriptionAdmin

Shown only if a viewer is the admin of the Space.

Can be used inside
{block:Subscription/}

The contents of this block are shown only if the viewer is an admin of this Space.

See {block:Subscription/} for its use in context.

Example

                {block:SubscriptionAdmin}...{/block:SubscriptionAdmin}

Parameters

Name	Description
action_id	This indicates the id of an HTML element (preferably an anchor tag) that will be used for interactivity. When the user clicks this element, the user will be unsubscribed. These parameters are deprecated and are not recommended for use by theme designers moving forward. (deprecated)
content_div	This denotes the entire area to be hidden once the user clicks the action element. These parameters are deprecated and are not recommended for use by theme designers moving forward. (deprecated)

Elements

Elements that you can reference in this block also include Global Elements and {block:Subscription/}

Block

SubscriptionContributor

Shown only if a viewer is a contributor to the Space.

Can be used inside
{block:Subscription/}

The contents of this block are shown only if the viewer is a contributor to this Space./p>

See {block:Subscription/} for its use in context.

Example

                {block:SubscriptionContributor}...{/block:SubscriptionContributor}

Parameters

Name	Description
action_id	This indicates the id of an HTML element (preferably an anchor tag) that will be used for interactivity. When the user clicks this element, the user will be unsubscribed. These parameters are deprecated and are not recommended for use by theme designers moving forward. (deprecated)
content_div	This denotes the entire area to be hidden once the user clicks the action element. These parameters are deprecated and are not recommended for use by theme designers moving forward. (deprecated)

Elements

Elements that you can reference in this block also include Global Elements and {block:Subscription/}

Block

SubscriptionNonUser

Shown only if a viewer is not logged in to the Space.

Can be used inside
{block:Subscription/}

The contents of this block are shown only if the viewer is not logged into the Space.

See {block:Subscription/} for its use in context.

Example

                {block:SubscriptionNonUser}...{/block:SubscriptionNonUser}

Parameters

Name	Description
action_id	This indicates the id of an HTML element (preferably an anchor tag) that will be used for interactivity. When the user clicks this element, the user will be unsubscribed. These parameters are deprecated and are not recommended for use by theme designers moving forward. (deprecated)
content_div	This denotes the entire area to be hidden once the user clicks the action element. These parameters are deprecated and are not recommended for use by theme designers moving forward. (deprecated)

Elements

Elements that you can reference in this block also include Global Elements and {block:Subscription/}

Block

SearchBox

Interactivity for search input box

Can be used inside
Any block

This is a block that enables interactivity using pre-written javascript that is supported by our theme engine.

When a search box has focus, we like to put a Search button underneath it just so that the user knows that they can click on something to activate a search, in addition to just pressing Enter.

By default, a search box has this state:

However, when this block is enabled, we will show a search box underneath:

Example

{block:NotSearchOrTag}
	<form method='get'>
		<input type='hidden' name='sort' value="{SearchSort}"/>
		<input type='text' name='search' value="{SearchQuery}" id="searchbox"/>
		<input type='submit' value='Search' style="display:none;" id="searchbox_button"/>
	</form>
	{block:SearchBox searchbox_button='searchbox_button' searchbox='searchbox'/}
{/block:NotSearchOrTag}

In this example, we use both a NotSearchOrTag block in conjunction with a SearchBox block to provide a searchbox that appears when the user hasn't searched yet, and provides the focus 'search' button that is clickable.

Parameters

Name	Description
searchbox_button	The HTML element ID for the search button to be shown when searchbox gets focus. Note that you must also set style='display:none;' on the searchbox to hide it by default.
searchbox	The HTML element ID for the input textbox.

Elements

Elements that you can reference in this block also include Global Elements

Block

ShowOnClick

Interactivity for showing a hidden div when the user clicks on something

Can be used inside
Any block

This is a block that enables interactivity using pre-written javascript that is supported by our theme engine.

This allows you to set a clickable element (action_id) such that when a user clicks on it, a hidden div (hidden_div) is shown.

Example

<div id='my_hidden_div' style="display: none;">
  Hello world!
</div>
<a href="#" id="show_hidden_div">Show it</a>

{block:ShowOnClick action_id='show_hidden_div' hidden_div='my_hidden_div'/}

Parameters

Name	Description
action_id	This specifies the id for an HTML element. When you click on this HTML element, usually an anchor tag (<a href>), the hidden div specified will be shown.
hidden_div	This specifies the id for an HTML element (usually a div) that is hidden. You should set style='display: none;' on this hidden div in your theme. Do not set display:none in the CSS definition for the theme because then the click action won't be able to set that div to visible.
to_hide_id	(optional) You can also set an id that will be hidden when the user clicks on something.

Elements

Elements that you can reference in this block also include Global Elements

Block

ShowOnHover

Interactivity for showing a hidden div when the user moves their mouse over something

Can be used inside
Any block

This is a block that enables interactivity using pre-written javascript that is supported by our theme engine.

This allows you to set an element (action_id) such that when a user moves their mouse over it, a hidden div (hidden_div) is shown.

Example

    <div id="hover_div">
      This should show Hello world when I move my mouse over this div:
      <span id='my_hidden_span' style="display: none;">
      Hello world!
      </span>
    </div>

    {block:ShowOnHover action_id='hover_div' hidden_div='my_hidden_span'/}

Parameters

Name	Description
action_id	This specifies the id for an HTML element. When you move your mouse over this HTML element, (often either a div or an anchor tag), the hidden div specified will be shown.
hidden_div	This specifies the id for an HTML element (usually a div or span) that is hidden. You should set style='display: none;' on this hidden div in your theme. Do not set display:none in the CSS definition for the theme because then the click action won't be able to set that div to visible.

Elements

Elements that you can reference in this block also include Global Elements

Block

IndexPage

Shown for post listing pages (same as ListSidebar, shown for Tumblr theme compatibility)

Can be used inside
Any block

This is used for theme compatibility with Tumblr. We recommend that you use {block:List} or {block:Sidebar} instead for Posterous native themes.

Example

{block:IndexPage}
  ...
  {block:NoteCount}<a href="{Permalink}">{NoteCountWithLabel}</a>{/block:NoteCount}
{/block:IndexPage}

Elements

Elements that you can reference in this block also include Global Elements

Block

HasPages

The contents of this block are rendered only if this site has pages.

Can be used inside
Any block

This block is generally used if you want to define a UI element for navigating through pages. You should typically include a {block:Pages} within {block:HasPages} for automated page navigation.

You can add pages to your site from your manage page.

Examples

{block:HasPages}
  <h2>My list of pages</h2>
  ...
{/block:HasPages}

{block:HasPages}
  <ul id="page_navigation">
    {block:Pages}
      <li><a href="{URL}">{Label}</a></li>
    {/block:Pages}
  </ul>
{/block:HasPages}

Elements

Elements that you can reference in this block also include Global Elements

Block

Pages

Loops through all pages for the purpose of page navigation.

Can be used inside
Any block

Use this block to define navigation for your pages. Within this block, you can reference {URL}, {Label}, and {Current}. These tags will allow you to define rich page navigation for your users.

You can add pages to your Space from your manage page.

Example

<ul id="page_navigation">
  {block:Pages}
    <li><a href="{URL}" class="{Current}">{Label}</a></li>
  {/block:Pages}
</ul>

Elements

Name	Description
{URL}	This is the URL link to your page. e.g. http://yourblog.posterous.com/pages/page-name
{Label}	This is the title of your page. e.g. "About Us"
{Current}	Outputs the word "current" if this page is also the current page being viewed. This is good for styling your page navigation.
{External}	Outputs the word "external" if this page is an external link. This is good for styling your page navigation.
{Home}	Outputs the word "home" if this page is also your site's homepage.

Elements that you can reference in this block also include Global Elements

Block

HasLinks

The contents of this block are rendered only if this site has links.

Can be used inside
Any block

This block is generally used if you want to define a UI element for navigating through links. You should typically include a {block:LinkCategories} within {block:HasLinks} for automated link navigation.

You can add links to your site from your manage page.

Examples

{block:HasLinks}
  <h2>My list of links</h2>
  ...
{/block:HasLinks}

{block:HasLinks}
  {block:LinkCategories}
    <h1>{Label}</h1>
    <ul id="link_navigation">
      {block:Links}
        <li><a href="{URL}">{Label}</a></li>
      {/block:Links}
    </ul>
  {/block:LinkCategories}
{/block:HasLinks}

Elements

Elements that you can reference in this block also include Global Elements

Block

Links

Loops through all links in a category for the purpose of navigation.

Can be used inside
Any block

Use this block to define navigation for your links. Within this block, you can reference {URL}, and {Label}. These tags will allow you to define rich link navigation for your users.

You can add links to your Space from your manage page.

Note: {block:Links} must live within {block:LinkCategories} or else nothing will be rendered.

Example

<ul id="link_navigation">
  {block:Links}
    <li><a href="{URL}">{Label}</a></li>
  {/block:Links}
</ul>

Elements

Name	Description
{URL}	This is the URL for your link. e.g. http://www.myfriendsblog.com
{Label}	This is the label of your link. e.g. "My friend's blog'"

Elements that you can reference in this block also include Global Elements

Block

ShowOrList

Shown for post pages and list pages.

Can be used inside
Any block

Anything within {block:ShowOrList} will be shown on post pages as well as list pages, but not on static pages.

Example

                {block:ShowOrList}...{/block:ShowOrList}

Elements

Name	Description
{Else}	Else clause. All things after this will be shown on static pages, but not post or list pages.

Elements that you can reference in this block also include Global Elements

Block

Page

Shown for static pages only.

Can be used inside
Any block

Anything within {block:Page} will be shown on static pages only.

Example

                {block:Page}...{/block:Page}

Elements

Name	Description
{Else}	Else clause. All things after this will be shown on non-static pages (i.e. show or list pages)

Elements that you can reference in this block also include Global Elements

Block

Homepage

Shown for the post listing page of a site only

Can be used inside
Any block

Anything within {block:Homepage} will be shown on homepage of a site only. This is what appears at the top level of the URL, e.g. http://yoursite.posterous.com. This block will return on a post list page by default, but if you reset the homepage to a page it will return for that page instead.

Example

                {block:Homepage}...{/block:Homepage}

Elements

Name	Description
{Else}	Else clause. All things after this will be shown on non-homepage pages.

Elements that you can reference in this block also include Global Elements

Block

LinkCategories

Loops through all link categories for the purpose of link navigation.

Can be used inside
Any block

Use this block to loop through all of the link categories you have defined. Within each link category, you can use {block:Links} to render the links in that category.

You can add links to your site from your manage page.

Example

  {block:LinkCategories}
    <h1>{Label}</h1>
    <ul class="links">
      {block:Links}
        <li><a href="{URL}">{Label}</a></li>
      {/block:Links}
    </ul>
  {/block:LinkCategories}

Elements

Name	Description
{Label}	This is the label of your link category. e.g. "Resources"
{ID}	This is the ID of your link category. e.g. "325"

Elements that you can reference in this block also include Global Elements

Block

Name	Description
{ArchiveMonth}	Archive month
{ArchiveCount}	Archive month public post counts
{ArchiveLink}	Undocumented.

HasArchives

The contents of this block are rendered only if this site has archives.

Can be used inside
Any block

This block is generally used if you want to define a UI element for navigating through archives. You should include a {block:ArchiveYear} or {block:ArchiveMonth} within {block:HasArchives} for automated archive navigation.

Example

                {block:HasArchives}
                  <section id="archives">
                    <h1>Archive</h1>
                     {block:ArchiveYear}
                        <div class="year"><a href="#" id="{ArchiveYearId}">{ArchiveDateYear}</a> <span class="instances">({ArchiveYearCount})</span></div>
                          <div id="{ArchiveMonthsId}" style="display:none;">
                            <div>                      
                              {block:Archive}                              
                                  <div class="inner"><a href="{ArchiveLink}">{ArchiveMonth}</a> <span class="instances">({ArchiveCount})</span></div>
                              {/block:Archive}
                            </div>
                          </div>
                    {/block:ArchiveYear}
                  </section>
                {/block:HasArchives}

Elements

Elements that you can reference in this block also include Global Elements

Block

ArchiveYear

Loops through all archives for the purpose of navigation.

Can be used inside
Any block

Use this block to define navigation for your archive. Within this block, you can reference {ArchiveDateYear} and {ArchiveYearCount}. {block:Archive} lives within this block.

Example

                 {block:ArchiveYear}
                    <div class="year"><a href="#" id="{ArchiveYearId}">{ArchiveDateYear} </a><span class="instances">({ArchiveYearCount})</span></div>
                      <div id="{ArchiveMonthsId}" style="display:none;">
                        <div>                      
                          {block:Archive}                              
                              <div class="inner"><a href="{ArchiveLink}">{ArchiveMonth} </a> <span class="instances">({ArchiveCount})</span></div>
                          {/block:Archive}
                        </div>
                      </div>
                {/block:ArchiveYear}

Elements

Name	Description
{ArchiveDateYear}	Archive Year
{ArchiveYearCount}	Archive year post counts
{ArchiveYearId}	Element Id for Archive Year
{ArchiveMonthsId}	Element Id for Archive Months

Elements that you can reference in this block also include Global Elements

Block

ArchiveMonth

Loops through all archive months for the purpose of navigation.

Can be used inside
Any block

Use this block to define navigation for your archive. Within this block, you can reference {ArchiveDate}, {ArchiveMonthCount}, and {ArchiveMonthLink}.

Example

                <ul>
                 {block:ArchiveMonth}   
                    <li><a href="{ArchiveMonthLink}">{ArchiveDate} </a> <span class="instances">({ArchiveMonthCount})</span></li>
              		{/block:ArchiveMonth}
              	</ul>

Elements

Name	Description
{ArchiveDate}	Archive Date
{ArchiveMonthCount}	Archive year public post counts
{ArchiveMonthLink}	Undocumented.

Elements that you can reference in this block also include Global Elements

Block

ArchiveList

Contents shown if visitor an archive

Can be used inside
Any block

This content would be shown only if the user is viewing an archive.

Example

          			{block:ArchiveList}
                  Archive for
                  <h2 style="margin-top: 0px; color: #111">{ArchiveDate}</h2>
          			{/block:ArchiveList}

Elements

Name	Description
{ArchiveDate}	Archive Date

Elements that you can reference in this block also include Global Elements

Block

HasAdsense

The contents of this block are rendered only if this site has Adsense Enabled.

Can be used inside
Any block

This block is used if you want Adsense on your site.

Example

                {block:HasAdsense}
                  {block:Widget adsense_size='vertical_banner'}{/block:Widget}
                {/block:HasAdsense}

Elements

Elements that you can reference in this block also include Global Elements

Block

PosterousHeader

Useful for positioning of the Posterous Bar

Can be used inside
Any block

This allows for positioning and customization of the Posterous Bar. You can use this to put the Posterous Bar wherever you like.

If omitted, the Posterous Bar will appear in the upper right hand corner of your screen.

Example

{block:PosterousHeader /}

Elements

Elements that you can reference in this block also include Global Elements

Block

Author

Show info about the author of the post

Can be used inside
{block:Posts/}

This can be used to show additional info about the author of the post. It is shown only if the site has multiple contributors.

Example

{block:Author}
  <div class="posted_by">
	
    {block:AuthorUser}
      Posted by 
      <a href="{AuthorURL}">
        {AuthorName} 
        <img src="{AuthorPortraitURL-35}" width='12' height='12'/>
      </a>
    {/block:AuthorUser}
		
    {block:AuthorEmail}
      Posted by email 
    {/block:AuthorEmail}
		
  </div>
{/block:Author}

Elements

Name	Description
{AuthorURL}	URL to the author of the post
{AuthorName}	The name of the author of the post
{AuthorPortraitURL}	URL to the image of the author of the post. Can specify {AuthorPortraitURL-35} or {Author-PortraitURL-75} to get the two sizes we support.
{Else}	Else clause. All things after this will be shown only if there is only one author.

Elements that you can reference in this block also include Global Elements and {block:Posts/}

Block

AuthorUser

Shown if post is written by a registered user

Can be used inside
{block:Author/}

See {block:Author/} for more info and examples.

Elements

Elements that you can reference in this block also include Global Elements, {block:Author/}, and {block:Posts/}

Block

AuthorEmail

Shown if post is written by an email submission by a user who is not registered

Can be used inside
{block:Author/}

See {block:Author/} for more info and examples.

Elements

Elements that you can reference in this block also include Global Elements, {block:Author/}, and {block:Posts/}

Block

Title

Shown if there is a title for a post.

Can be used inside
{block:Posts/}

If the title is blank or set to Untitled, we won't show this block. It's recommended you wrap any title with this, and make sure your theme can handle posts with no title gracefully. Usually the fix would either be to create a permalink somewhere on the page to go to the post page, or link the date.

Example

{block:Title}
    	<h2 class="posttitle" id="posttitle_{PostID}"><a href="{Permalink}">{Title}</a></h2>
{/block:Title}

Elements

Elements that you can reference in this block also include Global Elements and {block:Posts/}

Block

PostSummary

Used for theme compatibility only.

Can be used inside
{block:Posts/}

Included for Tumblr theme compatibility. Equivalent to the post title. Not recommended for regular Posterous theme use.

Example

                {block:PostSummary}...{/block:PostSummary}

Elements

Name	Description
{PostSummary}	Title of post, if viewing a post. Hidden for list pages.

Elements that you can reference in this block also include Global Elements and {block:Posts/}

Block

Text

Used for theme compatibility only.

Can be used inside
{block:Posts/}

Included for Tumblr theme compatibility. Not recommended for regular Posterous theme use.

Example

                {block:Text}...{/block:Text}

Elements

Elements that you can reference in this block also include Global Elements and {block:Posts/}

Block

Regular

Used for theme compatibility only.

Can be used inside
{block:Posts/}

Included for Tumblr theme compatibility. Not recommended for regular Posterous theme use.

Example

                {block:Regular}...{/block:Regular}

Elements

Elements that you can reference in this block also include Global Elements and {block:Posts/}

Block

Responses

Shown for responses

Can be used inside
{block:Posts/}

This response block enables the ability to show responses (comments and likes). If responses are disabled, all the contents of this block will not be shown.

You can further customize how responses look by using the ResponsesList and ResponsesShow blocks, but that's optional.

The class p_owner is included in comments made by the owner of the site, and can be used to style these comments differently than the rest.

Examples

{block:Posts}
  ...
  {block:Responses/}
{/block:Posts}

Simplest default version of responses. Just plug and play at the bottom of the Posts block.

{block:Posts}
  ...
  {block:ResponsesList}
    {ResponseWidget}
  {/block:ResponsesList}

  {block:ResponsesShow}
    {ResponseWidget}
		{Responses}
		{ResponseForm}
  {/block:ResponsesShow}
{/block:Posts}

Example of more detailed theming of responses. You can include, or not include, the response widget in your theme. If you remove the response widget entirely, then your readers will not be able to like posts.

Elements

Name	Description
{ResponseCount}	Shows number of responses for this post.
{ResponseCountPluralized}	Returns an s if there is more than one response on the post. Useful for pluralization, e.g. 0 responses, 1 response, 2 responses
{Responses}	HTML for listing of responses. Used in {block:ResponsesShow} most often since it lists all of the responses inline.
{ResponseWidget}	HTML for the responses widget.
{ResponseForm}	HTML for the new comment form.

Elements that you can reference in this block also include Global Elements and {block:Posts/}

Block

ResponsesList

Shown for responses on post list pages

Can be used inside
{block:Responses/}

Shown for responses on a list page.

See {block:Responses} for more information.

Elements

Elements that you can reference in this block also include Global Elements, {block:Responses/}, and {block:Posts/}

Block

ResponsesShow

Shown for responses on post pages

Can be used inside
{block:Responses/}

Shown for responses on a post page.

See {block:Responses} for more information.

Elements

Elements that you can reference in this block also include Global Elements, {block:Responses/}, and {block:Posts/}

Block

NoteCount

Shown for comments (theme compatibility)

Can be used inside
{block:Posts/}

This is used for theme compatibility with Tumblr. We recommend that you use {block:Comments} instead for Posterous native themes.

Example

{block:Posts}
  ...
  {block:NoteCount}<a href="{Permalink}">{NoteCountWithLabel}</a>{/block:NoteCount}
{/block:Posts}

Elements

Name	Description
{NoteCount}	Shows number of comments for this post. (tumblr compatibility only -- posterous themes should use block:Comments instead)
{NoteCountWithLabel}	Number of comments with a label, e.g. "24 comments" (tumblr compatibility only -- posterous themes should use block:Comments instead)

Elements that you can reference in this block also include Global Elements and {block:Posts/}

Block

PostNotes

Shown for comments (theme compatibility)

Can be used inside
{block:Posts/}

This is used for theme compatibility with Tumblr. We recommend that you use {block:Comments} and {block:CommentsShow} instead for Posterous native themes.

Shown only on post pages when comments are enabled by the user.

Example

{block:Posts}
  ...
  {block:PostNotes}{PostNotes}{/block:PostNotes}
{/block:Posts}

Elements

Name	Description
{PostNotes}	Shows default HTML for comments and the UI for adding more comments.

Elements that you can reference in this block also include Global Elements and {block:Posts/}

Block

NewDayDate

Used for theme compatibility only.

Can be used inside
{block:Posts/}

Included for Tumblr theme compatibility. Not recommended for regular Posterous theme use.

Example

                {block:NewDayDate}...{/block:NewDayDate}

Elements

Elements that you can reference in this block also include Global Elements and {block:Posts/}

Block

SameDayDate

Used for theme compatibility only.

Can be used inside
{block:Posts/}

Included for Tumblr theme compatibility. Not recommended for regular Posterous theme use.

Example

                {block:SameDayDate}...{/block:SameDayDate}

Elements

Elements that you can reference in this block also include Global Elements and {block:Posts/}

Block

Private

Contents shown only if post is marked as private

Can be used inside
{block:Posts/}

Private posts are shown to the owners of the site when logged in.

This allows a theme to show a notice to the user that a particular post is private.

The default behavior uses the special class 'tooltip_link' to control a hover tooltip, as shown below.

When collapsed, it will look like this:

When a mouse is on top of the lock icon, it will get replaced with an explanation, like so:

Examples

                {block:Posts}
                  ...
                  {block:Private/}
                {/block:Posts}

Simplest version, shows a default message.

{block:Posts}
  ...
  {block:Private}
    <a href="{Permalink}" class="tooltip_link">
    <img src="/images/icons/lock12.png" width='12' height='12' alt='Private'/>
    <span style="top: 0px; right: 0px; width: 100px; font-size: 11px;">
      <b>Private Post</b><br/>
      This post has a secret URL and not linked on your public site. 
      Send the secret URL to share it with anyone.
    </span>
    </a>
  {/block:Private}
{/block:Posts}

Complex example that allows you to customize the private message too.

Elements

Name	Description
{Else}	Else clause. All things after this will be shown only if the post is public.

Elements that you can reference in this block also include Global Elements and {block:Posts/}

Block

SMS

Contents shown only if post was sent via SMS

Can be used inside
{block:Posts/}

Shows text only if post is sent via SMS.

Example

                {block:SMS}...{/block:SMS}

Elements

Elements that you can reference in this block also include Global Elements and {block:Posts/}

Block

EditBox

Links for site owners to perform admin actions on posts

Can be used inside
{block:Posts/}

This is a block that outputs a list of links of administrative actions (edit, delete, tag and autopost) that may be performed on a particular post.

This block specifically enables the 'editbox' which is shown here:

This is only shown to owners of the site while they are logged in.

We recommend placing this admin box at the top of a post and showing it only on mouse hover over a particular post, as shown in the CSS in the first example.

Examples

                <head>
                  <style type="text/css">
                      div.postunit { position: relative; }
                      div.post { padding-top: 24px; }
                      div.editbox { visibility: hidden; height: 16px; position: absolute; top: 0px; }
                      div.postunit:hover div.editbox { visibility: visible; }
                      ...
                  </style>
                </head>
                
                ...
                
                {block:Posts}
                  <div class="postunit">
                    {block:EditBox/}
                    <div class="post">
                      ...
                    </div>
                  </div>                
                {/block:Posts}

This is the recommended CSS you can use to cause the editbox to show up on top of the post.

                ...
                {block:EditBox}{EditBoxContents}{/block:EditBox}
                ...

Rather than {block:EditBox/} you can also use this syntax. This lets you take advantage of the fact that the contents of EditBox do not show up if the user is not logged in / does not own this site.

Elements

Name	Description
{EditBoxContents}	HTML for the contents of the edit box.

Elements that you can reference in this block also include Global Elements and {block:Posts/}

Block

Allows for customization of the Read More section of an excerpted block. Is not shown if there is no excerpt shown / needed.

Can be used inside
{block:Posts/}

When a post is very long, you can create a page break by adding "#more" to your emails, or by adding a page break character in the web editor. This will result in a "read more" link appearing on your post list page. {block:More} allows you to customize the contents of this "read more" link.

Typically, you should add {block:More} immediately following the {Body} tag.

Examples

{Body}{block:More /}

{Body}
{block:More}
  <p><a href="{Permalink}">Here is a custom read more link</a></p>
{/block:More}

Elements

Elements that you can reference in this block also include Global Elements and {block:Posts/}

Block

Favorite

Interactivity for allowing logged in users to favorite posts

Can be used inside
{block:Posts/}

This is a block that enables interactivity using pre-written javascript that is supported by our theme engine.

This block specifically enables favoriting by users which is shown here:

This is only shown to logged in users of the site.

These buttons are shown to the upper right of the post (defined by position_id) when the user's mouse is moved over the post (hover_id).

Example

                {block:Posts}
                  <div id="postunit_{PostID}"
                    ...
                    <div id="post_{PostID}">
                      ...
                    </div>
                  </div>
                  {block:Favorite hover_id='postunit_{PostID}' position_id='post_{PostID}'/} 
                {/block:Posts}

Parameters

Name	Description
hover_id	The ID for the HTML element that will trigger the visibility of the editbox.
position_id	The ID of the HTML element that will be used for positioning. The favorite box will appear to the top right of the HTML element specified by position_id.

Elements

Elements that you can reference in this block also include Global Elements and {block:Posts/}

Block

Fans

Shown if there are fans (people who have faved) of a particular site post

Can be used inside
{block:Posts/}

If there are fans other the owner of the site, this block will be shown.

Here's what this block would look like:

Example

{block:Fans}
		<h5>Fans</h5>

		<ul class="fans">
  		{block:Fan}
  			<li>
  				<a href="{FanProfileLink}" rel="nofollow">
  					<img src="{FanPortraitURL-20}" width="20" height="20"/>
  				</a> 
  				<a href="{FanProfileLink}" rel="nofollow">
  					{FanName}
  				</a>
  			</li>
  		{/block:Fan}
		</ul>
{/block:Fans}

Elements

Name	Description
{Else}	Else clause -- so anything after this will show only for the case where there are no fans yet.

Elements that you can reference in this block also include Global Elements and {block:Posts/}

Block

Fan

Loops over fans of a post. A fan is a Posterous user who has favorited the post.

Can be used inside
{block:Posts/}

This will actually loop over each fan, if it exists.

See {block:Fans} for a detailed example.

Example

                {block:Fan}...{/block:Fan}

Elements

Name	Description
{FanPortraitURL}	URL for the portrait image for this fan. Choose between FanPortraitURL-35 and FanPortraitURL-75 for the two sizes of user profile images.
{FanName}	Display name of fan, e.g. Garry Tan
{FanProfile}	Text of user profile of fan
{FanProfileLink}	URL link to profile page of the fan

Elements that you can reference in this block also include Global Elements and {block:Posts/}

Block

PostLocations

Shown if the post has location data

Can be used inside
{block:Posts/}

If the post has geolocation data associated with it this block will be shown. These locations are extracted out of photos that are uploaded with geo info in the EXIF headers.

Example

                {block:PostLocations}  
                    <div id="location_collapsed_{PostID}">  
                        Posted from <a href="#" id="post_location_expander_{PostID}">{LocationsSummary}</a>  
                    </div>  
                    <div id="post_location_expanded_{PostID}" style="display:none">  
                        <div class="map"   
                            style="float: left; width: 300px; height: 150px; margin-right: 10px;">  
                          {MapIframe}  
                        </div>  

                        <b>Posted from</b><br/>  
                                {block:PostLocation uniq_by='summary'}  
                                {LocationSummary}<br/>  
                            {/block:PostLocation}  
                        <br style="clear: both;" />
                    </div>  

                    {block:ShowOnClick   
                      action_id='post_location_expander_{PostID}'  
                      hidden_div='post_location_expanded_{PostID}'  
                      to_hide_id='location_collapsed_{PostID}'/}    

                {/block:PostLocations}

Given the example above, this is what is shown when a post contains location information:

And this is what it would look like after the user clicks on the location name:

Elements

Name	Description
{MapIframe}	An <iframe> containing a map with all the locations plotted. The height and width are set to 100% to fill the parent element.
{LocationsSummary}	City where the photo was taken, e.g. "San Francisco", or X locations, e.g. "3 locations" if there are X number of cities where the post may have been posted from.

Elements that you can reference in this block also include Global Elements and {block:Posts/}

Block

PostLocation

Loops over post locations

Can be used inside
{block:Posts/} {block:PostLocations/}

Contents get shown once for each geolocation associated with post.

Example

                {block:PostLocation uniq_by='city'}
                  {City}<br/>
                {/block:PostLocation}

The example above shows all the cities of the locations asscociated with the current post without duplicating.

Parameters

Name	Description
uniq_by	Locations will be filtered for uniqueness on the given field. Allowed values are: lat, lng, lat_and_lng, street_address, city, state, country, full_address, summary.

Elements

Name	Description
{Latitude}	Latitude of location
{Longitude}	Longitude of location
{FullAddress}	Closest full address to the location
{StreetAddress}	Street address of the location, if available
{City}	City of the location, if available
{State}	State of the location, if available
{Country}	Country of the location, if available
{LocationSummary}	Summary of location - generally in the form City, State or City, Country

Elements that you can reference in this block also include Global Elements, {block:Posts/}, {block:PostLocations/}, and {block:Posts/}

Block

BodyExcerpt

Experimental tag for showing excerpts. Subject to change.

Can be used inside
{block:Posts/}

Use this instead of {Body} if you want to show excerpts of posts. On post pages (aka Show pages) -- it will always show the full text of the post.

This tag is experimental and will be changing.

Examples

{block:BodyExcerpt /}

This is a default version of the BodyExcerpt.

{block:BodyExcerpt excerpt_size='200' strip_tags='true'/}

Set flags if you set num characters, and/or strip tags in the excerpt.

{block:List}
	{block:PostImage size='100' dimension='width'}
		<img src="{PostImageURL}" width='100' height='100' 
		  style="border: 1px solid #eee; float: left; margin-right: 10px; ">
	{Else}
		<img src="/images/spacer.gif" width='100' height='100' 
		  style="border: 1px solid #eee; float: left; margin-right: 10px;">
	{/block:PostImage}
	{block:BodyExcerpt strip_tags="true"}  
		{BodyExcerpt}  
		{block:BodyExcerptReadMore}  
			<p class="readmore">  
				<a href="{Permalink}#more">Read the rest of this post »</a>  
			</p>  
		{/block:BodyExcerptReadMore}  
	{/block:BodyExcerpt}
{/block:List}
{block:Show}
	{Body}
{/block:Show}

This is an example of showing a post image summary with a stripped tag summary of the post on the home page (aka list page), and showing the full post on the post page (aka show page). It will end up looking like this:

Parameters

Name	Description
excerpt_size	Number of text characters to show in the excerpt if no <!--more--> tag is in the post. Setting a number here will override the user default. Default: 200, or whatever the user set on their site.
strip_tags	Should the excerpt strip all non-HTML tags? Default: false

Elements

Name	Description
{BodyExcerpt}	Excerpt

Elements that you can reference in this block also include Global Elements and {block:Posts/}

Block

BodyExcerptReadMore

Allows for customization of the Read More section of an excerpted block. Is not shown if there is no excerpt shown / needed.

Can be used inside
{block:Posts/}

Use this with {block:BodyExcerpt}

Example

                {block:BodyExcerptReadMore}...{/block:BodyExcerptReadMore}

Elements

Elements that you can reference in this block also include Global Elements and {block:Posts/}

Block

PostImage

Show a summary post image

Can be used inside
{block:Posts/}

This is useful in conjunction with BodyExcerpt block so that you can show a summary image next to a summary of the post.

Example

  								{block:PostImage size='100' dimension='width'}
  									<img src="{PostImageURL}" width='100' height='100'>
  								{Else}
  									<img src="/images/spacer.gif" width='100' height='100'>
  								{/block:PostImage}

This will show a post image for the post. It's meant to be a summary image. Square formats include 36x36 and 100x100 -- the other sizes we resize to are 500px in width and 1000px in maximum width or height, whichever comes first. See {block:BodyExcerpt} for useful context on how to use this block.

Parameters

Name	Description
size	Pass an integer representing the desired size over the dimension specified. Sizes that work well are 36, 100, 500, and 1000. Default is 100.
dimension	May be 'width' or 'height' -- defaults to width.

Elements

Name	Description
{PostImageURL}	Image URL to the post image size requested (if available)
{Else}	Anything after this inside the block will be shown if no post image is available

Elements that you can reference in this block also include Global Elements and {block:Posts/}

Block

Add Twitter's official Tweet button

Can be used inside
{block:Posts/}

Super easy way to create Twitter's official Tweet button for your posts. Learn more about the Tweet button here.

We support the following attributes on the Tweet button: count (can be "horizontal", "vertial", or "none"), via (can be any Twitter username), and lang (can be "es", "ja", and any other language Twitter supports).

Examples

    						{block:Tweet /}

The simplest Tweet button. Uses the horizontal layout.

    						{block:Tweet count="vertical" lang="es" /}

Creates a vertical Tweet button in Spanish.

Elements

Elements that you can reference in this block also include Global Elements and {block:Posts/}

Block

FbLike

Add the fb:like button to your posts.

Can be used inside
{block:Posts/}

Use this tag to create an fb:like button. You can customize this button using the attribtues Facebook provides.

Examples

       
                {block:FbLike /}

Generates the simplest <fb:like> button.

       
                {block:FbLike layout="standard" showfaces="true" /}

A slightly more complicated <fb:like> button.

Elements

Elements that you can reference in this block also include Global Elements and {block:Posts/}

Block

Sharing

Contents shown only if social sharing is enabled (Twitter, Facebook, etc.)

Can be used inside
{block:Posts/}

If you need to add some markup that is only shown if the user has enabled sharing, use this tag.

Example

                {block:Sharing}
                  <div class="sharing">
                    {block:Tweet/}
                  </div>
                {/block:Sharing}

Shows the surrounding div only if sharing is enabled

Elements

Name	Description
{Else}	Else clause. All things after this will be shown only if sharing is disabled.

Elements that you can reference in this block also include Global Elements and {block:Posts/}

Block

ViaMobile

The contents of this block are rendered only if the post was created via a mobile app (iPhone, Android, etc.).

Can be used inside
{block:Posts/}

Example

{block:ViaMobile}
  <span>Posted from my iPhone</span>
{/block:ViaMobile}

Elements

Elements that you can reference in this block also include Global Elements and {block:Posts/}

Have a question? Check out http://help.posterous.com.

Also, get help from both the creators of Posterous and the Posterous developer community by joining Posterous Developers.

Tumblr is a trademark of Tumblr Inc. Posterous is not affiliated with or endorsed by Tumblr, Inc.