You are on page 1of 18

HOME

ABOUT & SUPPORT

BUILDING A SIMPLE JOOMLA


WEBSITE

RESOURCES

FAQ

Tw eet

Here's a tutorial on how to build a simple


Joomla website.
Joomla is a and free website content
management system. It is a great platform for
building both simple and complex websites. It
uses templates (also known as themes or
designs) and different modules to give the look
open in browser PRO version

Are you a developer? Try out the HTML to PDF API

pdfcrowd.com

& feel to your website.


This step by step guide also assumes that you
have already installed Joomla (with "1 click
install" or manually) to your web host. In case
you don't have a domain or hosting yet, feel free
to head over to the homepage to see my
recommendations.

HOW TO BUILD A WEBSITE


WITH JOOMLA
open in browser PRO version

Are you a developer? Try out the HTML to PDF API

pdfcrowd.com

1. BASICS OF JOOMLA

Joomla is a powerful and free website content management system. It is


a great platform for building both simple and complex websites. It uses
templates (also known as themes or designs) and different modules to
give the look & feel to your website. In order to start building your Joomla
site, you need to log in from http://yoursite.com/administrator
SETTING WEBSITE TITLE & BASIC SETTINGS

1) In admin go to System -> Global Configuration.


2) In Site name fill in the title of your webpage.
3) In Site meta description type your webpages short description
(not more than 160 letters recommended).
4) In Site meta keywords fill in some of your site specific keywords,
open in browser PRO version

Are you a developer? Try out the HTML to PDF API

pdfcrowd.com

use commas to separate each word.


5) In SEO settings, recommended settings (for better search engine
visibility) are Search engine friendly URL-s to YES and Use URL
rewriting to YES (for URL rewriting to work you need to log in to your
sites FTP and in your Joomla installation folder rename htaccess.txt
to .htaccess.

2. SELECTING/INSTALLING A TEMPLATE

After the installation of Joomla platform you will have the website ready
for use with the default Joomla template. Visit your website to see how it
looks. To change the design, you will need your own template. Templates
are created and zipped to one .zip file and can be either downloaded for
free from free template providers or bought for a fee from paid template
open in browser PRO version

Are you a developer? Try out the HTML to PDF API

pdfcrowd.com

providers. Usually free templates include a hyperlink to the author or


other special conditions, consult the terms when downloading.
To download a template for your new website, you can Google for
Joomla 3 templates. Go to websites that show up in search results,
preview the templates, select the one you like and purchase/download
the template. Joomla 3 templates fit onto Joomla 3.x installs, where x
stands for 0,1 or 2 at the given moment.
When downloading the template, leave it to .zip format (dont unpack it).

INSTALLING A TEMPLATE

1) In admin panel, go to
Extensions -> Extension
manager
2) Click on button Choose file and
select the downloaded template file from your computer
open in browser PRO version

Are you a developer? Try out the HTML to PDF API

pdfcrowd.com

3) Click Upload & Install


4) If you receive the message Installing template was successful, you
can proceed to next step, if not, you need to investigate your server
settings.
5) Go to Extensions Template manager.
6) Check the checkbox before your newly installed template and click
on Default on the top menu.
7) Go and refresh your Joomla website frontend to see the template
applied.

3. CREATING CONTENT CATEGORIES AND


PAGES

It is recommended to create categories for your website pages, although


open in browser PRO version

Are you a developer? Try out the HTML to PDF API

pdfcrowd.com

you can also leave all your website pages in category Uncategorized .
Add at least the main category like this.
1) In admin go to Content > Category manager
2) Click New to add a new category
3) Give a title to your new category (e.g. Website pages) and click on
Save on top leftCreating content pages
Now you have a category to add site pages to.
Simple websites consist of usually 3-4 pages. These can be the main
page, the services introduction, the pricelist and the contact page. Lets
create these pages .
.

In admin go to Content > Article manager


. Click on New
. Give your article (page) a relevant title (e.g. Welcome to our website!)
. Select the category this article applies to (e.g. previously created
Website pages)
open in browser PRO version

Are you a developer? Try out the HTML to PDF API

pdfcrowd.com

Type the text for the article in the text area. You can use Joomlas
inbuilt WYSIWYG editor to style your text as you wish.
.
To save the article, click on Save, to Save and finish editing (return to
articles list), click on Save&Close.
You should do this 3-4 times to create all your pages you want on your
website.

