01. Making a Blog with qEngine: Part 01

Blog may not be the most exciting thing nowadays. But on the other hand, a web log (blog) is also a good way to showcase a CMS' capabilities. So, why don't we create a blog with qEngine? This tutorial requires qEngine version 13 and later.

Download & Installation

First of all, of course, you have to download and upload qEngine to your web host. This is very easy, there are several to do so, but this is the easiest method:

1. Download qEngine here.
2. Upload the whole zip file to your web host using an FTP program (I use FileZilla).
3. Go to your web host control panel (cPanel, Plesk, etc), use a file manager, find the zip, and extract it.

Then you need to setup a MySQL database, and install the script. As each web host has a different way to setup a MySQL, I will skip this step. To install the script simply go to your web site, and choose install.

Once you have installed qEngine, remove the installation folder '/install', otherwise qEngine won't run.

BTW, if you stuck or need help with installing the script, you can always consult the community forum, or hire me to install the script for you for a small fee.

Adminstrator Control Panel (ACP)

After those steps, go to your web site using a browser, and you will your default web site. For now, let's open the administrator control panel (ACP).

To open your ACP, go to your web site address, add '/admin' as path.

• If your web site is: http://www.example.tld.
• Thus your ACP is http://www.example.tld/admin.

Once inside ACP, please familiarize yourself with the ACP. The ACP is designed to be easy to navigate. You may want to change some configuration in ACP > Tools > Site Configuration > Engine Settings, such as site name, site slogan, locale settings, etc.

Setting Up Contents

For now, let's focus to building a blog. Let's start by creating a new group of content for your blog entries. Go to ACP > Contents > Manage Types. Here you can define some settings for your entries, eg, if you allow visitors comments, or if the blog may have file attachment, or how blog is listed, and more.

1. For Group ID, you have to enter a unique identifier. Group ID is useful to differentiate your blog from other contents. For this example, I will input 'BLOG' as Group ID.
2. You can leave Virtual folder empty or type a virtual folder to make your site looks neater, eg: example.tld/blog/my-first-blog.php
3. For main template & page default template, you can leave them empty or pick a template.
4. For the rest is up to you.

After you set up the group, now it's time to create several categories for your blog, eg: Trips, Food Reviews, Recipes, Gadget Reviews, Daily Stuff, etc.

1. Go to ACP > Contents > Manage Categories.
2. For Group, choose 'My Blogs', or whichever title you entered previously.
3. Then enter some information about the category, also you can upload an image if necessary.

Now, it's time for some fun. Go to ACP > Contents > Manage Contents > Add New Entry. Then pick 'Blog' for group, and select a category. Then type on! The editor is a WYSIWYG editor, meaning it's like typing on a word processor! Simple and easy.

If you are done, you can choose 'Preview' to see how your story looks like. Your blog will not be visible to anyone until you set the Publish status to 'Published'. You can even choose who can see your blog: everyone, members only, administrators only or hidden (requires a specific URL).

Now, let's go back to your web site, eg. http://www.example.tld, and refresh. What do you see? No changes? Exactly! That's because we haven't done yet!

Setting Up The Skin

qEngine is actually not a blogging script, but a multi purpose CMS script, that's why you don't see your blog entries immidiatelly. Instead you need to tell qEngine to show your blog. How to do that? Very easy!

Go back to ACP > Tools > File Manager. Here you can manage your files & folders quite easily. Now, open this folder: /skins/default. Inside you will see a list of file. For now, let's focus on 'welcome.tpl'. Open the file with qEngine's built in editor.

In 'welcome.tpl', you will see these lines:

<div>
    <!-- BEGINMODULE slideshow -->theme=theme-welcome<!-- ENDMODULE -->
</div>

<div id="welcome" class="container"">
    <!-- BEGINMODULE page_gallery -->
    // Welcome text
    page_id = 1
    body = 1
    <!-- ENDMODULE -->

    <h3 style="padding-top:10px">{$l_site_news}</h3>
    <!-- BEGINMODULE page_gallery -->
    // Display list of 5 pages from group 2 (news), all categories
    group_id = news
    title = 1
    style = list
    orderby = page_date
    sort = desc
    <!-- ENDMODULE -->

    <ul class="list_1">
        <li><a href="http://localhost/qe13/{$news_url}">{$l_all_news}</a></li>
    </ul>
</div>

Let's learn what it means:

<div>
<!-- BEGINMODULE slideshow -->theme=theme-welcome<!-- ENDMODULE -->
</div>

Used to display the big slide show.

<!-- BEGINMODULE page_gallery -->
// Welcome text
page_id = 1
body = 1
<!-- ENDMODULE -->

Used to display the welcome message.

1. page_id = 1, to tell the module to display content from page ID 1. You can get the page ID from Contents > Manage Contents, see the value for ID.
2. body = 1, tell the module to show page body only.

<!-- BEGINMODULE page_gallery -->
// Display list of 5 pages from group 2 (news), all categories
group_id = news
title = 1
style = list
orderby = page_date
sort = desc
<!-- ENDMODULE -->

To display list of contents from group_id (Content Type) 'news', ordered descending by date.

Build a Simple Blog Welcome Page

Because we are building a blog, we don't need such stuff, so why don't we remove some lines, and also add some lines to display our blog. Now remove all contents from 'welcome.tpl', and enter the following lines:

<div>
    <!-- BEGINMODULE slideshow -->theme=theme-welcome<!-- ENDMODULE -->
</div>

<div id="welcome" class="container"">
    <!-- BEGINMODULE page_gallery -->
    group_id = blog
    title = 1
    thumb = 1
    link = 1
    body = 1
    <!-- ENDMODULE -->
</div>

The above lines means: display contents from group_id (content type) 'BLOG', and display the title, main image, page body & link them to the main content.

Now, let's see your web site again.

There you are! Your blog is now available to everyone! Simple, eh? But, let's make it better!

Go back to ACP > Modules > Configure > Page Gallery > Documentation, inside you can read Page Gallery documentation. Please try some of the Page Gallery configuration to see how it affect your blog. For example, try to enter this:

<div>
 <!-- BEGINMODULE slideshow -->theme=theme-welcome<!-- ENDMODULE -->
</div>
<div id="welcome" class="container"">
 <!-- BEGINMODULE page_gallery -->
 group_id = blog
 title = 1
 img = 1
 link = 1
 body = 1
 date = 1
 limit = 10
 <!-- ENDMODULE -->
</div>

Nice, eh? Experiment more to see it in action.

In the next tutorial, I will explain how to modify the skin. Skinning is actually very easy, as qEngine's skins are actually based on HTML tags with some simple template tags. If you have some experience in HTML & CSS, you should be able to modify qEngine skin very easily.