Making a website with CMS

head-image

Making a website with CMS

  • How to get started (domain and hosting)
  • Comparison of the main CMSs
  • Creating website with WordPress (benefits of WP)
  • Creating website with Joomla
  • Creating website with Drupal
  • Creating e-commerce site (PrestaShop, Magento, etc.)
  • Other popular CMSs you can use

As described above, a content management system (CMS) allows you to create and maintain a website within a central dashboard. You start with the software installed on your web hosting account. Once installed, you can log in to your administration area—the dashboard of the CMS. From the dashboard of a website, an administrator can handle a multitude of tasks. These include the following, depending on the content management system you choose:

  • adding, editing and deleting website pages and blog posts
  • adding users with specific user roles and permissions
  • adding, editing and deleting themes
  • applying or deleting add-ons (plugins) for functionality
  • moderating comments on blog posts

Types of content management systems

There are two main types of CMSs: self-hosted—open source and hosted—proprietary.

Self-hosted (recommended) CMSs are open sourced and free to use. They enable you to create a website using one of the CMS platforms on your own domain and web-hosting account. The greatest advantage of using a self-hosted content management system is that you have full control over design and functionality. This is the recommended option.

Hosted CMSs are all-in-one solutions. They allow you to create a website using the platform without storing it on your own hosting account. The advantage of this solution is that you don’t have to worry about CMS installation processes and software updates. But you will not have as much control over the design and functionality of your website. Also, companies that provide hosted CMSs retain all proprietary right to the website you made and you are required to abide by their terms of use.

Costs to run a self-hosted CMS website
Establishment costs Min and max cost Time period
CMS Free open source
Domain name $10 – $15 (for .com domain) per year
Web hosting $60 – $200 (shared hosting) per year
$300 – $1000 (VPS hosting) per year
Website backup * $10 – $30 (offered with hosting) per year
Domain privacy * $10 – $20 (offered with hosting) per year
Website security * $20 – $500 per year
Website acceleration (CDN) * $9 – $300 (depends on GB used) per month

*These items are not necessary in the start-up phase of your site.

CMS comparison

The most popular content management system used on the Internet today, according to BuiltWith, is WordPress. More than 14 million websites use WordPress. The second most popular content management system is Joomla. Joomla is used on more than 2 million websites. Next, you have Drupal, with more than 750,000 websites.

It’s free/open source
You’ll have access to all the free goodies the WordPress community has created.

No coding knowledge needed
You don't need coding knowledge to handle tasks related to creating and maintaining your website.

Automatic updates
Software updates are done automatically or can be done within the dashboard with the click of a button.

Support
You’ll get support for anything you need: including customization, design, functionality and maintenance.

In this chapter, we’ll explain how to make a website with the three most popular CMSs: WordPress, Joomla and Drupal. Each platform is powerful and can be used to make any type of website. These platforms require you to have your own hosting account where you will install it.

 

Creating a WordPress website

There are two ways to install WordPress: one-click install (recommended) and manual install (advanced).

One-click install

Depending on which hosting company you sign up with, you may find it very easy to setup a WordPress site. Major hosts offer pre-installed or one-click installation of WordPress. While each host has slightly different control panels, the installation process will be similar. Once you sign up for the hosting services, you’ll find an icon on the host’s control panel that says something like, “One-click installation,” “Install popular software” or “WordPress installation.” To install WordPress onto your site, it’s as simple as clicking the icon and following the step-by-step instructions to install the latest version of WordPress.

Watch how to install WordPress (Coming soon)

Installing WordPress manually

If your host doesn’t have a one-click installation (this may indicate that this host is not the best choice), WordPress has complete instructions on how to install it manually at wordpress.org.

Using the WordPress and managing your website

WordPress consists of two areas: front end and back end.

The front end is what your visitors will see when they come to your website. Many of the tasks performed in the back end will be visible on the front end, such as theme customizations, plugin functionality enhancements and content publication. There are also actions that can be performed by you and your visitors directly from the front end of the website, including commenting and social sharing.

