Is it easy to change Joomla template of an existing website? Will the website be offline for a long time during this operation? These questions are often asked in the Joomla world. People not proficient with Joomla usually think that template will be changed with a single click. This is actually true. Your template will be changed in a second, but there's a big chance that your website will be messed up after that.
Is it easy to change Joomla template of an existing website? Will the website be offline for a long time during this operation? These questions are often asked in the Joomla world. People not proficient with Joomla usually think that template will be changed with a single click. This is actually true. Your template will be changed in a second, but there's a big chance that your website will be messed up after that.
What did I do?! You will probably panically switch the template selection back to the original state and release that procedure wouldn't be that easy.
Please remember these facts before you try to change Joomla template on your existing Joomla based website:
1. Your website doesn't have to be offline at all, you can switch template instantly.
2. You have to understand what are the most important elements of any Joomla template:
a) Module positions: Let's analyze a simple example. You have an existing website with an old template with module positions 'user1' (header), 'left' (left column), 'right' (right column) and 'bottom' (footer area). The content area is between 'left' and 'right' module positions. Your are replacing this template with a new template that contains module positions 'top' (header), 'left' (left column), 'right' (right column) and 'footer' (footer area).. In this example, after template switch, you should change module positions of all your 'user3' and 'bottom' modules to 'top' and 'footer'.
b) Menus: Usually, in Joomla we have the top (horizontal) menu with or without drop-down submenu and the vertical menu(usually in the left or in the right column). In our templates, top menu with drop-down submenu is usually in the position 'user3' (anyway, if you are using our template, please check the module positions of this template in the template demo) and settings should be as per Joomla Top Menu Settings. The vertical menus shouldn't have any text in module class suffix field in the menu module parameters. Please check this.
c) Content pages (articles): If your content pages are created per modern web design standards and without tables, template switch will probably be straightforward from this aspect and, most likely, you wouldn't need any edits of your content pages. However, if your website contains content pages with tables or any other elements with fixed width parameter, you would maybe need to edit such pages (enlarge or reduce widths) to fit into the new template. So, it's recommended to select new template with the same width of the main content area as the old template. A good feature of our templates are the flexible widths, so you can set widths of the left and the right columns, content area width and the overall template width (excl. ItStarts template). This is easily done in template parameters.
d) Third-party extensions: There may be some additional things you should edit to make them look properly in the new template. The third-party extensions (components and modules) may need some tweaks. For straightforward sites, template switch is usually easy, but as site is more and more complex (more elements, extensions, module positions, pages…), template switch could be more and more complex. Change of Joomla template is always possible, but for complex sites it may require more time and more Joomla knowledge.
3. If you have a complex website and you want to change its template, this procedure can take some time. In this case, we recommend you to make a mirror of your Joomla site on your local computer and work locally. You will need a web server installed on local computer and copy of your website downloaded and installed locally. Then you can switch template, make all necessary edits and workout everything else locally, while your live site remains untouched. You don't have to hurry, as your live website won't be offline during development, so feel free to take your time. If you don't want to bother with installation of the web server, you can make a copy of your website in a subdirectory of your hosting space and do changes on this copy. When you are done, simply switch the copy and the original.
Once you finished all necessary edits and successfully switched template on the local server or on the website's copy on the server, you can upload changes on your live website. This will take a few minutes in both cases, so your site won't be offline for too much time.
Small thing you can do to make it appear better for mobile browsers is to add this meta tag somewhere inside head..head in index.php of template:
ОтветитьУдалитьmeta name="viewport" content="width=1280"
responsive.js
ОтветитьУдалитьReplace responsive_menu.js with one in attachment.
At bottom of layout.css add flowing code:
UL.bumNav > LI{
display: block;
height: 35px;
width: 50px;
}
UL.bumNav > LI > DIV{
background: url(../images/tinynav.png);
height: 30px;
width: 40px;
}
UL.bumNav > LI UL{
background:white;
padding:15px 10px;
margin:0;
z-index:999999;
border-radius: 15px;
}
UL.bumNav > LI UL LI{
padding:10px 10px;
border-bottom:1px dotted silver;
}