Reference

like an encylopedia, only a lot shorter, and less whales

Core Syntax

Tags

Tags are marked by prepending a line with the name of the tag. If there is no tag name, then it is defaulted to div.

peml

h1 Page Title
div
  h2 Title
  p Content
  p Content

PHP

<h1>Page Title</h1>
<div>
  <h2>Title</h2>
  <p>Content</p>
  <p>Content</p>
</div>

Classes

Classes are specified using .<classname>, and can be repeated to specify multiple classes. Note that if there is no tag name, it defaults to div.

peml

h1 Page Title
.left
  h2.subheading.first Title
  p Content
  p.last Content

PHP

<h1>Page Title</h1>
<div class="left">
  <h2 class="subheading first">Title</h2>
  <p>Content</p>
  <p class="last">Content</p>
</div>

IDs

IDs are specified by following the classes with a #<id>. Only one id may be specified.

peml

h1#heading Page Title
.left#content
  h2.subheading.first Title
  p Content
  p.last Content
#subcontent
  p More Content

PHP

<h1 id="heading">Page Title</h1>
<div class="left" id="content">
  <h2 class="subheading first">Title</h2>
  <p>Content</p>
  <p class="last">Content</p>
</div>
<div id="subcontent">
  <p>More Content</p>
</div>

Printing PHP variables

PHP variables can be included by appending a = to the end of the tag identifier. You can also use a = on its own on a line to signify just to print the result of some php, without any tagging. If you want to have a blank div with php content, explicitly declare the div tag.

peml

#content
  h1#heading= $pageTitle
  .left= $leftContent
  .right
    = $rightContent
    = getMore($arg)

PHP

<div id="content">
  <h1 id="heading"><?php echo $pageTitle; ?></h1>
  <div class="left"><?php echo $leftContent; ?></div>
  <div class="right">
    <?php echo $rightContent; ?>
    <?php echo getMore($arg); ?>
  </div>
</div>

Attributes

Attributes are placed after an id in the form of (name:value, name:value, ...). |Note that single-line wrapped tags *can* have attibutes, but this is currently |unreliable if your attributes are complicated. You can also include php variables |in attributes quickly by using name:=value.

peml

html(lang:en)
  head
    title= $pageTitle
  body#page(data-id:=$id)
    #sidenav
      a=(href:= $linkurl) $linktext
      a(href:http://google.co.uk ` target:_new) Google

PHP

<html lang="en">
  <head>
    <title><?php echo $pageTitle; ?></title>
  </head>
  <body id="page" data-id="?php echo $id; ?>">
    <div id="sidenav">
      <a href="?php echo $linkurl; ?>">
                                <?php echo $linktext; ?></a>
      <a href="http://google.co.uk" target="_new">Google</a>
    </div>
  </body>
</html>

SCL syntax

Flow control

The SCL wraps the foreach, if/elseif/else, while, and for constructs into commands

peml

ul
  :foreach $users as $user
    li
      p= $user->name
      p.profile
        :if $user->hasProfile()
          = $user->profileText
        :else
          No user profile.

PHP

<ul>
  <?php foreach($users as $user): ?>
    <li>
      <p><?php echo $user->name; ?></p>
      <p class="profile">
      <?php if($user->hasProfile())
        echo $user->profileText;
      else
        echo 'No user profile.'
      ?>
    </li>
  <?php endforeach; ?>
</ul>

:php

This is a general block command for enclosing some raw php code.

The block exits once the indentation drops below where the :php command was stated.

peml

:php
  function fetch_text($param) {
    return $param . " is param.";
  }
  $text = fetch_text("default");
  $q = isset($_GET['q']) ? $_GET['q'] : $text;
input(type:text ` value:= $q)

PHP

<?php
  function fetch_text($param) {
    return $param . " is param.";
  }
  $text = fetch_text("default");
  $q = isset($_GET['q']) ? $_GET['q'] : $text;
?>
<input type="text" value="?php echo $q; ?>" />

:code

Used to print code out, will preserve whitespace inside the block and encode HTML entities.

peml

:code
  preserve    whitespace
          and
  <?php echo "don't execute" ?>
  <b>or tags</b>

PHP

<?php echo "<pre>" . htmlentities(
"preserve    whitespace".
"        and".
"<?php echo \"don't execute\" ?>".
"<b>or tags</b>") . "</pre>"; ?>

SCL helper commands

:js and :css

Used to add a <script /> or <link /> tag. The :css also takes an optional prefix to the path of "IE", "IE6" or "IE7" to add a conditional comment around the link.

peml

head
  :js /script/jquery.min
  :js /script/site
  :css /stylesheets/main
  :css IE7 /stylesheets/ie

PHP

<head>
  <script type="text/javascript"
                    src="/script/jquery.min.js" /></script>
  <script type="text/javascript" src="/script/site.js" />
                                                  </script>
  <link rel="stylesheet" type="text/css"
                              href="/stylesheets/main.css">
  <!--[if IE 7]><link rel="stylesheet" type="text/css"
                    href="/stylesheets/ie.css"><![endif]-->
</head>

:doctype

Used to add a doctype to the top of a file. Options: 'html4 strict/transitional/frameset', 'xhtml 1.0 strict/transitional/frameset', 'xhtml 1.1' or blank for the HTML5 doctype.

peml

:doctype xhtml 1.0 transitional

PHP

<!DOCTYPE html PUBLIC
  "-//W3C//DTD XHTML 1.0 Transitional//EN"
  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
 

:clear

Shortcut for a standard markup clearing div. Note: you should have a clear class defined.

peml

:clear

PHP

<div style="clear">&nbsp;</div>

Other commands

The SCL is being improved upon gradually, so there may be useful commands available that aren't documented here. So please review the SCL.php Library, both to check for functionality, and also to learn how to extend peml yourself.