exponential.earth / exponential / documentation / building an ez publish site / the links page / creating the template
These documentation pages are no longer maintained. Please visit the new documentation site.
Make sure that the "Links" link from within the main menu actually works (edit the pagelayout template file and fix it). Now, if you attempt to access the link, you'll probably be presented with a page that looks something like this:
If you have been paying attention during the earlier stages of the tutorial, you should be familiar with the stuff that comes next. What you're looking at is the default/standard full view template. The next natural step is to change this. Use the administration interface to create a template override. If you're still unsure about this procedure, refer to the following hints:
Now that we've created the override, let's start thinking about the template itself. On the left hand side, we could display a list of the sub-folders that are inside the main "Links" folder. When a sub-folder is accessed (the user clicks on it within the browser), eZ publish should list the sub-folder's contents. In this case, the sub-folders contain hyperlinks. Each of these should be presented as a link. When clicked/accessed, the browser should follow the link by opening it in a new window/tab. On the right hand side, we could for example display the name and the description of the folder that was accessed. All this may sound a bit difficult at first. However, it is actually fairly simple. We'll put it together step by step, one piece at a time.
We'll need a bit of CSS, so let's start by adding the following lines to the "tscm.css" file:
.links { font-size: 80%; vertical-align: top; width: 200px; }
Now, edit the template file that was created when you added the template override (should be "design/tscm/override/templates/full_view_links_class.tpl") and put in the following lines:
<div class="pagetitle"> Links </div> <table> <tr> <td class="links"> {* Include the tree menu. *} {include uri="design:links_tree_menu.tpl"} </td> <td valign="top"> {* Display the folder's name. *} <b>{$node.name}</b> <br /> <br /> {* Display the description of the folder. *} {attribute_view_gui attribute=$node.object.data_map.description} </td> </tr> </table>
As you can see, we are splitting the page into two parts (vertical split) using a table. The left portion will be used to display the tree menu, the right portion will be used to display information about the folder that is being accessed. When the "Links" link is accessed (from within the main menu), the right portion will automatically display its name and description (the "Links" folder is simply just another folder from which we can extract the name and the description fields). If you attempt to browse the "Links" page at this point, eZ publish will generate something that looks like this:
Comments