How to create a template for Joomla?

 

sketch site_250

If you were searching online for an answer to this question you've probably ran into a lot of sites. Some are bad but there are some that are very good. The problem is that all the good sites require a lot of time to master the vast amount of information that you need to read and understand in order to be able to use them. Although Joomla is an excellent CMS (as well as WordPress and Drupal) still it takes a lot of knowledge in order to create a template.So far this was done in the following way.
1. You draw on the paper how you want your template to look like.
2. In some program for image manipulation (GIMP, Adobe Photoshop, Adobe Fireworks) you create what you have drawn, taking care to be precise (pixel precision) and that it practically looks exactly like the site you are creating.
3. You use code editor to write basic code - header, with all relevant data that depend on the standards prescribed for the given CMS.
4. You continue to work in code editor (Adobe Dreamviewer, KompoZer) and you begin to make boxes (positions for modules).
5. You continue to use editor and now you are creating a CSS file and with it you are adding the look of the modules.
6. You return to image editor and cut images that you need for the background or as elements to make these module positions more beautiful.
7. You insert all these elements in the CSS file.
8. You write a code in order to add necessary menus.
9. When you are finished with all code elements, you pack all files that you have created in a templateDetails.xml file.
10. All files and folders that you have created you pack in the zip archive which will represent the installation of that template for CMS.
As you can see there is a lot of work. As soon as there are many code lines and a lot of rules that must be respected, the number of places where you can make a mistake is great. Creative Template Designer is a program that will do in a perfect way all these mandatory tasks that otherwise require programming knowledge. On the other hand, this program will help you express the maximum of your creativity because it will do all complicated technical things in the background so you can make the screen look the way you want, using a simple graphical interface. Well, this then creates magic! What you have on the screen is what will be coded and shown in the final template. Creative Template Designer is a program that will serve you as a life-saving shortcut. Gain in time is fantastic. To gain a better insight into what you are reading now, it would be best to look at this video where we have created a template for Joomla in real time. This template is not too complicated, but imagine how much time would it take to make something like this without using Creative Template Designer.

 

How to create template layout

 

layout_orange_240x158

Currently there is no program on the market that can be compared with the CTD. There are several ways how to create a schedule for modul positions in a template:
Text editor, paper and a pencil. Draw on the paper how the template should look like and then calculate the size of certain positions. This way only the simplest templates can be made and only by the people who have been in this business long enough.
- Using different grid systems and frameworks actually means changing some predefined templates. This way it is much easier to make a template but then again you are pretty limited regarding what you can do.
Creating a template in Adobe Photoshop or Fireworks. This is a good way, although there is one flaw. There are times when these programs are not able to create a template without using the tables which is outdated and pretty bad from the perspective of readability of data by the search engines (Google). Of course, the price for FireWorks is not that small ...
- In our opinion the best way to create a template would be to simply draw it and then assign characteristics to these positions. After that only the names for the modular positions should be assigned and you can click on the Save button. Well, this is how it is done if you use Creative Template Designer to create templates for Joomla CMS.

How to convert a image from PSD format to Joomla template?

 

 

This is a very frequently asked question. Of course, without Maestro Creative Template Designer for this you would need a lot of knowledge and time and often during the process some mistakes can occur. I suggest that you take some time and look how easy it is to do it when you have at your disposal such a powerful tool as it is Maestro Creative Template Designer.

How to make a column extend to the size of the content?

 

fauxcolumns 250

Even though with the help of Maestro Creative Template Designer you may draw ie.design template layout features only with the mouse and without any programming, it is also very easy to achieve the effect of extending the columns to match the amount of content. Unlike the manual techniques where in order to create the so-called "faux columns" you need to use different tricks, here this is being achieved wih a single click. In order not only to talk about how easy this is, we have made a video tutorial that shows how it is being done in Maestro Creative Template Designer.

How to make rounded corners?

 

rounded_corners_skeleton_250x152

It is simply unbelievable that this used to be such a problem. Modern browsers have built-in controls for an easier implementation for round edges, but even now it is not standardized. Each browser has its own policy. Even worse situation is if you want your site to have round edges in Internet Explorer 7 and this is a browser that is very present even nowadays. So, what can you do. There are several options:

- Make a template that will only run properly in some browser.

- Spend a lot of time to study, implement and test the code that you have to write manually.

- Use Creative Template Designer that has a built-in option to solve all your problems related to round edges with a single click.

How to create a background?

 

background generator 250

Each website that you can see on the Internet has background. At least half of all websites has a distinctive “pattern” that forms the background. Sometimes the “pattern” is a simple oblique line at an angle of 45 degrees, but sometimes it is a much more complicated picture. Each pattern can be made in one of the programs for image manipulation such as Adobe Photoshop or GIMP. But even simple patterns require solid knowledge of the work, and a little more complex patterns require quite some time to be made. Again, Creative Template Designer is a tool that will do most of the work. With the help of the specialized Background Generator, which is a special module responsible for making background, it will be enough to play around with a few arrows, specify which colors you want to use and how you want background to be oriented and that's it. You have background that can be used as background for the menu, module, or even as the background for the whole pattern. Of course, if all this seems too easy then it's the right time to watch a video that shows Background Generator in action.

How to make a template look the same in all browsers?

 

browsers

The problem of compatibility between browsers has existed since the Internet. There is no way to make a template that looks absolutely the same in all browsers. When we started planning to make Creative Template Designer, we followed the idea to create such a program that will solve these problems systematically. Thanks to the special algorithm that we have developed, Creative Template Designer automatically creates a template that takes care of the traps that lurk in each individual web browser and makes the template look the same in Firefox, Chrome, Explorer...

In order for the template to look good we have given our best to define some modules and enable you to specify their appearance. The modules Search, Contact and Breadcrumbs are the modules that are well defined. With them, independently of other modules you can modify the color, background image, font colors, links and other parameters related to these modules and components.

lista-funkcija-u-tabeli_248