Creating Content Pages

Here we will look at an overview of how to create content in Qlicksoft CMS.

Page Types

In Qlicksoft CMS, we have page types for semantic and SEO purposes:

Content Files and Template Files

Content files (.php.content) are associated with a Mustache layout template file (.mustache). Content files are stored and navigated in a single level hiearchy. The user can see the navigation depth by looking at the breadcrumb trail. There are no subcategories allowed.

Template files are stored in the current theme's templates folder. The current theme is set in the config.php file.

Default Qlick Theme

For the default Qlick theme, we have these Mustache templates available to choose from:

Category front pages and the Home front pages are Simple page types. You will likely want to customize these pages to give your website a unique look.

Associating Page Type with Template

To associate a content page with a layout, you make the following function call at the top of your .php.content file:

SetQlick("pageLayout", pageType);
Where the pageType is the mustache filename itself (i.e. simple.mustache, article.mustache, etc)

Filenames and Titles

Try to make filenames the same name as category name and title of articles.

It is important to note that you should stick to a safe filename and title naming convention.

Steps To Create Content

Starter content files are available in a theme to get you started quickly

To create content pages do the following steps:

Everything is based on the chosen theme and the mustache template (page layout) you use. The page layout has content zones that can be filled.

Lets take a look at some examples!

Example: Creating a Simple Page

<?php
SetQlick("pageLayout", "simple.mustache");

SetQlick("author", "Joe Smith");
SetQlick("date", "October 28, 2018");
SetQlick("time", "21.15:00PM");
SetQlick("description", "Type in a short description here");

AddQlickMetaItem("<meta name='author' content='Joe Smith'>");
AddQlickMetaItem("<meta name='publisher' content='Joe Smith Corporation'>");
AddQlickMetaItem("<meta name='description' content='Type in a short description here'>");

AddQlickCssItem("simple.css");

$name = Snippet_GetName();

// ===============================================================================================================

$qlick["mainContent"] = <<< MAIN_CONTENT_1
<style>
p::first-letter {
  font-size: 200%
}
</style>

<p>
Welcome	{$name} to our website! We hope you find this useful!
</p>
MAIN_CONTENT_1;
?>

This is a simple example of how things work. There are a few things to note here:

Creating a content page involves:

Example: Creating a Home Page

<<?php
SetQlick("pageLayout", "front-home.mustache");

SetQlick("author", "Kerry Kobashi");
SetQlick("date", "October 28, 2018");
SetQlick("time", "20:00PM");
SetQlick("description", "Qlicksoft home page");

AddQlickMetaItem("<meta name='author' content='Kerry Kobashi'>");
AddQlickMetaItem("<meta name='publisher' content='Qlicksoft'>");
AddQlickMetaItem("<meta name='description' content='Qlicksoft home page'>");

// ============================================================================================================================

$qlick["mainHeaderContent"] = <<< MAIN_HEADER_CONTENT
<h1>Welcome to Qlicksoft</h1>
<img class='masthead' src="{$qlick["imageUrlBase"]}front-home-masthead.png" alt="Masthead"/>
MAIN_HEADER_CONTENT;

$qlick["mainContent"] = <<< MAIN_CONTENT_3
<p>
You are at the home of Qlicksoft, the company behind Qlicksoft CMS.
</p>
<p>
Qlicksoft CMS is a database-less micro content management system. It is built so you can quickly utilize existing PHP, HTML 5 and CSS3 skills to develop small to medium sized websites.
</p>
<p>
Read through the <a href="/qlicksoft-cms" title="Qlicksoft CMS Developer Guide">Developer Guide</a> to get more familiar with what Qlicksoft CMS has to offer.
</p>
MAIN_CONTENT_3
?>

Creating a home page involves:

Example: A Front Category Page

<?php
SetQlick("pageLayout", "front-category.mustache");

SetQlick("author", "Kerry Kobashi");
SetQlick("date", "November 3, 2018");
SetQlick("time", "18:03PM");
SetQlick("description", "Qlicksoft CMS category home page");

AddQlickMetaItem("<meta name='author' content='Kerry Kobashi'>");
AddQlickMetaItem("<meta name='publisher' content='Qlicksoft'>");
AddQlickMetaItem("<meta name='description' content='Qlicksoft CMS category home page'>");

// ============================================================================================================================

$qlick["mainHeaderContent"] = <<< MAIN_HEADER_CONTENT
<h1>Qlicksoft CMS</h1>
<img class='masthead' src="{$qlick["imageUrlBase"]}front-qlicksoft-cms-masthead.png" alt="Masthead"/>
MAIN_HEADER_CONTENT;

$qlick["mainContent"] = <<< MAIN_CONTENT_2
<p>
Welcome to Qlicksoft CMS, the database-less micro CMS system. Here you will find everything about this web application to get you up and running fast.
</p>
<h2>Developer Guide</h2>
<ul>
<li><a href="/qlicksoft-cms/from-the-developer" title="Qlicksoft CMS: From the Developer">From the Developer</a></li>
<li><a href="/qlicksoft-cms/micro-cms" title="Qlicksoft Micro CMS">A Database-less Micro CMS</a></li>
<li><a href="/qlicksoft-cms/requirements" title="Qlicksoft Requirements">Requirements</a></li>
<li><a href="/qlicksoft-cms/philosophy" title="Qlicksoft Philosophy">Philosophy</a></li>
<li><a href="/qlicksoft-cms/file-layout" title="Qlicksoft File Layout">File Layout</a></li>
<li><a href="/qlicksoft-cms/mainfiles" title="Qlicksoft Main Files">Main Files</a></li>
<li><a href="/qlicksoft-cms/apache-http" title="Qlicksoft Apache HTTP">Apache Web Server</a></li>
<li><a href="/qlicksoft-cms/robots-txt" title="Qlicksoft Robots.txt">Robots.txt</a></li>
<li><a href="/qlicksoft-cms/creating-templates" title="Qlicksoft Creating Templates">Creating Page Layout Templates</a></li>
<li><a href="/qlicksoft-cms/creating-content" title="Qlicksoft Creating Content">Creating Content Pages</a></li>
<li><a href="/qlicksoft-cms/styling-content" title="Qlicksoft CMS Styling">Styling Your Content Pages</a></li>
</ul>
MAIN_CONTENT_2;
?>

Creating a category page involves:

Use the Utility Helpers

In the examples above, we use helper functions for our utils.php module to set the author name, the date and time of submission. This is for setting up meta tags for SEO purposes and for rendering meta information if needed.

The simple.css stylesheet accompanies the simple.mustache page layout. For articles you should use the article.mustache files.

Your Job Is To Text Substitute

Get the sense that you are just setting variables and doing text substitution in mustache layout templates? Good! Because thats all it really is.

Your job is to set a page layout, and then fill in mustache tags that relate to content zones to override their default behavior. You do that from within a .php.content file. As you can see, no database is needed. Everything is a file and memory store operation.