The back end, also known as the WordPress dashboard, allows you to fully manage your site's content, community, functionality and design. It is accessible only by users who you assign to an account on your site. In order to access your WordPress dashboard, you need to type yourwebsite.com/wp-admin in the address bar of your browser and log in using your WordPress username and password.

The dashboard

The Dashboard is the center of website administration. It consists of three main parts: left side menu, top toolbar and middle section. The left hand column of your WordPress dashboard is where you’ll find all of your administration options. This is where most of your creative effort will be focused.

The left side menu content includes the following tabbed options:

Home
Takes you to your dashboard.

Updates
Indicates if any themes or plugins need to be updated because a new version has been introduced. If WordPress itself is updated, you’ll see a number in a red circle next to this menu item.

Posts are usually blog posts. They’re usually time-sensitive news items.

Media
Here you’ll see every photo, video and file you’ve uploaded as part of a post or page. You can also upload files directly to the media section.

Pages
Usually contains evergreen, static web pages. Examples include the “About Us” section on a company website or the “Services” page.

Comments
Notifies you when people comment on to one of your posts or pages. If you have comments, there’ll be a number inside a red circle next to this.

Appearance
This is where you’ll find themes, design and appearance features.

Plugins
These are extra mini-programs that help increase the functionality of your site. You can use plugins to turn your website into a membership site, add social media sharing, eliminate comment spam or just to do something cool or fancy with your graphics.

Settings
Settings has a number of uses. It’s the first place you want to go when setting up a new site.

Changing the design of your website

Once you’ve installed WordPress on your domain name, by default you’ll get a basic automatically selected theme on your website.This theme and your website design can be easily changed by choosing from more than 1,500 free themes available in WordPress.

Themes can be found under “Appearance” menu item by selecting “Themes” subcategory. From this menu, you can select a new theme from the WordPress repository. Here's a quick checklist for choosing your theme by searching within the dashboard:

Read the description

Each theme usually comes with the short description of its features and functionalities. By reading it you should have a rough idea if the theme matches your needs and how customizable it is.

Check the ratings

Popular themes will have star ratings that are visible in the preview and under theme details. They should give you a clear idea how good the theme is.

Preview the theme

Preview the theme to get an idea of the overall look and layout.

Check for responsiveness

Aim for a responsive design that will work on desktop browsers and mobile devices. This is recommended by Google.

If you find a theme that takes your breath away, cool down. Once you install the theme you like, don't be surprised if it doesn't look quite right. Your theme is just a skeleton of your website—to make it appealing you will have to fill in content (text, photos, videos, etc.).

Notes

The reason that WordPress is widely used is because it’s so versatile. WordPress is user-friendly, so small businesses can use it without a major investment of time learning how it works. Yet WordPress is robust enough to be used even for large corporate or commercial websites.

Because it is so prevalent, there are a lot of developers, programmers and coders who work with WordPress. And there are a lot of tech-savvy people who continually design themes, plugins and new features to add to your WordPress site.

Creating a Joomla website

Joomla was released to the public in August 2005. With each passing year, it has continued to grow its presence as one of the most powerful content management systems.

As a free and open-source CMS, Joomla is not only simply to install (one-click install option is available with the most hosting providers) but it also provides the ability to make customizations based on the user’s specific wants and needs. Written in PHP, Joomla includes a variety of features that have helped increase its popularity. These include blogs, news flashes, polls, RSS feeds and page caching.

Benefits of Joomla CMS include:

Powerful, simple-to-use menu creation tool
This is just one of the many reasons why Joomla is the number-two CMS option.

Strong community support
This holds true with other platforms, but Joomla is a strong player in terms of this benefit.

Extensions
Approximately 9,400 extensions are available for Joomla that can help you customize your site.

Installing Joomla

For those who want to give Joomla a try, it doesn’t take long to get up and running. As with WordPress, you have two installation options:

  • One-click installation is the recommended option and can be completed within minutes.
  • Manual installation takes anywhere from 20 to 30 minutes to complete.
Watch how to install Joomla (Coming soon)

Once the installation is complete, you have a website that is live to the world. It will be very simple, but remember that you can customize every element of your website. From the layout and color to the menu content, you have the ability to make as many changes as you want.

