Doccy, a “mid–weight” markup language

Features

For writers

• Easy to learn, unvarying syntax similar to HTML
• Implicit paragraphs, no need to write your own <p> tags
• Automatic prettifying of hyphens, quotation marks and widowed words
• Ability to paste HTML and XML directly into your documents unaltered
• jQuery based auto–completion in HTML textareas using Snicked

For developers

• DOMDocument based parsing, opening a doccy file gives you access to it as XML
• Fully configurable, don’t want a feature? Just disable it

The syntax

Essentially Doccy provides the power of HTML with a simpler syntax that requires less typing. The basic syntax is as follows:

{h1: Top-level heading}

Essentially, anything between two curley–braces is considered an element if:

1. Immediately following the opening brace, a valid element name is found,
2. followed by whitespace or attributes,
3. and finaly a colon (:).

What about attributes, element IDs and class names?

Attributes

Attributes can be set using the “at” symbol (@) followed by the attribute name and value: @href http://google.com/.

Class attributes

You can set classes on an element using a full–stop (.) followed by a valid class name: .class.name.

Data attributes

You can also set HTML5 data attributes using the percent symbol (%) followed by the attribute name and value: %highlight-syntax php.

ID attributes

Finally, you can specify the ID attribute of an element using the hash symbol (#) followed by the value of the id: #main-header.

Ok, but how on earth do you write Doccy syntax inside of a Doccy document? Simple actually, just escape using the backslash symbol:

\{code: \\{p: For example.\\}\}

Also, if you’re not using the above described element syntax, there’s no need to use backslashes to escape:

{this is perfectly fine.}

Quick examples

Combining classes and element IDs

{h1#main-header.some.class: Top-level heading}

You do not have to run the attributes up together, the following is also perfectly valid:

{h1 #main-header .some .class: Top-level heading}

Either way, the output would look like the following:

<h1 id="main-header" class="some class">...

Attributes and data attributes

{h1 @class some class %syntax php: Top-level heading}

This will output:

<h1 class="some class" data-syntax="php">...

Nested elements

You can of course nest elements like you would in HTML:

{h1: This is my {em: awesome} header}

This will output:

<h1>This is my <em>awesome</em> header</h1>

How to get it?

You can find the Symphony extension on github, to add it to your site run the following:

cd extensions
git clone git://github.com/rowan-lewis/doccy_text_formatter.git
cd doccy_text_formatter
git submodule update --init

Then jump into Symphony and enable the “Text Formatter: Doccy” extension.

You can also get the Doccy source code on github.

How about that

Well, that covers the basics, please install it and have a play, and please, if you care, give some feedback in the comment form below. You can use Doccy there too.

My next move, after more testing, will be to submit a pull request to github allowing Doccy to be used to write readme files.

Hmm, lists work very well with the autocomplete. 

{ul:
	{li: something}
	{li: something else}
	{li: something something else}
}

I like the automatic handling of the widowed words too - the typography Symphony extension has spoiled me all these years...

Will keep this in mind. It's probably only going to fulfil {em: very specific} use cases, but I like that it's not some new set of markup to learn like {strong: markdown} or {strong: textile}

{a @href http://www.google.com: Doing links is way nicer too.}