NAVIGATION
in the Conten-Part choose a template
with same name add 1… and 2…. in the same folder on your server
first and default view is a listing:
the template (only the listing part):
File: template/cntpart/sample.tmpl
<!--CATALOG_NO_ENTRY_START//--> <p>No entry found!</p> <!--CATALOG_NO_ENTRY_END//--> <!--######### LISTING ##########//--> <!--CATALOG_LIST_HEAD_START//--> [CP_TITLE]<h3>{CP_TITLE}</h3>[/CP_TITLE] [CP_SUBTITLE]<h4>{CP_SUBTITLE}</h4>[/CP_SUBTITLE] <div class="ctg_menu"> {FILTER_0} </div> <div class="ctg_filter" style="float:right;"> <form method='post' name='ctgfilterform' action='{BACKLINK}' class='ctg_filter_form'> <table width="100%" cellspacing="3" cellpadding="0" border="0"> <tr> <td>{FILTER_1}</td> <td>{FILTER_2}</td> <td><input type="text" name="ctgsearch" value="{SEARCHTEXT}" /></td> <td><input type="image" name="gofilter" src="picture/layout/search.gif" class="filter_button" /></td> <td><a href="{BACKLINK}&ctgtmpl=1" title="Kartenansicht"><img src="picture/layout/map.gif" width="22" height="22" border="0" alt="Kartenansicht" /></a></td> <td><a href="#" title="Listenansicht"><img src="picture/layout/list.gif" width="22" height="22" border="0" alt="Listenansicht" /></a></td> <td><a href="{BACKLINK}&ctgtmpl=2" title="Bilderansicht"><img src="picture/layout/pics.gif" width="22" height="22" border="0" alt="Bilderansicht" /></a></td> <td><a href="{RSS}" title="RSS Feed"><img src="picture/layout/rss.gif" width="22" height="22" border="0" alt="RSS Feed" /></a></td> </tr> </table> </form> </div> <div class="ctg_list_entries"> <!--CATALOG_LIST_HEAD_END//--> <!--CATALOG_LIST_SPACER_START//--> <!--CATALOG_LIST_SPACER_END//--> <!--CATALOG_LIST_ENTRY_START//--> <div class="ctg_list_entry" id="ctg-listitem-{CATALOG_ID}"> <a href="{CATALOG_LINK}"> [IMAGE]{IMAGE}[/IMAGE] [TITLE]<span class="ctg_list_title">{TITLE}</span>[/TITLE] <span class="ctg_list_text">{TEXT}</span> </a> </div> <!--CATALOG_LIST_ENTRY_END//--> <!--CATALOG_LIST_FOOTER_START//--> </div> <div style="clear:both;"></div> <!--CATALOG_LIST_FOOTER_END//--> <!--######### DETAIL ENTRY ##########//--> <!--CATALOG_DETAIL_HEAD_START//--> [CP_TITLE]<h4>{CP_TITLE}</h4>[/CP_TITLE] [CP_SUBTITLE]<h4>{CP_SUBTITLE}</h4>[/CP_SUBTITLE] <!--CATALOG_DETAIL_HEAD_END//--> <!--CATALOG_DETAIL_IMAGE_START//--> [IMAGE]<div class="ctg_detail_image"> {IMAGE}<br/> <!-- {IMAGE_DESC} --></div>[/IMAGE] <!--CATALOG_DETAIL_IMAGE_END//--> <!--CATALOG_DETAIL_ENTRY_START//--> <div class="ctg_detail_entry" id="ctg-entry-{CATALOG_ID}"> <div style="width:100px;float:left;"> <table width="100%" cellspacing="3" cellpadding="0" border="0"> <tr> <td><a href="{BACKLINK}" title="zurück"><img src="picture/layout/back.gif" width="22" height="22" border="0" alt="" /></a></td> <td>[PRINT]<img src="picture/layout/print.gif" width="22" height="22" border="0" alt="" />[/PRINT]</td> </tr> </table> <!--NO_PRINT_START//--><!--NO_PRINT_END//--> </div> [MAP]<div class="ctg_detail_map">{MAP}</div>[/MAP] [IMAGES]<div class="ctg_detail_images">{IMAGES}</div>[/IMAGES] <div class="ctg_detail_content"> [TITLE]<h2>{TITLE}</h2>[/TITLE] [TITLE2]<p class="ctg_detail_entry_title2">{TITLE2}</p>[/TITLE2] <p>{ADDRESS}<br /> {ZIP} {CITY}<br /> </p> [TEXT]{TEXT}[/TEXT] [TEXT2]{TEXT2}[/TEXT2] [FILE_NAME] Dateibeschreibung:{FILE_DESC}<br /> Download: <img src="img/icons/small_icon_{FILE_EXT}.gif" alt="" /><a href="{FILE_URL}" target="_blank" title="Diese Datei herunterladen">{FILE_NAME}</a><br /> [/FILE_NAME] </div> </div> <!--CATALOG_DETAIL_ENTRY_END//--> <!--CATALOG_DETAIL_FOOTER_START//--> <div style="clear:both;"></div> <!--CATALOG_DETAIL_FOOTER_END//-->
in the example we'll have an issue with invalid html in the entries, (h4 and p within a) but that's another story
second view is the global map:
File: template/cntpart/1sample.tmpl
<!--CATALOG_NO_ENTRY_START//--> <p>No entry found!</p> <!--CATALOG_NO_ENTRY_END//--> <!--######### LISTING ##########//--> <!--CATALOG_LIST_HEAD_START//--> [CP_TITLE]<h3>{CP_TITLE}</h3>[/CP_TITLE] [CP_SUBTITLE]<h4>{CP_SUBTITLE}</h4>[/CP_SUBTITLE] <div class="ctg_menu"> {FILTER_0} </div> <div class="ctg_filter" style="float:right;"> <form method='post' name='catalogfilterform' action='{BACKLINK}' class='ctg_filter_form'> <table width="100%" cellspacing="3" cellpadding="0" border="0"> <tr> <td>{FILTER_1}</td> <td>{FILTER_2}</td> <td><input type="text" name="ctgsearch" value="{SEARCHTEXT}" /></td> <td><input type="image" name="gofilter" src="picture/layout/search.gif" class="filter_button" /></td> <td><a href="#" title="Kartenansicht"><img src="picture/layout/map.gif" width="22" height="22" border="0" alt="Kartenansicht" /></a></td> <td><a href="{BACKLINK}&ctgtmpl=0" title="Listenansicht"><img src="picture/layout/list.gif" width="22" height="22" border="0" alt="Listenansicht" /></a></td> <td><a href="{BACKLINK}&ctgtmpl=2" title="Bilderansicht"><img src="picture/layout/pics.gif" width="22" height="22" border="0" alt="Bilderansicht" /></a></td> <td><a href="{RSS}" title="RSS Feed"><img src="picture/layout/rss.gif" width="22" height="22" border="0" alt="RSS Feed" /></a></td> </tr> </table> </form> </div> [MAP]<div class="ctg_global_map">{MAP}</div>[/MAP] <div class="ctg_list_entries"> <!--CATALOG_LIST_HEAD_END//--> <!--CATALOG_LIST_SPACER_START//--> <!--CATALOG_LIST_SPACER_END//--> <!--CATALOG_LIST_ENTRY_START//--> <!--CATALOG_LIST_ENTRY_END//--> <!--CATALOG_LIST_FOOTER_START//--> </div> <div style="clear:both;"></div> <!--CATALOG_LIST_FOOTER_END//--> <!--######### DETAIL ENTRY ##########//--> <!--CATALOG_DETAIL_HEAD_START//--> [CP_TITLE]<h4>{CP_TITLE}</h4>[/CP_TITLE] [CP_SUBTITLE]<h4>{CP_SUBTITLE}</h4>[/CP_SUBTITLE] <!--CATALOG_DETAIL_HEAD_END//--> <!--CATALOG_DETAIL_IMAGE_START//--> [IMAGE]<div class="ctg_detail_image"> {IMAGE}<br/> <!-- {IMAGE_DESC} --></div>[/IMAGE] <!--CATALOG_DETAIL_IMAGE_END//--> <!--CATALOG_DETAIL_ENTRY_START//--> <div class="ctg_detail_entry" id="ctg-entry-{CATALOG_ID}"> <div style="width:100px;float:left;"> <table width="100%" cellspacing="3" cellpadding="0" border="0"> <tr> <td><a href="{BACKLINK}" title="zurück"><img src="picture/layout/back.gif" width="22" height="22" border="0" alt="" /></a></td> <td>[PRINT]<img src="picture/layout/print.gif" width="22" height="22" border="0" alt="" />[/PRINT]</td> </tr> </table> <!--NO_PRINT_START//--><!--NO_PRINT_END//--> </div> [MAP]<div class="ctg_detail_map">{MAP}</div>[/MAP] [IMAGES]<div class="ctg_detail_images">{IMAGES}</div>[/IMAGES] <div class="ctg_detail_content"> [TITLE]<h2>{TITLE}</h2>[/TITLE] [TITLE2]<p class="ctg_detail_entry_title2">{TITLE2}</p>[/TITLE2] <p>{ADDRESS}<br /> {ZIP} {CITY}<br /> </p> [TEXT]{TEXT}[/TEXT] [TEXT2]{TEXT2}[/TEXT2] [FILE_NAME] Dateibeschreibung:{FILE_DESC}<br /> Download: <img src="img/icons/small_icon_{FILE_EXT}.gif" alt="" /><a href="{FILE_URL}" target="_blank" title="Diese Datei herunterladen">{FILE_NAME}</a><br /> [/FILE_NAME] </div> </div> <!--CATALOG_DETAIL_ENTRY_END//--> <!--CATALOG_DETAIL_FOOTER_START//--> <div style="clear:both;"></div> <!--CATALOG_DETAIL_FOOTER_END//-->
make sure to check the 'use googlemaps' checkbox in the Content-Part otherwise nothing appears here (in the default template the map will not render because the [MAP][/MAP] RT is missing)
third view is a listing only with images:
here wee need different image size settings than defined in the Content-Part, therefore we add a settings part at the top of the template file
this settings part is only considered by the script in the 2… templates
File: template/cntpart/2sample.tmpl
<!--TMPL_SETTINGS_START//--> ; overwrite image width for listing only for this template ctg_imgwidth = 168 ; overwrite image height for listing only for this template ctg_imgheight = 168 ; crop listing images? 0/1 ctg_imgcrop = 1 ; crop listing images? 0/1 ctg_imgrand = 1 ; global map? 0/1 ctg_usegooglemaps = 0 <!--TMPL_SETTINGS_END//--> <!--CATALOG_NO_ENTRY_START//--> <p>No entry found!</p> <!--CATALOG_NO_ENTRY_END//--> <!--######### LISTING ##########//--> <!--CATALOG_LIST_HEAD_START//--> [MAP]<div class="ctg_global_map">{MAP}</div>[/MAP] [CP_TITLE]<h3>{CP_TITLE}</h3>[/CP_TITLE] [CP_SUBTITLE]<h4>{CP_SUBTITLE}</h4>[/CP_SUBTITLE] <div class="ctg_menu"> {FILTER_0} </div> <div class="ctg_filter" style="float:right;"> <form method='post' name='catalogfilterform' action='{BACKLINK}' class='ctg_filter_form'> <table width="100%" cellspacing="3" cellpadding="0" border="0"> <tr> <td>{FILTER_1}</td> <td>{FILTER_2}</td> <td><input type="text" name="ctgsearch" value="{SEARCHTEXT}" /></td> <td><input type="image" name="gofilter" src="picture/layout/search.gif" class="filter_button" /></td> <td><a href="{BACKLINK}&ctgtmpl=1" title="Kartenansicht"><img src="picture/layout/map.gif" width="22" height="22" border="0" alt="Kartenansicht" /></a></td> <td><a href="{BACKLINK}&ctgtmpl=0" title="Listenansicht"><img src="picture/layout/list.gif" width="22" height="22" border="0" alt="Listenansicht" /></a></td> <td><a href="#" title="Bilderansicht"><img src="picture/layout/pics.gif" width="22" height="22" border="0" alt="Bilderansicht" /></a></td> <td><a href="{RSS}" title="RSS Feed"><img src="picture/layout/rss.gif" width="22" height="22" border="0" alt="RSS Feed" /></a></td> </tr> </table> </form> </div> <div class="ctg_list_entries"> <!--CATALOG_LIST_HEAD_END//--> <!--CATALOG_LIST_SPACER_START//--> <!--CATALOG_LIST_SPACER_END//--> <!--CATALOG_LIST_ENTRY_START//--> <div class="ctg_list_entry_pic" id="ctg-listitem-{CATALOG_ID}"> <a href="{CATALOG_LINK}" title="{TITLE}"> [IMAGE]{IMAGE}[/IMAGE] [TITLE]<span class="ctg_list_title">{TITLE}</span>[/TITLE] </a> </div> <!--CATALOG_LIST_ENTRY_END//--> <!--CATALOG_LIST_FOOTER_START//--> </div> <div style="clear:both;"></div> <!--CATALOG_LIST_FOOTER_END//--> <!--######### DETAIL ENTRY ##########//--> <!--CATALOG_DETAIL_HEAD_START//--> [CP_TITLE]<h4>{CP_TITLE}</h4>[/CP_TITLE] [CP_SUBTITLE]<h4>{CP_SUBTITLE}</h4>[/CP_SUBTITLE] <!--CATALOG_DETAIL_HEAD_END//--> <!--CATALOG_DETAIL_IMAGE_START//--> [IMAGE]<div class="ctg_detail_image"> {IMAGE}<br/> <!-- {IMAGE_DESC} --></div>[/IMAGE] <!--CATALOG_DETAIL_IMAGE_END//--> <!--CATALOG_DETAIL_ENTRY_START//--> <div class="ctg_detail_entry" id="ctg-entry-{CATALOG_ID}"> <div style="width:100px;float:left;"> <table width="100%" cellspacing="3" cellpadding="0" border="0"> <tr> <td><a href="{BACKLINK}" title="zurück"><img src="picture/layout/back.gif" width="22" height="22" border="0" alt="" /></a></td> <td>[PRINT]<img src="picture/layout/print.gif" width="22" height="22" border="0" alt="" />[/PRINT]</td> </tr> </table> <!--NO_PRINT_START//--><!--NO_PRINT_END//--> </div> [MAP]<div class="ctg_detail_map">{MAP}</div>[/MAP] [IMAGES]<div class="ctg_detail_images">{IMAGES}</div>[/IMAGES] <div class="ctg_detail_content"> [TITLE]<h2>{TITLE}</h2>[/TITLE] [TITLE2]<p class="ctg_detail_entry_title2">{TITLE2}</p>[/TITLE2] <p>{ADDRESS}<br /> {ZIP} {CITY}<br /> </p> [TEXT]{TEXT}[/TEXT] [TEXT2]{TEXT2}[/TEXT2] [FILE_NAME] Dateibeschreibung:{FILE_DESC}<br /> Download: <img src="img/icons/small_icon_{FILE_EXT}.gif" alt="" /><a href="{FILE_URL}" target="_blank" title="Diese Datei herunterladen">{FILE_NAME}</a><br /> [/FILE_NAME] </div> </div> <!--CATALOG_DETAIL_ENTRY_END//--> <!--CATALOG_DETAIL_FOOTER_START//--> <div style="clear:both;"></div> <!--CATALOG_DETAIL_FOOTER_END//-->
entries without images display only the title instead (in those with images the title is just not visible but also there)
Three different views of the same Content-Part but:
* same filters/menu