4. MODULE POSITIONS
open in browser PRO version

Are you a developer? Try out the HTML to PDF API

pdfcrowd.com

You have module positions in your template that you can use to place
various modules on your website. How can you know, which module
position is where? Turn on Joomlas inbuilt position preview option.
1) In admin go to System -> Global Configuration ->Template manager
2) Click on Enabled in section Preview module positions.
3) Click on Save.
4) Add ?tp=1 to your website url in your browser to view possible
module positions on your template. The URL should look like
http://www.yourpage.com/?tp=1 to view the positions.

open in browser PRO version

Are you a developer? Try out the HTML to PDF API

pdfcrowd.com

Find the desired position for your top menu. In this picture the suitable
position is position-1. Note that usually the Top menu position is
documented in the template readme file or on the template providers
homepage. You will create and assign a top menu to that position in the
next step.
UNDERSTANDING MODULES

open in browser PRO version

Are you a developer? Try out the HTML to PDF API

pdfcrowd.com

In admin go to Extensions -> Module manager. You will see a list of


modules, active or not active, that are available on your Joomla website.
For example, if you are not planning to include any content on your page
that is only available to registered users or in general you will not need
the login-registration module on your website, you can simply disable it.

To disable a module, just click on the tick in the column Status. After
clicking it, the checkmark becomes an X. Refresh your website to see the
module disappeared.

open in browser PRO version

Are you a developer? Try out the HTML to PDF API

pdfcrowd.com

5. CREATING A MAIN MENU AT THE TOP


POSITION

Most Joomla templates provide the ability to use main menu on the top
menu position. Usually this position is right after the header and before
content. Lets create the menu items that point right to our newly created
content pages.
1) In admin go to Menus -> Main menu
2) Select New from the top left corner
3) Click on Menu item type to define the type of this menu item.
open in browser PRO version

Are you a developer? Try out the HTML to PDF API

pdfcrowd.com

Select Article ->Single article from the popup.


4) Click Select article to define the article this menu item points at.
Select one of your articles you created from the popup list.
5) Type the menu item title (will appear on the page, should be short,
e.g. Welcome!)
6) Alias field can be left empty to let Joomla create the alias based on
your written menu item title.

7) Menu location should be Main menu and status should be

open in browser PRO version

Are you a developer? Try out the HTML to PDF API

pdfcrowd.com

Published

. 8) The rest of the settings can be left as they are on the right side by

default.

open in browser PRO version

Are you a developer? Try out the HTML to PDF API

pdfcrowd.com

9) Click on Save & Close and create a menu item for each of the articles
(pages) you need.
Now you have a menu, it only needs to be positioned. In previous
chapter you found the position that can be used as the position for your
top menu. Lets assign the main menu to that position.
1) In admin panel, go to Extensions -> Module manager
2) Click to select Main menu
3) In Position select the proper position for your main menu, so it
will be displayed on the top

open in browser PRO version

Are you a developer? Try out the HTML to PDF API

pdfcrowd.com

4) Click save, refresh your page. (remove ?&tp=1 from the address bar if
youre still seeing the module positions)

6. EDITING ARTICLE VIEW SETTINGS

1) In admin go to Content -> Articles


2) Click Options
open in browser PRO version

Are you a developer? Try out the HTML to PDF API

pdfcrowd.com

3) There are various options that you can change in the way your
articles are displayed. Most often, if you are creating a website for
your company, you dont want options such as show author, show
publish date, show voting, show icons, show hits, show
category etc enabled or else you will have a lot of irrelevant info on
your site that looks like this

Turn off all the features you dont want appearing on your articles and
click Save on top left corner.

OTHER HELPFUL RESOURCES


open in browser PRO version

Are you a developer? Try out the HTML to PDF API

pdfcrowd.com

Here are some addition resources that you can feel free to have a look at:
Joomla! Documentation Official tutorials from Joomla! developers
Setting up Joomla website Youtube video (1 hour long)
Joomla training Super comprehensive guide by JoomlaShack

If you need any help setting up a Joomla website, feel free to contact me:
robert@websitesetup.org

2014 WebsiteSetup.org is powered by WordPress. Author: Robert


Mening

open in browser PRO version

Are you a developer? Try out the HTML to PDF API

pdfcrowd.com

You might also like