Using Joomla and managing your website

With Joomla, you’ll find that most of your activity as the administrator of the website will be focused inside the “Control Panel.” To log in to your control panel, add the word /administrator/ to the URL of your site. For example, YourWebsite.com/administrator/. Easy to understand and navigate, the control panel has all the information and tools you require to make changes, add content and get an overall picture of your site’s status.

Generally speaking, there are three key areas of the control panel:

Left menu bar
Contains: Find Content, Structure, Users, Configuration, Extensions and Maintenance.

Header menu
This is where you can access many of the same areas as the left sidebar, as well as a dropdown menu for System, Menus, Components and Help.

Main content area
Shows Logged-In Users, Popular Articles and Recently Added Articles.

Changing the design of your website (view video)

After you set up a basic website, it’s time to consider your options for customizing each page. To get started, head to the “Extensions” tab in the header menu and drop down to “Template Manager.” Here you can dive deeper into the template that is installed, while also considering other layouts that may suit your website. If you click on “My Default Style” and then the “Options tab,” you can change the text and background colors, upload a new logo and add fonts.

The “Module Manager” is also important from a customization standpoint. It allows you to add, delete and edit modules.

Adding content (view video)

A visually appealing website is a great start, but it won’t take you far unless you add high quality content. With Joomla, this is a simple process. On the left sidebar, under the “Content” header, you will find the following:

  • Add New Article
  • Article Manager
  • Category Manager
  • Media Manager

If you click on “Add New Article” for example, you will be taken to the page where you can add your content, choose your publishing options and click “Save.” There are more features on this page, such as publishing, image and links, so be sure to experiment with each one.

Notes

If you know you’ll be hosting a lot of articles on your site and don’t need many features, Joomla can certainly be the CMS of choice. It gives you the power to create a website quickly, and with a bit of training, offers the shortest development cycle in the CMS arena.

Creating a Drupal website

If you’re looking for a content management system that’s more robust than WordPress but still gives you a lot of free options for themes and modules, consider working with Drupal. Like WordPress, it’s a free CMS that lets you build a website easily. But Drupal is more robust and allows greater flexibility than WordPress.

Drupal is more challenging to use than WordPress or Joomla, but with many free plugins and themes, it’s a great choice for a larger or more robust website that’s going to require greater functionality than a simple one-page website.

Installing Drupal

Similar to other CMSs, you’ll have two options:

  • Many of the popular hosting providers offer a one-click installation of Drupal. And installation can be completed in as little as ten minutes using the single-click installer provided by your web host.
  • If you’re planning to use custom setup options or your host doesn’t offer one-click option, you’ll need to install Drupal manually. Instructions are available from Drupal here.

Using Drupal and managing your website

When you open your website’s homepage, it should take you to a login page (or simply choose the Login tab). Log in with your username and password from the installation process. Once you’ve logged in, you’ll see your site’s homepage and the administrator menu bar at the top. This is where you’ll do most of the customizations. The tabbed menu bar consists of:

Dashboard
Gives administrators a customizable overview of important site information. You can add and remove items from the dashboard or you can disable the dashboard completely.

Content
This is where you find, manage and create new pages. You also manage comments here.

Structure
Edit blocks, define new content types, configure menus, administer tags and configure some contributed modules.

Appearance
Switch between themes, install themes and update existing themes.

People
Manage existing users or create new user accounts.

Modules
Update, enable, disable and install new modules under this tab.

Configuration
Lets you configure the settings for certain functionality features, including some modules: user settings, general site information and other general administrative settings.

Reports
Displays information about site security, necessary updates and information on site activity.

Help
Displays links with information and online documentation about the functionality of all modules installed on the site.

Right side
Includes user-specific items such as user account and log out.

Shortcuts submenu
This is where you can add the most commonly used menu items.

Changing the design of your website

The Appearance menu item allows you to select a new theme or customize your existing theme. Like WordPress, Drupal gives you the option of setting a different theme for your front and back ends. To install a new theme, click on the text at the top left-hand corner of the lightbox that says, «Install New Theme».

