Joomla Website Layout Customization

This is the first part of a beginner web development tutorial series for Joomla as the content management system used in a website. This tutorial is mainly written for Ubuntu-based developers with an XAMPP installation in a Linux environment. Keep reading to learn how to customize your Joomla website layout.

If you’re planning to work and develop customized Joomla websites in Ubuntu and do not have a local web server installed (LAMP configuration:  Linux – Apache – MySQL and PHP), you can read another tutorial on this site to learn to install XAMPP in Ubuntu.

If you have a fully working XAMPP installation in Ubuntu (according to the procedures provided in the XAMPP Ubuntu installation tutorial) but still do not have a default Joomla installation, you can refer to yet another tutorial to learn how to install Joomla in an XAMPP local web server. This lets you develop your Joomla website without uploading files (yet) to a web hosting company.

Make sure your Joomla installation is completely working, and that you have tested it according to the above tutorial’s requirements, before proceeding with the rest of the web development procedures discussed in this article.

How to Change Your Joomla Password in phpMyAdmin

To log in as an administrator to your Joomla website, you need to have a username and a password, which you should have configured when you installed Joomla.

The administrator login URL will be: http://localhost/joomla/administrator

However, one common mistake is forgetting the password used during Joomla installation. One of the easy ways to solve this problem is to completely change the password in a MySQL environment using phpMyAdmin. This is applicable, of course, only if you also remember your XAMPP phpMyAdmin login credentials.

If you remember your XAMPP phpmyAdmin username and password, then you can change the password to something you can remember, and use that password to log into your Joomla website as an administrator. Once you are logged in, you can start configuring and developing your website.

Step 1. Open this URL in your browser: http://localhost/phpmyadmin

Step 2. The warning “Authentication required” will pop up. Enter your XAMPP username and password (not your phpMyAdmin login credentials yet). These are is the same login credentials you will use if you log in to http://localhost/xampp

Most usernames will be using “lampp,” and the password is set to your own personal choice.

Step 3. After logging in, you will see the phpMyAdmin login form. Enter your MySQL username and password, and then click Go.

Step 4. You will see a list of MySQL databases on your left. Click the Joomla database.

Step 5. The Joomla database consists of around 38 MySQL tables using the latest version (Joomla 1.5, as of August 2010). In the table list, click jos_users. This is the table where you will change your Joomla password.

Starting with Joomla 1.5, it is slightly complicated to change your password because of the new password format. It currently consists of two parts, the encrypted password and a salt, separated by a colon.

To make things easy, click the pencil icon to edit the password entry.

Step 6. Delete or clear the old password field. Once you do that, it should look like this:

Do NOT press “go” yet.

Step 7. Go to this URL: http://www.subclosure.com/generate-new-joomla-1-5-md5salt-encrypted-passwords-to-store-in-database.html

Type your desired password in the form under the field “Enter desired password” and then click “make password.”

Step 8. Copy and paste the result of “Encrypted Joomla password” to the password field in your phpMyAdmin jos_users table.

Step 9. Click “Go.”

Step 10. Now, try logging in to the Joomla administrator URL, namely http://localhost/joomla/administrator, to test your newly set password. It should work this time.
 
{mospagebreak title=Changing Default and Uploading Joomla Templates}

Changing the Default Template

If you would like to change the view or template used by your default Joomla installation, for example, follow the procedure below:

1. Login as administrator (http://localhost/joomla/administrator).

2. Go to Extensions –> Template Manager.

3. Joomla (version 1.5 as of August 2010) currently has three available built-in templates from which to choose (beez, JA_Purity and rhuk_milkyway). Select the radio button of any templates you would like test. After that, click “Default.”

4. When you see a star beside that template, it is the currently active template used by your Joomla website. Example:

In the screen shot above, the currently installed template is JA_Purity.

6. Now go to your Joomla website, namely http://localhost/joomla, and you will notice that your website’s template has changed.

Uploading a New Template

It is also possible that you have your own template, which you have uploaded into your website’s Joomla template directory. In this tutorial, you will only be dealing with open source Joomla templates. Once you are familiar with open source templates, though, you might want to buy commercially-based Joomla templates.

Below are the steps that you should take if you are looking to install a new open source (free) Joomla template into your website.

Step 1. Go to this website: http://www.bestofjoomla.com/component/option,com_bestoftemplate/Itemid,46/

Note that you can find a lot of sites on the Internet that offer free Joomla templates. The above link will be used as an example.

Step 2. In the Advanced filter (right column portion of the website), click “GNU GPL” under “Licenses” and “Joomla 1.5 Native” under “Compatibility.” Leave everything else at their default settings.

Step 3. Click “Apply.”

Joomla 1.5 Native templates work for the current version of Joomla.

Step 4. For the purpose of illustration, let’s use this template

Click the “Download” button, follow the rest of the procedure and the template will be downloaded to your Ubuntu Download folder.

The downloaded file will be a zip archive.

Step 5. Right click on the zip file and click “Extract Here.” In the extracted folder, find vj_anelco.zip. This contains the final template files that you will need to upload to your Joomla template directory.

Copy this zip file to your Desktop.

Step 6. Log in as a Joomla administrator.

Step 7. Go to Extensions –> Install/Uninstall.

Step 8. Under FTP Login Details, enter your username and password.

Step 9. Under “Upload Package File,” browse to your Ubuntu Desktop where the template zip file has been placed. The path example will be like this:

/home/codex-m/Desktop/vj_anelco.zip

Do not do anything to “Install from Directory” and “Install from URL.”

Step 10. Click “Upload File & Install.”

Step 11. If you see the “Install Template Success” message, then the template file has been installed in Joomla without any problems. You can double check it under Extensions –> Template Manager, where you should see a new template called “vj_anelco” installed.

When you deactivate or uninstall a template, just follow the simple procedure below:

Step 1. Go to Extensions –> Template Manager, change the current template to another one (beez, for example).

Step 2. Now that the current template is inactive, you can safely uninstall it by going to Extensions –> Install/Uninstall –> click on “Templates” tab. Click the radio button of the template you would like to remove and hit “Uninstall.”

Activating the Newly Uploaded Joomla Template

To test the newly installed template, let’s activate the template "vj_anelco" in Template Manager. Now go to http://localhost/joomla. Your Joomla website should look like the screen shot below.

As you can see, even though you are now using the desired template, there is still a lot of work to be done to this website. Below is the web development checklist that will help you to make this website as complete and ready as possible:

  1. Change the website’s header image.
  2. Edit the website’s content.
  3. Change the header tags to something relevant to your website.
  4. Change the sidebar navigation to something more useful.
  5. Convert the default URLs to SEO-friendly URLs.

The current URL is not recommended, as it appears complex and not friendly to both users and search engines (e.g http://localhost/joomla/index.php?option=com_content&view=article&id=44:joomla-security-strike-team&catid=1:latest-news&Itemid=50 )

These checklists will be discussed in the upcoming Joomla web development tutorials in Ubuntu.

[gp-comments width="770" linklove="off" ]
antalya escort bayan antalya escort bayan