• twitter image
  • facebook image
  • youtube image
  • linkedin image
Language: CMS Made Simple Czech CMS Made Simple France CMS Made Simple Spain CMS Made Simple Hungary CMS Made Simple Russia CMS Made Simple, the Netherlands

Extended example template

We need your assistance to make the documentation accurate, user friendly and understandable. Therefore we welcome any tips or suggestions regarding documentation. Thank you in advance for your contribution.

However, we will not respond to technical support questions submitted using this form. If you are having difficulty with CMSMS and cannot find the solution on this website, please submit your question appropriately on our support forum at: http://forum.cmsmadesimple.org. Please remember to follow the forum rules when posting.


This is a captcha-picture. It is used to prevent mass-access by robots. (see: www.captcha.net) Please confirm that you are not a script by entering the letters from the image

Below a more extended example HTML template. You can see the CMSMS tags between the structure of the regular HTML components.
By using more Global Content Blocks for extracting code, the HTML template remains clear. These GCB's can also be re-used in other templates.

  1. {strip}
  2.    <!-- Adds page specific metadata to the page -->
  3.    {process_pagedata}
  4.    <!-- Assign the main Content block to a string -->
  5.    {content assign='maincontent' label='My content block'}
  6.    <!-- Create a second content block! -->
  7.    {content block='second_content' assign='second_content' label='My second content block'}
  8. {/strip}<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  9. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" > <!-- Change "en" to your language -->
  10.  
  11. <head>
  12.    <title>{title} | {sitename}</title> <!-- Title of the page | Site name from Global Settings -->
  13.    {metadata} <!-- Adds Global Metadata to the page -->
  14.    {cms_stylesheet} <!-- Adds attached stylesheets to the page -->
  15.  
  16.    {cms_jquery} <!-- Adds jQuery files to the page -->
  17.    [literal]
  18.       <script type="text/javascript">
  19.          // Additional Javascript code
  20.       </script>
  21.    [/literal] <!-- should be wrapped in { and } -->
  22.  
  23.    {global_content name="analytics"} <!-- Extract all analytics code to a global content block -->
  24. </head>
  25.  
  26. <body>
  27. <div id="pagewrapper">
  28.  
  29.    <div id="header">
  30.       <h1>{sitename}</h1> <!-- Site name from Global Settings -->
  31.       <img src="uploads/images/header/{page_image}" alt="Header Image" /> <!-- Assign a different header image per page (#1) -->
  32.       {content_image block="Header Image" dir="images/header"} <!-- Assign a different header image per page (#2) -->
  33.    </div>
  34.  
  35.    <div id="menu_horiz">
  36.       {menu number_of_levels="1"} <!-- Show only the parent menu buttons -->
  37.    </div>
  38.  
  39.    <div id="breadcrumbs">
  40.       {cms_breadcrumbs} <!-- Show breadcrumbs pagelinks -->
  41.    </div>
  42.  
  43.    <div id="sidebar">
  44.       {global_content name="sidebar"} <!-- Extract all sidebar code to a global content block -->
  45.    </div>
  46.  
  47.    <div id="content">
  48.       <h2>{title}</h2> <!-- Title of the page -->
  49.       {$maincontent} <!-- Page content from string -->
  50.  
  51.       {if $second_content} <!-- Only show second content block when it has some content -->
  52.          <h3>Second Content Block</h3>
  53.          {$second_content}
  54.       {/if}
  55.    </div>
  56.  
  57.    <div style="clear: both;"></div> <!-- Be sure the footer remains under the sidebar and content div -->
  58.  
  59.    <div id="footer">
  60.       {global_content name="footer"} <!-- Extract all footer code to a global content block -->
  61.    </div>
  62.  
  63. </div>
  64. </body>
  65.  
  66. </html>
Open anchor to this point in the page Global Content Block called "analytics"
  1. [literal]
  2.  
  3. <!-- Add (Google) Analytics Javascript code here -->
  4.  
  5. [/literal]<!-- should be wrapped in { and } -->
Open anchor to this point in the page Global Content Block called "sidebar"
  1. <div id="menu_vert">
  2. <h3>Submenu</h3>
  3. {menu start_level="2"} <!-- Only show the children menu buttons -->
  4. </div
  5.  
  6. {capture assign=news_there}{news}{/capture} <!-- Assign News content to a string -->
  7. {if $news_there} <!-- Only show the News div when there is news -->
  8.    <div id="news">
  9.       <h3>News</h3>
  10.       {news}
  11.    </div>
  12. {/if}
Open anchor to this point in the page Global Content Block called "footer"
  1. <p>Copyright &copy; {custom_copyright} <a href="http://www.cmsmadesimple.org" target="_blank">CMS Made Simple&trade;</a><br />
  2. {cms_selflink page="sitemap"} | Mail us at {mailto address="name@website.com" encode="javascript"}</p>