IapetosHello World
The CMS system includes a base set of tags, the "base tagset" that provides effecient markup for website articles.
These tags, along with all other iapetos/cms tagsets, are processed in the server when the page is displayed, and not in the visitor's browser. These tags provide a concise, easy to read set of tags that simplify the process of writing website articles.
Before going into specific tags, let's cover what a basic Hello World! page looks like.
Hello World! Examples
The classic example that tests how simple it is to get started in any system is called Hello World! We've provided some examples of Hello World! here so you can understand what the tagged up page looks like, and how that page displays.
Hello World! (#1)
To help visualize this, consider the following "hello world" web page using the iapetos/cms base tagset. This is generally the minimum set of tags for any page.
<html> <head/> <body> <h1>Hello World</h1> <p>Hello World!</p> </body> </html>
You can view the result of rendering this page here.
The <base:html> tag opens the page. When this tag is processed on the server it generates a standard HTML tag, which is considerably more complex, and which can change over time as the HTML standard evolves.
This same tag has a closing </base:html> at the bottom of the page.
The <base:head/> tag generates a standard set of header tags, which includes meta tags, styles, javascript, page title and so on.
The <base:body> tag generates the opening of the page's body as well as providing tags for support of older IE browsers, and potentially top and left and header includables that surround the content of the page.
The matched </base:body> at the bottom of the page brings in the footer, right and bottom parts of the page and then closes the body part of the html.
Everything else in the page between the opening and closing base:body tags is the content for the webpage.
Hello World! (#2)
We usually add a little more standard tags to our typical web pages as a coding convention. Of course individual pages may diverge from that convention, and there are many other tags that can be added.
What follows is Hello World, but following our coding convention.
<html> <base:svn id="$Id: index.html 7977 2009-05-03 15:10:07Z phil $" /> <head/> <body> <h1>Hello World</h1> <p>Hello World!</p> <base:byline nick="phil" /> </body> </html>
This example can be seen here.
This example adds 2 more tags, which rounds out the base set seen in the source files for most of what we write.
The <base:svn/> tag provides info about this particular page. In the example here the 2 parameters are values supplied automatically by the version control system which contains the official copies, and revision history, of these pages. These values are updated when the page is committed to the revision control.
The <base:byline/> tag provides the author's nickname, which is expanded to their full name based on configuration data. The expanded name also becomes a link to the website contact page and will direct the contact back to the article author.
Hello World! (#3)
Server side processing is modeled after Python Server Pages, though it no longer uses that technology. Borrowed from that system is a server side commenting convention. That convention allows comments that are stripped in the server and not passed to the browser. Here is an example.
<html> <base:svn id="$Id: index.html 7978 2009-05-03 15:10:59Z phil $" /> <head/> <body> <%-- This is an example of a comment, stripped from the page in the server. Someone using their browser's "view source" option will not see this comment. This comment is the type required to hide any of the cms tags from being processed when the page is handled on the server. So, the following tag is unprocessed in the server, and unseen to the browser. <base:uri/> --%> <!-- While this is an HTML comment, left in the text at the browser, but still not seen by a visitor when they display the page. If they use their browser's "view source" this comment will be seen. Tags placed in this type of comment ARE processed on the server, but the result is unseen by the browser. <base:uri/> --> <h1>Hello World</h1> <p>Hello World!</p> <base:byline nick="phil" /> </body> </html>
You can see how this page renders here.
The <%-- opens the comment block. The comment block is closed with a --%>
Contrast this with HTML comments which are passed to the browser.
Note that the 2 types can be combined for various effects, but neither can be nested within themselves.
Full Example
Finally, to finish this ever so brief introduction, the following shows off how the page you're currently viewing is coded. Note how it uses a few other standard base tags, and it uses simple html tags for most writing.
<html> <base:svn id="$Id: index.html 7977 2009-05-03 15:10:07Z phil $" /> <head/> <body> <h1>Hello World</h1> <p>The CMS system includes a base set of tags, the "base tagset" that provides effecient markup for website articles.</p> <p>These tags, along with all other iapetos/cms tagsets, are processed in the server when the page is displayed, and <i>not</i> in the visitor's browser. These tags provide a concise, easy to read set of tags that simplify the process of writing website articles.</p> <p>Before going into specific tags, let's cover what a basic Hello World! page looks like.</p> <h2>Hello World! Examples</h2> <p>The classic example that tests how simple it is to get started in any system is called Hello World! We've provided some examples of Hello World! here so you can understand what the tagged up page looks like, and how that page displays.</p> <h3>Hello World! (#1)</h3> <p>To help visualize this, consider the following "hello world" web page using the iapetos/cms base tagset. This is generally the minimum set of tags for any page.</p> <div class="base_code_sample"> <pre> <base:include html="hello1/index.html" /> </pre> </div> <p>You can view the result of rendering this page <a target="_blank" href="/cms/doc/hello/hello1">here</a>.</p> <p>The <base:html> tag opens the page. When this tag is processed on the server it generates a standard HTML tag, which is considerably more complex, and which can change over time as the HTML standard evolves.</p> <p>This same tag has a closing </base:html> at the bottom of the page.</p> <p>The <base:head/> tag generates a standard set of header tags, which includes meta tags, styles, javascript, page title and so on.</p> <p>The <base:body> tag generates the opening of the page's body as well as providing tags for support of older IE browsers, and potentially top and left and header includables that surround the content of the page.</p> <p>The matched </base:body> at the bottom of the page brings in the footer, right and bottom parts of the page and then closes the body part of the html.</p> <p>Everything else in the page between the opening and closing base:body tags is the content for the webpage.</p> <h3>Hello World! (#2)</h3> <p>We usually add a little more standard tags to our typical web pages as a <i>coding convention.</i> Of course individual pages may diverge from that convention, and there are many other tags that can be added.</p> <p>What follows is Hello World, but following our coding convention.</p> <div class="base_code_sample"> <pre> <base:include html="hello2/index.html" /> </pre> </div> <p>This example can be seen <a target="_blank" href="/cms/doc/hello/hello2">here</a>.</p> <p>This example adds 2 more tags, which rounds out the base set seen in the source files for most of what we write.</p> <p>The <base:svn/> tag provides info about this particular page. In the example here the 2 parameters are values supplied automatically by the version control system which contains the official copies, and revision history, of these pages. These values are updated when the page is committed to the revision control.</p> <p>The <base:byline/> tag provides the author's nickname, which is expanded to their full name based on configuration data. The expanded name also becomes a link to the website contact page and will direct the contact back to the article author.</p> <h3>Hello World! (#3)</h3> <p>Server side processing is modeled after <i>Python Server Pages</i>, though it no longer uses that technology. Borrowed from that system is a server side commenting convention. That convention allows comments that are stripped <i>in the server</i> and not passed to the browser. Here is an example.</p> <div class="base_code_sample"> <pre> <base:include html="hello3/index.html" /> </pre> </div> <p>You can see how this page renders <a target="_blank" href="/cms/doc/hello/hello3">here</a>.</p> <p>The <%-- opens the comment block. The comment block is closed with a --%></p> <p>Contrast this with HTML comments which are passed to the browser.</p> <p>Note that the 2 types can be combined for various effects, but neither can be nested within themselves.</p> <h2>Full Example</h2> <p>Finally, to finish this ever so brief introduction, the following shows off how the page you're currently viewing is coded. Note how it uses a few other standard base tags, and it uses simple html tags for most writing.</p> <div class="base_code_sample"> <pre> <base:include html="index.html" /> </pre> </div> <h2>Moving On</h2> <p>Where next? How about looking at more of the possible tags in the base set?</p> <base:byline nick="phil" /> </body> </html>
Moving On
Where next? How about looking at more of the possible tags in the base set?