Introduction

LimeSpot themes allow users to present LimeSpot apps in a wide range of ways. Using themes, users can present information provided by LimeSpot in almost any manner they choose. LimeSpot Markup follows rules similar to the conventions used by WordPress, Smarty Templates, and others.

Theme Structure

A theme consists of two kinds of objects:

• Templates, which define the html layout for a view, and
• Assets, which are comprised of images, javascript, and other supporting files

↑ Top

Templates

The main template is known as the layout. The layout is a full HTML document that describes all markup except for the markup provided by an app. (such as blog posts, events, etc)

Other templates are named according to the app they describe and the action they perform. For instance, to when you show a blog, LimeSpot renders the blog_show template. Currently the following templates are used by LimeSpot:

• album_show
• blog_show
• blog_archives
• blog_search
• post_show
• discography_show
• calendar_show
• category_show
• page_show

There is a special case for comment because it is returned from the server in an ajax request.

You can also create your own templates with arbitrary names and include them using LimeSpot Markup.

↑ Top

Assets

You can upload new files from a theme's Assets page. Text-based files can be edited once uploaded. Uploading a file with the same name as an existing asset will overwrite the asset.

↑ Top

Markup

LimeSpot Markup is based off of a templating engine called Liquid. For more advanced Liquid usage, see Mephisto's using liquid templates

↑ Top

Control structures

Liquid uses the following syntax for conditionals:

  {% if post['excerpt'] %}
     Do something here
  {% endif %}

For the time being, you cannot do boolean conditionals ( if post['excerpt'] and post['body'] ) but support may come in a future version.

↑ Top

Loops

A blog object has an array of posts, accessible through blog['posts'] . In order to cycle through all of the posts, you can do

  {% for post in blog['posts'] %}
    {{ post['title'] }}
  {% endfor %}

The for post in blog['posts'] part causes the loop to execute for each post, with the variable 'post' available to you. You can nest loops in the same way.

↑ Top

Variables

Variables are surrounded by curly brackets like so:

  {{ post['title'] }}

In the example above, post is an object and title is one of its children. To access grand-children, you can do:

  {{ post['author']['name'] }}

See the API for which variables are exposed.

↑ Top

Filters

Filters can modify variables. We provide dates as objects that can be manipulated to be shown different ways:

{{ post['date'] | date: "%B %e" }}

This will cause the date to be shown as: "January 8"

More on the date formatting can be found at http://us.php.net/strftime

↑ Top

API

Once you know the layout, what can you do? LimeSpot exposes a number of objects and variables to theme designers. Each app provides an object of the same name. (Blog provides a blog object, etc)

↑ Top

Actions

blog_show provides

blog: Blog object

blog_archives (showing all) provides

archive:

• url: (string) url to archives
• years: (array) in form [{'name' => 2008, 'size' => 45, 'months' => [{'name' => 'January', 'number' => '1', 'size' => 36}, {'name' => 'February', 'number' => '2', 'size' => 9}] }]

blog_archives (showing a filtered list of posts) provides

archive:

• path: (string) url to archives
• title: (string) name of the filter, such as "January 2008"
• posts: (array) list of Post objects for the archives filter
• pager: (string) post pagination

blog_search provides

search:

• posts: (integer) Post objects that match the search
• size: (integer) number of search results
• query: (string) search term
• pager: (string) search pagination

post_show provides

post: Post object

calendar_show provides

calendar: Calendar object

category_show provides

category: Category object

album_show provides

album: Album object

page_show provides

page: Page object

↑ Top

Objects

Blog

• url (string): url to the blog
• posts (array of Posts): 10 newest published posts in the blog.
• comments (array of Comments): comments for the blog (the newest 5 comments)
• title (string): the blog name
• pager (string): html with links to other pages

Post

• id (integer): post's numeric id
• has_excerpt (boolean): whether or not the post contains an excerpt
• url (string): post url
• link (string): a link to the post, using the post's title
• categories (array of Categories): categories the post is listed under
• comments_size (integer): number of comments for a post
• comments (array of Comments): post comments, newest first
• author (Post): the post author
• title (string)
• full_body (string)
• excerpt (string)
• published_at (Date): date the author set for the post to be published
• allow_comments (User): whether the post author has turned on comments
• next (Post): next newest post
• previous (Post): next oldest post

Event

• id (integer): event's numeric id
• title (string)
• body (string)
• start_time (Date)
• end_time (Date)
• location (string)
• address (string)
• description (string)
• duration (string): length of the event in words ("12 hours" or "3 days")
• url (string)
• link (string, html): link to the event
• comments_size (integer)
• attendees_size (integer)

User

• avatar_url (string): url for the user's avatar
• name (string)
• display_name (string)
• url (string): url for user's profile
• link_avatar_to_profile (string, html): avatar image, linked to profile
• link_tag (string, html): user's name, linked to profile
• app_links (array): array of objects that contain links to user's apps
  • name (string): name of the app
  • url (string): url of the app

↑ Top