Customize your Joomla site template with your own design! Yeah, you can modify your site pattern easily and drawing it looks like what you want. As you know, once you join this CMS web application, you are able to choose the default templates which match to your site's content. But the default model will make your site design similar to other site's design. Sure, you want to be different than other, right?
That's why you need to customize the default template. Before you adjust it, you must know how Joomla template system works. Find the template system by entering the Administrator panel and click Extensions menu and choose Template Manager. In this section, you'll see that Joomla comes with two patterns. If you select Default button, it means that you use the original style, but if you click Default and Assign buttons, you'll be able to modify your own site design.
In creating new sites design, you need duplicate one of the original styles and put it on the list. Make sure that the new model change based on the original. Then, you can customize the new one.
Here is the details step to change your Joomla templates:
1. Copy the template folder in Templates and name the folder with your own name.
2. Customize the templateDetails.xml.
3. Upload it to webshot.
4. Ensure that your new pattern placed in Template Manager. Compose that as the default without other task in any other pattern.
5. Edit the HTML and CSS by using Edit HTML and Edit CSS buttons that are available in Templates Manager.
6. After you Edit HTML, you have to replace the illustration of the default outline path with the new one.
7. You can check the module which will be published in Module Manager (Module -> Site Module). It will show you the module that will be published in a certain position.
8. To change the word style of text in the user interface, find the define constant in Language / English.php.
It's better for you to change the body background-color with CSS rule in the internal CSS style sheet of index.php. Because customize the background color in external style sheet will make the story edit panel have background color too.