Using the SampleSite Template

In this tutorial you will learn how to create a  website  based on the SampleSite template, and how to maintain the content of your website using Kooboo CMS 4.0.

Step 1. Create your first website

Visit the admin page of Kooboo CMS 4.0 at http://{yourcmssite}/admin:

You can log in to Kooboo CMS by using the default account below:

Username: admin
Password: admin

After logging in with the above account, you will be redirected to the Kooboo CMS start page Site cluster. You can see that it contains a list of your websites. 

kooboo_create_a_newsite.png
 
Click Create a new site and select the SampleSite template to create your first Kooboo CMS website.

kooboo_select_template.png

You can choose a template for your website. The default template selection is SampleSite. Fill in Name and Database name on the right side. Now click the Save button at the bottom.

Now you have created your first Kooboo CMS website. You can see it displayed as below:

kooboo_samplesite_start.png

This is the Start page of your website. Here you can see the sitemap view, the whole structure of your website. The SampleSite template contains a very basic Article list and detail pages.

Articles and About us are pages of your website. You can click on the down arrow of every page to see its dropdown menu. Click the down arrow of Articles. You will see a menu displays as below:

Quick_start_down_menu

Click Preview to preview this page:

Quick_start_sample_site




Step 2. Create and edit website content


In Kooboo CMS 3.0 and later versions, it is possible to edit your content on the front-end using the Inline editing feature. The Inline editing feature is turned on by default. You can turn it on or off in System->Settings.

To edit your content on a front-end page, first make sure that you have logged in to Kooboo CMS. You can then go to any page in Kooboo CMS 3.0 and click the Preview in the dropdown menu of the the page you want to edit, or directly visit the page's URL.

If you hover your mouse around the page, you will see Edit icons shown on the sections containing the Inline editing feature. Note: Site developers can decide which sections to equip with the Inline editing feature.

Inline_edit_static

Website content can be small text, content detail page, or content list page. The above example is a content list page and you hover your mouse over the item list.  When you click on the Edit icon above, you will be able to edit the whole article; the backend edit screen will open as below. 

Inline_editing

Now you can change the content the way you like. You can also insert your uploaded files into the page using Media library. When you are done changing the content, click the Save icon to save your changes.

For the content list section there are addtional toolbars that you can use to copy and delete items from the list. To create a new content item, you may use the copy icon.

Inline_editing_copy

Inline_edit_copied_item



Step 3. Add a new page

To create a new page, first click on Start on the right menu to open the sitemap. Then go to Articles and click on the down arrow. In the dropdown menu hover your mouse over Add sub page and click on two_colum. two_column is a layout defined by developers.

Page_add_new

Now you can see the Designer page. Hover your mouse over defined positions and the editing tool bar will appear as below.

New_page_create

The easiest way to add content is by using the add html icon to add static html block to a page position. 

New_page_add_html

Click OK to save changes and then click Save to finish. You have created a new page.

If you want to add this page to the navigation menu, click the navigation tab in the page designer and check the Show in menu checkbox

New_page_navigation

Once you are finished, click save to go back to the sitemap, then click the preview in the dropdown menu to view what you have created.

New_page_preview

New_page_created_preview

This is the tutorial about using samplesite or premade site templates. Continue reading our tutorials to learn about developing websites from scratch.