There’s a couple ways to reference the Joomla template positions by viewing them layered on the template design. However its easier to view the Joomla template positions while setting up the website and assigning modules to the positions.

Method 1

add ?tp=1 to the url.

eg: http://www.joomla.org/?tp=1

This opens the preview in one browser tab while the regular view is in the other tab.

Method 2

In the Joomla Administrator go to:

Extensions > Template Manager

Now click on the template name. This opens the Template [edit] page.

Click on the “Preview” button present in the top right.

Note: In some cases this preview will “break” the template design. Don’t worry, this only happens because of the added divs showing the template positions.