Browse By

How to make website with MODx CMS in 10 minutes

modx_logo.pngIn this MODx CMS tutorial, I will show you how to install MODx, find and install MODx template, add or modify your content. On the way you will explore the backend interface and a number of the standard MODx features. In the end you should get a MODx driven website with your own content. It’s just the beginner MODx guide, so don’t expect I’ll go too much into the details: the purpose is to quickstart your first MODx site as soon and as easy as possible. In the next MODx tutorials I’ll go deeper into building websites with this powerful CMS, so stay tuned.

What is MODx CMS?

MODx is a free opensource new generation CMS with PHP Application Framework functionality and extensive API. What stands it from the crowd of other CMS except Most Promising Open Source CMS award in 2007 by Packt Publishing? Why it can be better those CMS monsters like Joomla or Drupal?

MODx provides a flexible API and event model that allows you to override core behavior. You can build XHTML 1.0 Strict sites just as easily as a pie. Menus made from ULs (unordered lists) are ready to go out of the box. MODx is the dream CMS for CSS and Standards oriented designers.

Besides that, MODx is the first free PHP CMS to offer an API that fully supports Web 2.0 Ajax technology. MODx gives you the freedom to choose jQuery, Mootools, ExtJS, Prototype or any other library you choose. MODx can be deployed “to the cloud” via Amazon EC2 Complete. It features full control of all metadata and URL structure for Search Engine Optimization (SEO) purposes.

How to install MODx?

Before installing MODx you need to create a MySQL database and write down the username and password. Make sure that the /assets/cache (and its files), /assets/export and /assets/images folders are world-writeable (777). You also may need to create an empty file in the manager/includes directory named config.inc.php and make it world-writable. After the installation is completed, change the permissions on that file to read-only.

MODx installation

1. Download MODx CMS and unzip the MODx zip file to a folder on your hard drive.

2. Copy or FTP the unzipped files and folders inside the new MODx directory into the root of your website (e.g. c:\mymodxsite\ or ftp.mymodxsite.com).

3. In your web browser run the index.php file located inside the install folder on your MODx website. For example, http://yoursite/install/index.php, where “yoursite” is the name of your website.

4. Then you will be provided with the simple on-screen instructions to complete the installation.

You need to choose a language (English is default), accept MODx license agreement, choose installation mode (it’s obviously new installation). In a next step you need to put in database user and password and password for admin user.

Don’t forget in the next step to check Install/Overwrite Sample Web Site checkbox, otherwise you will face just blank website without any data after the installation.

After clicking ‘Next’ and ‘Install’ a couple of times you will see Login screen.

How to find free MODx template and install it?

Before creating a custom template design for MODx or converting existing XTML template, it’s a great idea to play with existing ones. Let’s choose one template from official MODx repository.

1. After you download a MODx template in a zip archive you need to unpack it to your assets/templates folder.

2. Go to the MODx admin area which is called MODx Manager. Select ‘Resources -> Manage Resource’ in the upper menu. Clicks ‘Create a new template’. Set a name and a description for your template, and optionally add the template to a category to help keep your resources organized.

modx template

3. Copy/paste the content of the Yourtemplatename.template.html file (it’s located in the template folder, read Readme or Installation.txt file included) to the text field labeled ‘Template code (html)’ and click on ‘Save’.

4. Now go to the Home page of your test MODx site and click in the floating bar ‘Settings -> Template’ and choose the name of your template and click Apply. Now you should see the custom template design instead of the default one.

How to add and manage the content in MODx?

After you finish with the template installation, first thing you need to do is to change the site name which by default is ‘My MODx Site’. Go to MODx manager (Admin area), click Tools->Configuration, enter your site name and click Save icon.

To Add, Edit or Delete any pages of your website you need to use MODx site tree which is placed in the left sidebar of the admin area.

MODx content

So choose Home in the site tree and click Edit icon. Now Edit document screen opens where you can edit the content of the page using WYSIWYG editor (TinyMCE by default) or turn it off.

If you find this tutorial useful, subscribe to the RSS feed, follow me on Twitter and stay tuned for the more deep and detailed MODx tutorials.

Share This
Facebooktwitterpinterest

2 thoughts on “How to make website with MODx CMS in 10 minutes”

  1. CONIN says:

    Besides the ‘Most promising CMS’ is modx a very cleverly made CMS. What it makes so beautiful is the strict separation from programming, design and content.
    And most of all, you can instruct your clients within 1 or 2 hours using it correctly.

    The new Evolution is a step further with package management, multi language support and all.
    This is my Choice of the year 2011. Nothing more.

  2. Anonymous says:

    Oh c’mon. Best promising awards mean nothing. PackT Publishing only gives out awards so it can shill its books (of which ModX is one of them). I give a grain of salt to Packt Awards. Their books suck, have little content, priced too much and in general are crap. Go look at Amazon reviews and you will see what I mean.

Leave a Reply

Your email address will not be published. Required fields are marked *

14 + 20 =