The T3 Blank template already has a great variety of module positions grouped into handy blocks that represent the various areas of the website such as Header, Footer, Navigation, and content area. But what happens if our website requires a unique layout that doesn't fit into T3 Blanks layout? Creating new blocks in our template is a relatively simple process but it does require some modifications to the template code. So fire up your favourite text editor, and let's get our hands a little dirty under the hood of our template.

Handy tip!

It's worth noting that in this tutorial I will be referring to the T3_bs3_blank template that we installed earlier in this course, however these same steps can be applied to any joomla template that is built for the T3 Framework.


{modal images/courses/t3/11-Build-Blocks-in-T3/Template-TPLS-directory.jpg|Title=Template TPLS directory}Template TPLS directory{/modal}

The blocks of our template can be found within the tpls directory of your template. In a text editor open up your layout PHP file. Notice all the loadBlock hooks? These point to the various blocks which are stored in tpls/blocks.

The first thing I like to do is rename all the blocks in this file (after which we will rename all the files of the blocks themselves so that they match). I do this so that I can safely upgade my template anytime and not overwrite any modifications that I have made. So lets go ahead and rename all these loadBlock hooks. I prefer the method of inserting a short prefix before each name. For this example I will use the prefix JT, but you can use whatever you want. Don't forget to also rename the Head block.

{modal images/courses/t3/11-Build-Blocks-in-T3/Renaming-Blocks.jpg|Title=Modifying your T3 layout}Modifying your T3 layout{/modal}


With our template layout now modified we now need to rename all the blocks themselves, so that they match what we have just changed in our layout. Rename all the files within the tpls/blocks directory by inserting the prefix you have chosen.

{modal images/courses/t3/11-Build-Blocks-in-T3/Renaming-Blocks2.jpg|Title=Renaming blocks}Renaming blocks{/modal}


Notice that there is a folder called mainbody. This directory holds variations of the main content block with different configurations of sidebars. Open up this folder and rename all these files as well, placing your prefix infront of the file name.

To ensure that these renamed mainbody configurations can be used, open up the mainbody block of your template (Jt_mainbody in my case), and insert the prefix before all the block names.

{modal images/courses/t3/11-Build-Blocks-in-T3/renaming-the-mainbody-blocks.jpg|Title=Renaming the mainbody blocks}Renaming the mainbody blocks{/modal}


We have now modified the template into a safe upgradeable state, so that all of our blocks (and any modified code we might do within them) will not be over written when a template upgrade is performed.

We can also create some of our own unique blocks, simply adding lines into our layout, and creating the block in the tpls/blocks directory. For instance, I quite often create a new block for a banner which appears at the top of my websites.

{modal images/courses/t3/11-Build-Blocks-in-T3/Creating-a-new-block.jpg|Title=Add a new block to the layout file, and then create a new PHP file within the blocks directory}. Blocks can contain any code and any number of module positions. Creating a new block{/modal}

Handy Tip

Try duplicating an existing block and rename it. Don't forget to modify the code within the block for your own needs otherwise it will duplicate the functionality of it's original block.

The rest of this section goes into more detail in regards to what each "building block" does within the framework and best practises in regards to customising the blocks and your template for your website.