Installing a new theme on Drupal is slightly more challenging than on WordPress. Once you’ve found your new theme, you can download it in a compressed (.zip or tar.gz) format. When you’ve clicked on the Install new theme, you’ll then select your compressed file using the «Upload a Module or Theme» section of the lightbox.

Basic settings can be altered by using the Settings tab of the Appearance lightbox. This allows you to determine whether a logo, site name, secondary menu and other items will be displayed on your site.

Notes

Like many forms of software, the more options you have, the harder it can be to figure out how to use it. Drupal has many options that allow you to have maximum customization, but it does take some time to learn how to use it effectively. Give Drupal a shot; play with its various features and functions and you’ll have a unique and beautiful website in no time.

Creating a Prestashop (e-commerce) website

If you want to create an e-commerce store, you’ll need to choose a content management system that will help you with the process of selling products as opposed to solely serving posts and pages. It can be challenging to know where to begin navigating with so many options available.

For many people who want to sell online, Prestashop is a viable solution. It’s an open-source shopping-cart software designed to give businesses the flexibility to build a functioning online store.

As with regular CMSs, Prestashop can be installed manually or with easy one-click install processes. Most hosting providers offer a one-click install option, which we recommend. You should easily find it within your host’s control panel.

Using Prestashop and managing your website

After you install Prestashop, you’ll get login instructions that will enable you to access the administrator control panel. To help you get your online store setup faster, Prestashop will offer to take you through the setup tutorial and perform the following steps. (Or you can skip the tutorial and go directly to the administrator control panel).

  • Customize your shop’s look and feel
  • Add products to your catalog
  • Set up your payment methods
  • Set up your shipping methods

We recommend that you install the default free theme. You can always change it after you’re more familiar with the platform. Once theme installation is finished and you’ve completed the setup tutorial, you can return to the main administrative area. This panel is the center of store administration. It consists of two main parts: a left-side menu and a middle section. The-left side menu is contains all of your administrative options. This is where most of your creative effort will be focused. The middle section displays all of your store’s operational information such as the number of registrations, orders and sales totals.

Let’s look at the each tabbed option in the left side menu:

Dashboard
Takes you back to the main page of your admin panel.

Catalog
The heart of your shop, where you’ll perform tasks such as adding products, creating categories and setting up carriers and suppliers.

Orders
Contains orders with the invoices. This is where you’ll manage tasks such as handling merchandise returns, credit slips and per-order customer service.

Customers
Access information about your clients. Here you may edit customer addresses, apply special discounts and handle customer service.

Price rules
Create vouchers and price reductions through a set of rules.

Modules
Extends the power and usefulness of your shop. More than 100 modules are available by default and many more can be purchased from the Add-ons Marketplace.

Shipping
Where you manage everything related to carriers and shipping costs, as well as marketing.

Localization
Customize your shop with local values, such as language and translation, currency, units, taxes and tax rules, and geographical entities.

Preferences
Fine-tune the way your store functions and manage every aspect of the customer experience.

Advanced parameters
Contains links to specific tools and informational pages, such as the Web service settings, the database backup tool and the performance page.

Administration
Lets you set the administration panel, including the content of the Quick Access menu, the employee list and permissions, and the order of menu contents.

Stats
Provides access to all the statistics and graphics that are gathered and generated.

Changing the design of your store

Prestashop has done a great job creating documentation that covers the basic aspects of the platform. There are separate guides for designers, developers and merchants.

When it comes to changing the look of your online store, Prestashop has more than 3,000 themes and modules. The company offers tips for installing themes, as well as a demo store that enable users to preview a theme. While users have to pay for add-ons such as social media and PayPal integration, there are out-of-the-box features that command user attention. Tools such as sales tracking, wish lists, unlimited currency support, one-page checkout, international shipping, MailChimp and Olark make it easy to customize your website and make a retail business.

Notes

While Prestashop has its shortcomings, such as expensive modules and limited marketing opportunities, it proves itself as a powerful adversary to other shopping-cart solutions. For the backend, the dashboard gives you everything you need to manage your business. It supports all major shipping carriers and comes with more than 10 payment methods, giving you flexibility to meet demands of different customers