Building a Website with MODx for Newbies – Part 2: Installing MODx
Welcome to part 2 of our series of tutorials on building a website with MODx CMS. In part 1 we had a brief introduction to MODx, and in this second installment we’re going to download and install MODx and do some basic configuration.
Following the modality of other tutorials on this blog, I am actually going to build a website to accompany this tutorial so that you can track your progress with mine and see the actual end product of the different techniques and skills that we’ll be covering.
As of this writing, MODx is currently in version 0.9.6.3. Do use the latest stable version. If any of the steps in these tutorials change, I will do my best to make a notation in the relevant posts.
NB: I initially wrote these tutorials for MODx Evolution 0.9.6.3 but if you’re using Evolution 1.o+ they will work just fine. There are some changes in terminology, and you can get a basic idea of the differences by watching this screencast that I created. If it makes you more comfortable you can work through these tutorials using 0.9.6.3 and then upgrade your website to 1.0+ following the directions on this screencast. These tutorials will NOT work for the Revolution 2.0+ branch of MODx.
What Will We Build?
Well, just like we’re doing in the Drupal series, we’re going to build a MODx resource site aptly named Learn MODx, but the skills we learn and use as we build this website can be extended and adapted to any kind of website you want to build. Because MODx is highly adaptable and flexible, you will find that there can be many ways to accomplish one goal, and the way we do it here is not the only way to do it. I welcome your feedback, comments, and suggestions at every step.
I will use a lot of screenshots as I go so that even if you’re not following these tutorials as I create and my links look nothing like your evolving website, you can still compare your website with my screenshots.
The first step is to download the MODx package from the MODx website. Unzip the file onto your desktop and then copy or upload the contents of the folder to your webserver.
If you now navigate to the url of your project (e.g. localhost/modx or whatever your url is), and you’ll be presented with the install screen. In my case, I am navigating to http://learnmodx.maryspad.com.
Click on “Install Now” to start the install process. You’re next presented with the first step of the install process, where you choose the language you want to use for your MODx install. Click Next to go to the next screen.
You are now ready to proceed in your chosen language, so click Begin. You are now presented with the licence terms that you need to agree to by checking the box at the bottom and clicking Next.
The next step is to select what kind of install you want to run. Since we’re starting out the obvious choice is “New Installation”
The next screen is where the nitty gritty part of the install process starts. At this point, MODx will attempt to create a database for you but first needs to test your database connection and get the collation information. The first step is to enter your connection information and then click “Click here to test your server connection and get the available collations”
The information you enter here is generally your login information for your server. If the server connection is successful, you will see the success message as well as the database collation information entered in at the next step.
NB: More information on database collation provided in the comments: MODx is an international CMS with a large user base in non-english speaking regions. In order to accommodate the wide range of charsets, MODx does not limit you to any specific charset. Shane Sponagle
The next step is to now enter your database information. If you’ve already created a database, you can enter the database details and MODx will connect to the database. Otherwise, enter the name of your desired database and MODx will attempt to create it. If you get an error at this step, MODx will give you a suggestion on what you need to do, such as selecting a different character set. Once this is completed, you will see success message and you can then proceed to creating a default admin user.
The final part of this step is to create your default admin user and then click to continue to the next step. The username and password you enter here will be the ones you use to log on into the admin backend and manage your website, so you want to make sure you remember this information and keep it secure.
The next screen allows you to select what components of MODx you want to install. The default MODx install package comes with a bunch of chunks and snippets (we will discuss these as we go) as well as the option to install a sample website. The best way to start as a newbie, in my opinion, is to NOT install the sample website, so I leave that unchecked, but I leave all the chunks and snippets checked as I will need them at one point or another. If you choose to not install them, you can always add them later on.
So leave the Sample website unchecked, and the rest checked. Then go to the bottom of the page and click “Install”. The next page will confirm whether or not everything is good to go and show you any server errors or issues that need to be resolved. If all is well and all systems go, you should see a screen that looks something like below:
Excellent, so everything’s validated and we’re good to go. We next click “Install” and proceed on to the installation. MODx will install and give you an Install Results screen showing you that the installation of all the components you selected was successful, and at the very bottom there’s an option to remove the install folder and files, which you want to do for cleanup and security purposes.
Clicking on “Close” completes your installation of MODx and takes you to your login screen where you should now enter your default admin username and password that you created during the installation.
MODx is now installed successfully and we can now start building our website. What you see when you log in is the MODx administrative backend. We will explore all the parts of the backend as we use them so that you can see and explore them in context. But for now, take a look at the front end of your new MODx website either by entering the url of your site into your browser bar, or else clicking “Preview” from the admin backend.
This is what my Learn MODx website looks like at this point. It’s a default install with the default template and welcome to MODx text and tells me my install was successful.
Success, we now have a basic default install of a MODx powered website. In the next installment, we’re going to look at working with MODx templates, implement a new template to make our MODx site look unique, and then take it from there. So stay tuned.
Addendum: In the followup comments to this post, Shane Sponagle pointed out to me that it may be beneficial to install the sample website since it serves as a great example to see how to build a site in MODx. I completely agree, but feel it can be a tad overwhelming to someone who is completely new to MODx, as was the case for me. Shane’s advise if pretty sound though, so for the purpose of these tutorials, I will work with the barebones install that I outlined in this post, but I do encourage you to install a second instance of MODx locally to explore and learn from.
Shane Sponagle is a MODx developer and very active member of the MODx community. He runs the MODx Developer Blog and can also be found at his freelance website MODx Guru. He is also one of the technical editors of the new MODx book MODx Web Development.