Minimal template - Joomla

There are people, who only wants to have the slider in their website without anything else, so here is a minimal template with only three module positions.

  • Go to your ftp, to the \templates folder and create a new folder, in my example I will create nextend.
  • Put an index.php file in it, which should contain this code:
<?php defined('_JEXEC') or die('Restricted access'); ?>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"
      xml:lang="<?php echo $this->language; ?>" lang="<?php echo $this->language; ?>" >
    <head>
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <jdoc:include type="head" />
    <link href='<?php echo $this->baseurl; ?>/templates/nextend/style.css' rel='stylesheet' type='text/css' />
    </head>
    <body>
    <div id="container">
        <div id="top"><jdoc:include type="modules" name="top" /></div>
        <jdoc:include type="modules" name="slider" />
        <div id="bottom"><jdoc:include type="modules" name="bottom" /></div>
    </div>
    </body>
</html>
  • A templateDetails.xml file with this code:
<?xml version="1.0" encoding="utf-8"?>
<!DOCTYPE install PUBLIC "-//Joomla! 2.5//DTD template 1.0//EN" "http://www.joomla.org/xml/dtd/2.5/template-install.dtd">
<extension version="1" type="template" client="site">
    <name>nextend</name>
    <files>
        <filename>index.php</filename>
        <filename>templateDetails.xml</filename>
        <filename>style.css</filename>
    </files>
    <positions>
        <position>top</position>
        <position>slider</position>
        <position>bottom</position>
    </positions>
</extension>
  • And a style.css file with this code:
html, body{
    margin:0;
    padding:0;
}
#container{
    position:relative;
    width:100%;
    overflow: hidden;
}
#top{
    position:absolute;
    top:0;
    left:0;
    right:0;
    z-index:2;
}
#bottom{
    position:absolute;
    bottom:0;
    left:0;
    right:0;
    z-index:2;
}
  • Now go to your Joomla's backend, Extensions -> Extension Manager -> Discover, and click on Discover. Then you will see the Nextend template on the list, so check it, and click on Install.
  • After this you will see it in your Extensions -> Template Manager.
  • Pick it, and you will have three module positions, the slider, which should have the sliders you want to show. The top, which is just an absolutely positioned place over the slider on the top, and the bottom, which is also an absolutely positioned place, but in the bottom of the slider.