Pages Basics

The Pages feature is how you create and edit the pages on your website. If you create a new page called 'about.txt' it will be accessible from a web browser at 'yoursite.com/about'.

Editing Pages

Pages can be composed in either plain HTML or  Markdown.

To place an image into your page, use the 'Media' feature to upload an image. Then click the image to get the HTML code. Once you have the HTML you can paste it into your page.

To enter the page title and description, click the 'Meta' button to reveal input fields for both.

Delete, Rename, Move Pages

To delete a page, go to the pages list view and click the delete icon next to the page you want to delete.

To rename a page, first click into the page, then click "rename" which is located in the top right corner.

To move a page to another folder use the rename feature and add or edit the folder in front of the file name.

Using Blocks With Pages

While advanced users will have no problem editing page content in HTML or Markdown, some users may prefer to use a WYSIWYG editor. This is where blocks come in. To place a block into your page, use the following syntax:

{{block:myblock}}

Now switch over to blocks and open 'myblock' to edit your content in an easy to use WYSIWYG editor. All changes you make here will display on the page where you placed the block.

In the example above, the entire page is one big block that is a single column. But in some cases you will need a multi-column layout. For example, a page that has a main column for the primary content and a smaller sidebar for secondary content. To accomplish this, you can mix some HTML for structure and blocks for the editable content.

<div class="units-row">   
	<div class="unit-70">{{block:main-content}}</div>   
	<div class="unit-30">{{block:sidebar}}</div>
</div>

In this example, two columns are set up with corresponding blocks for editing the content in each. The main column has a width of 70% and the sidebar column has a width of 30%. You can easily change the percentage to meet the needs of your design.

This assumes you are using the default template which includes CSS for the  Kube grid in the 'base.css' file. If not you can use any grid or css you like, the concept remains the same.

Manual Editing of Pages

It is also possible to manually edit a page in your favourite text editor.

But in order to do so, you need to understand how page .txt files are formatted. Here is an example of a simple page:

Page Title

This is where the page description goes.

<p>And finally the content goes here.</p>
<p>Some more content here.</p>

The first line of the file is reserved for the page title. Then an empty line followed by the meta description. After another empty line begins the content of the page which can be either HTML or Markdown.

Still need help? Contact Us Contact Us