The Web Hosting Blog of Host Color

In the last several posts on Mary’s Column, we started looking at the MODx CMS.  We have installed MODx Evolution 1.0.2 on our HostColor account and explored the backend manager.  In this post, we’re going to go through how to create and manage pages, also known as “resources” on our MODx website.

To start off, as always make sure that you’re logged into your backend manager by navigating to http://yourdomainnamehere.com/manager.

From our overview of the manager in the last post, you recall that the left pane always holds the resource tree.  This is where we can see all the pages that have been created on our site.  Let’s start off by editing the default page (MODx CMS Install Success) that came with our install.

Right click on the link and select “Edit Resource” or else just click on the link and it should open the editor in the right pane.  On the editor pane, you can now choose to open the General tab or the Settings tab to start editing this page to show the content that you want.

In the General tab, we’re going to make this into our home page with a welcome message.

As you can see, there are several fields to fill.  You can decide which ones you want to fill out and which ones to leave blank.  The title, long title, description, and url alias can be used to great benefit for SEO purposes.  All these fields can be shown on your page or referenced from other resources on the website using tags and templates.  We will be looking at template and MODx tags in future posts.  For now ensure that you thoughtfully choose the text that goes into each field. Bear in mind that your title should be succinct but still descriptive and attention drawing. This is the text that will appear at the very top of your page in the browser bar.  Similarly, if you set friendly urls, you may want to use your url alias for your page url, therefore it should also be well chosen and worded, and succinct.

You can hover over the little dialog boxes to the left of each field for more information on each.

Below these fields is the main content area where you main text will go.  If you have the rich editor enabled, you will be able to format your text, insert links, etc, using the rich text editor as shown below.

Sometimes it’s preferable to work without the rich text editor especially if inserting code, and so you may want to turn it off, but it’s a great visual tool to help you format your pages.

While editing the page, make sure to periodically save it.  You can choose from three options: save and continue editing, save and close, or save and add another page. This is nice and convenient because then you can work smoothly and transition from document to document.

From this pane, you can also delete the document, cancel your changes or preview the page you have just created.

We can now save and continue editing our page, and then click on the Setting tab to open the settings pane for this resource.

The settings pane allows you to change the settings on a document by document basis. You can preset a lot of these options in your configuration, but if you need to tweak something for a particular document/resource, you can do it in this pane.

The most important setting here is the very first one where you specify whether or not you want the resource to be published. If this option is unchecked, the resource will appear on your document tree as grey and italic but will not appear on your website.

You can also schedule the date when the resource should be published and the date it should be un-published if you want that to happen.  For example you may want to announce a sale that will expire on a particular date, and you may not want that announcement to still appear on the site after that date.  I’m sure you can think of more scenarios where this feature would be useful.

The rest of the options are pretty self-explanatory and you may not need to change the default settings and again you can hover over the small dialog boxes to the left of each to get more information and tips.   We will be talking about containers and the other settings in future posts

Once you have selected and set your configurations, you can now save and close the resource and then preview it on your browser.

We’ve gone over how to edit a resource on your MODx website.  To create a new resource, you simply click on “New Resource” in the Site tab of the main navigation, or else click on the Create New icon on top of the document tree in the left pane as shown below.  The editor that we just explored will open up in the right pane, but this time will be completely blank allowing you to create your new resource/page.

In this post, we’ve gone over how to create and edit resources or pages on your MODx website.  In the next post in this series, we will continue working on our MODx website and continue on to add more pages, and other features on our site as we continue to explore and learn more about how to work with the MODx CMS on your HostColor account, so stay tuned to Mary’s Corner.

About Mary:
I am a part time web developer and full time web enthusiast who is very committed to open source technologies and promoting their potential for use across the web. Some of the technologies that I am involved in are MODx CMS and Drupal.  I am also a fan of Wordpress, SMF, phpBB, and any and all open source endeavors. I enjoy learning new things and teaching people what I know in ways that are simple (I hope) to understand.  You can find me on the Host Color Forums (username is mary), at my blog (The Coding Pad) or follow me on twitter (@einsteinsboi).