< back to Template Programming

Directory Module

Reference for article module: components, data types, fields and sample code.

Last updated on 1/24/2014

Directory Module Fields

The directory module provides the following components for displaying directory members, deals, levels and locations; and for searching deals and members. 

Component List

Component Data
DealBrowser Deal
DealEditBox Deal
DealSearchBox Deal
DealSearchResult Deal
DealViewer Deal
InfoBox n/a
LevelBrowser Level
LevelViewer Level
LocationBrowser Location
RelatedBrowser Member
SearchBox n/a

SearchResult

Member
SubmitBox Member
Viewer Member

 

Common Fields for ItemView tab

The following fields can be used in the ItemView tab of the template html dialog editor. If the data displayed (Deal, Level, Location or Member) has the CMS field indicated, then the code will be available to use by the Component.

 

Field Name (Template) CMS Field Type Comments Options
post-link * computed text URL of Directory Member  
member-link * computed text URL of Directory Member  
deal-link * computed text URL of Deal  
website-redirect * computed text URL of Directory Website containing Directory Analytics code to allow website click through tracking.   
error-message * computed text Error message to display for input "Box" components on error  
info-message * computed text Info message to display for input "Box" components on success  
 address-google,
location-address-google,
business-address-google
Directory->Address text Uses Lat & Lon when indicated, otherwise, computes an address off the address fields.  
date-created Date Created text   dateFormat
Ex: @date-created|dateFormat=n/d/Y@
date-updated Date Updated text   dateFormat
Ex: @date-created|dateFormat=n/d/Y@
category-title Category->Headline text Current category title captured from a search query  
category-name Category->Name text Current category name captured from a search query  
region-title Region->Headline text Current region name captured from a search query  
region-name Region->Name   Current region name captured from a search query  
category-list * computed text HTML list of all categories generated with the following structure:
<span class="ui-directory-category-list">
  <span class="ui-directory-category-list-item" refId="Category ID" refName="Category Name"> Category Title</span>
  [..]
</span>
 
region-list * computed text HTML list of all regions generated with the following structure:
<span class="ui-directory-region-list">
  <span class="ui-directory-region-list-item" refId="Region ID" refName="Region Name"> Region Title</span>
  [..]
</span>
 
excerpt Large Desc, Small Desc & Body text Large desc and small desc for a Member, Body for a Deal.  
small-desc Directory->Small Desc text    
large-desc Directory->Large Desc text    
body Deal-.Body text    
photo Photos text HTML,
first photo to display
fitbox, cropto. Ex:
@category-slideshow|fitbox=100x60@
@category-slideshow |cropto=100x60@
@photo|cropto=100x60@
@photo|index=2@
photo-lead Photos text HTML IMG tag,
first photo to display.  Ex: <img class="ui-photo? src="/pub/photo/thumb/my-photo-fitbox-500x200.jpg"/>
fitbox, cropto. Ex:
@photo-lead|fitbox=100x60@
@photo-lead|cropto=100x60@
photo-position Photo Position text top/bottom/left/right  
photo-list Photos text HTML, < UL >list of photos. Usable for javascript fitbox, cropto. Ex: @photo-list|fitbox=900x600@
video Photos text HTML, first video to display fitbox, cropto. Ex: @video-list|fitbox=900x600@
slideshow Photos text HTML, automated slideshow of videos and photos fitbox, cropto. Ex: @slideshow|fitbox=900x600@

 

Common Fields for Before & After tabs

The following fields can be used in Before and After tabs of the template html dialog editor. If the data displayed (Deal, Level, Location or Member) has the CMS field indicated, then the code will be available to use by the Component.

Field Name (Template) CMS Field Type Comments Options
search-keyword * computed text keyword that was searched  
search-radius * computed int radius that was search  
search-level * computed int business level to search  
search-hourly * computed int indicates whether hourly deals are seached  
search-lat * computed int Lattitude searched (in connection with radius)  
search-lon * computed int Longitude searched (in connection with radius)  
search-count * computed int Number of search results.  
is-default-page * computed 0/1 indicates whether the results are displayed when landing on the page (1)
or whether the results displayed are from a search (0)
 
category-path * computed text Contains the category crumbs of the current searched item  
region-path * computed text Contains the region crumbs of the current searched item  
error-message * computed text Error message to display for input "Box" components on error  
info-message * computed text Info message to display for input "Box" components on success  
category-title Category->Headline text Current category title captured from a search query  
category-name Category->Name text Current category name captured from a search query  
region-title Region->Headline text Current region name captured from a search query  
region-name Region->Name   Current region name captured from a search query  

Article Specific Fields

These fields can be used by any component that displays an article. 

Template Field CMS Field Type Comments Options
id id int    
is-featured Featured int 0/1  
date-created Date Created date   dateFormat
Ex: @date-created|dateFormat=n/d/Y@
date-updated Date Updated date   dateFormat
Ex: @date-updated|dateFormat=n/d/Y@
date-published Date Published date   dateFormat
Ex: @date-published|dateFormat=n/d/Y@
date-hide Hide Date int    
kicker Kicker text    
title Headline text    
hide-title Hide Headline int 0/1  
date-hide Hide Date int    
kicker Kicker text    
title Headline text    
hide-title Hide Headline int 0/1  
summary Summary text HTML  
body Body text HTML  
tags Option->Tags      
date-begin First Day date   dateFormat
Ex: @date-begin|dateFormat=n/d/Y@
date-end Last Day date   dateFormat
Ex: @date-end|dateFormat=n/d/Y@
count-view View Count int    
count-email Email Count int    
count-comment * computed int    
photo-gallery
is-gallery 
* computed int 0/1  
photo-position Photo Position text top/bottom/left/right  
page-dest Open in Page text    
page-dest-params With Params text    
         
location-display-by Display By text    
location-address Address text    
location-latitude Latitude decimal    
location-lat Latitude decimal    
location-longitude Longitude decimal    
location-lon Longitude decimal    
location-map Map text HTML  
location-link-list URL text HTML  
location-distance * computed decimal    
         
map-title Title text    
map-mpath Mpath text    
map-color Color text    
map-url URL text    
         
fact-show Quick Facts->Show int 0/1  
fact-title Title text    
fact-what What text HTML  
fact-where Where text HTML  
fact-when When text HTML  
fact-cost Cost text HTML  
fact-details Details text HTML  
fact-more More text HTML  
         
opt-script1 Script 1 text HTML  
opt-script2 Script 2 text HTML  
opt-script3 Script 3 text HTML  
opt-raw1 Raw Script 1 text User defined  
opt-raw2 Raw Script 2 text User defined  
opt-raw3 Raw Script 3 text User defined  
opt-raw4 Raw Script 4 text User defined  
opt-raw5 Raw Script 5 text User defined  
opt-raw6 Raw Script 6 text User defined  
opt-tag1 Tag 1 text User defined  
opt-tag2 Tag 2 text User defined  
opt-tag3 Tag 3 text User defined  
opt-tag4 Tag 4 text User defined  
opt-tag5 Tag 5 text User defined  
opt-tag6 Tag 6 text User defined  

Category Specific Fields

The following fields are specific only to a Category item.

Field Name (Template) CMS Field Type Comments Options
id ID int    
name Name text    
title Headline text    
kicker Kicker text    
summary Summary text HTML  
photo-position Photo Position text top/bottom/left/right  
page-section Open in Section text URL to RSS feed for this category  
page-section-params Section Params text HTML, first photo to display  
section-link * computed text URL to the section page where
this category will be displayed
category-link * computed text URL to this category landing page  
slideshow Photos text   fitbox, cropto. Ex:
@slideshow|fitbox=100x60@
@slideshow|cropto=100x60@
rss-link * computed text URL to the RSS Feed for this category articles.

Deal Specific Fields

The following are the fields specific to a Deal.

Field Name (Template) CMS Field Type Comments
id ID int  
date-start Date Start text dateFormat
Ex: @date-created|dateFormat=n/d/Y@
date-end Date End text dateFormat
Ex: @date-created|dateFormat=n/d/Y@
time-start-text Time Start text  
time-end-text Time End text  
can-edit * computed 0/1 indicates whether the member owning this deal is logged in and can edit this deal listing
has-expiration Has Expiration 0/1 in connection with date start and date end above.
is-expired * computed 0/1 indicates whether the deal has expired
is-free Free 0/1  
is-hourly Hourly 0/1 in connection with time start and time end above
youtube Youtube text Youtube video associated with the deal
display-name Display Name text  
title Title text  
website Website text  
body Body text  
tags Tags text  
voucher-body Voucher -> Body text  
voucher-exp-date Voucher -> Expiration Date text dateFormat
Ex: @date-created|dateFormat=n/d/Y@
voucher-view-count Voucher -> View Count int  
       
Mapped from business directory      
location,
business-location
Directory->Location text  
location-lat,
business-location-lat
Directory->Location Lat text  
location-lon,
business-location-lon
Directory->Location Lon text  
business-name Directory->Business Name text  
business-rating Directory->Business Rating text  
business-phone Directory->Business Phone text  
business-youtube Directory->Business Youtube text  
business-email Directory->Business Email text  
business-level Directory->Business Level int  
business-website Directory->Business Website text  
business-address-1 Directory->Business Address text  
business-address-2 Directory->Business Address2 text  
business-address-city Directory->Business Address City text  
business-address-state Directory->Business Address State text  
business-address-zip Directory->Business Address Zip text  
business-address-google Directory->Business Address Google text  
business-address-map-zoom Directory->Business Map Zoom int overrides the defaults 15 zoom, in case of large industrial complexes where a larger zoom out is required.

Comment Specific Fields

The following are available for an item of type Comment.

Field Name (Template) CMS Field Type Comments
id ID int  
author-name Member Display Name, or submitter name text Not related to Article->Author
author-email Member Email Address or submitter email address text Not related to Article->Author
author-website Member Email Address or submitter email address text Not related to Article->Author
comment Comment text limited HTML
date-created Date Created text date comment posted
date-updated Date Updated text date comment was updated

Article Search Box Specific Fields

The Article Search Box contains fields that catch user input. They are defined as follows:

Field Name (Template) Comments
input input textbox for search term
input-zip input textbox for supplying a zip code => will instruct the search results to sort by location
input-date-from input textbox for supplying a filtering date range
input-date-to input textbox for supplying a filtering date range
input-category input dropdown for supplying a filtering categor

Article Comment Box Specific Fields

The following fields are available only for Comment Box components:

Field Name (Template) Comments
input input textbox for search term
input-sort-by input dropdown for supplying result sorting preference
input-date-from input textbox for supplying a filtering date range
input-date-to input textbox for supplying a filtering date range
input-category input dropdown list for supplying a filtering category

Article Date Browser Specific Fields

The following fields are available only for the ArticleDateBrowser component, which lists a number of articles posted by year and creates hyperlinks to the Article Search Result component filtering for the specific date range (usually a whole year).

Field Name (Template) CMS Field Type Comments
total * computed int Total number of articles in this range
date-year Article->Date Published int year component of the date range
date Article->Date Published text first date of the date range
year link * computed text URL to search results for all articles published during the year range

Article Submit Box Specific Fields

The following fields are available for the Article Submit Box component, which allows visitors to submit articles to the website. Uses cases are forums, ticketing systems, are news report submissions.

Field Name (Template) Data Comments
input-subject HTML input textbox for supplying the Article->Headline
input-author-name HTML input textbox for supplying the Article->Submitter Name
input-author-email HTML input textbox for supplying the Article->Submitter Email
input-author-website HTML input textbox for supplying the Article->Submitter Website
input-category HTML input dropdown for supplying the Article->Category in which to file this article
captcha-input HTML input textbox for displaying the captcha text
captcha-pic HTML captcha image
captcha-enabled 0/1 indicates whether to enable captcha.
member-only 0/1 indicates whether the commenting is for member only. The template should check this value and disable the input fields
is-logged-in 0/1 indicates whether the user is logged in as a Member
message text When non empty, this is the error message describing why the article could not be posted.

Article Comment Submit Box Fields

The following fields are available for the Article Comment Submit Box component, which allows visitors to post comments on articles.

Field Name (Template) Data Comments
input-comment HTML input textbox for supplying the Comment->Body
input-comment-size HTML numerical value used to control how many characters to limit the body input by
input-author-name HTML input textbox for supplying the Comment->Name (submitter name)
input-author-website HTML input textbox for supplying the Comment->Email (submitter email)
input-author-email HTML input textbox for supplying the Comment->Website (submitter website)
captcha-input HTML input textbox for displaying the captcha text
captcha-pic HTML captcha image
captcha-enabled HTML indicates whether to enable captcha.
can-comment 0/1 indicates whether the visitor can comment. The template should check this value and disable input fields
member-only 0/1 indicates whether the commenting is for member only. The template should check this value and disable the input fields
is-logged-in 0/1 indicates whether the user is logged in as a Member
message text When non empty, this is the error message describing why the comment could not be posted.

Sample Code

The following section shows common sample code for each component type.

ArchiveSearchBox

<h1>Archive Search</h1>
<p>
 <b>Keywords:</b>
 <br/>
 <small>
   @input@
 </small>
</p>
<p>
 <b>Date Published:</b>
 <br/>
 <small>
   From @input-date-from@ to @input-date-to@
 </small>
</p>
<p>
 <b>Optional Category Search:</b>
 <br/>
 <small>
  @input-category@
 </small>
</p>
<p>
 <b>Sort results by </b> @input-sort-by@
</p>
<p>
 <button type="submit">Search Archive</button>
</p>
<script>
  $(function(){
	$(".date-input").datepicker({dateFormat: 'm/d/yy'});
  });
</script>

ArchiveSearchResult

Before tab:

<h1>Archive Search Results</h1>
<if>
  <test>@error-message@!=</test>
  <p class="error-box">@error-message@</p>
</if>
<p>Your search returned the following @search-count@ result(s):</p>

Item View tab:

<h2>
  <a href="@post-link@">@title@</a>
</h2>
<p class="date">
  @date-published@
  <if>
	<test>@category@!=</test>
	| @category@
  </if>
</p>
<p>@excerpt@</p>
<p>
  <a href="@post-link@" >View Article...</a>
</p>
<div style="clear: both;"></div>

ArchiveViewer

<h2>
  <a href="@post-link@">@title@</a>
</h2>
<p class="date">
  @date-published@
  <if>
	<test>@category@!=</test>
	| @category@
  </if>
</p>
<p>@excerpt@</p>
<p>
  <a href="@post-link@" >View Article...</a>
</p>
<div style="clear: both;"></div>

AuthorBrowser

<if>
  <test>@photo@!=</test>
  <div style="float: left; margin-right: 5px; margin-bottom: 5px;">
	@photo@
  </div>
</if>
<h2>
  <a href="@auhor-link@">@title@</a>
</h2>
@summary@

AuthorPostBrowser

<h3>
  <a href="@post-link@">@title@</a>
</h3>
<a style="float: right; margin-left: 10px;" href="@post-link@">@photo@</a>
<p>@summary@</p>
<p>
  <a href="@post-link@">Read more...</a>
</p>
<p style="clear: both;"/>

AuthorViewer

<h2>
  @title@
</h2>
<if>
  <test>@photo@!=</test>
  <div style="float: left;margin-right: 15px; margin-bottom:15px;">
	<a href="@post-link@">@photo@</a>
  </div>
</if>
@summary@
<div style="clear: both;"></div>

CategoryBrowser

<h3><a href="@category-link@">@title@</a></h3>
@summary@
<p>
  <a href="@category-link@">view articles...</a>
</p>

CategoryPostBrowser

<h3>
	<a href="@post-link@">@title@</a>
</h3>
<a style="float: right; margin-left: 10px;" href="@post-link@">@photo@</a>
@summary@
<p>
	<a href="@post-link@">Read more...</a>
</p>
<div style="clear: both;"></div>

CategoryViewer

<h1>@title@</h1>
<p>Subscribe to RSS feed: <a href="@rss-link@"><img src="admin/img/rss3.gif"/></a></p>
@summary@
@slideshow@

CommentBox

<script type="text/javascript">
$(function(){
  $("#input-comment").keyup(function(){
  var iCommentSize = @input-comment-size@;
  var len = $(this).val().length;
  var remaining = iCommentSize - len;
  if ( remaining < 0) {
		$("#input-comment-size").html(remaining+" characters remaining");
		$("#input-comment-size").css("color","red");
		$("#input-comment-submit").attr("disabled",true);
	  } else {
		$("#input-comment-size").html(remaining+" characters remaining");
		$("#input-comment-size").css("color","inherit");
		$("#input-comment-submit").removeAttr("disabled");
	  }
	});
});
</script>
<div class="ruler"></div>
<if>
<test>@can-comment@==1</test>
<script type="text/javascript">
  // hide the "please login" text.
  $(function(){
	if ($("h1.article").length > 0) {
	  $("#register-signup").css("display","none");  // article is present, display the comment text
	}
  });
</script>
<h2>Share your thoughts, post a comment to this story:</h2>
<if2>
  <test2>@is-logged-in@==1</test2>
  <test2>@member-only@==1</test2>
  <p>
	From:<br/>@input-author-name@
  </p>
  <else2></else2>
  <p>
	Your Name:<br/>@input-author-name@
  </p>
  <p>
	Your Email Address:<br/>@input-author-email@
  </p>
  <p>
	Your Website:<br/>@input-author-website@
  </p>
</if2>
<p>
  Comment:<br/>
  @input-comment@ <br/>
  <span id="input-comment-size">@input-comment-size@ characters remaining</span>
</p>
<if2>
  <test2>@captcha-enabled@!=0</test2>
  <p>
	Captcha:<br/>
	@captcha-pic@<br/>@captcha-input@
  </p>
</if2>
<p>
  <input style="padding:0 5px;" id="input-comment-submit" type="submit" value="Post Comment"/>
</p>
</if>
<div class="error-box">@message@</div>

CommentBrowser

<if>
 <test>@item-no@>1</test>
 <div class="ruler"></div>
</if>
<div>
<div class="date">@date-created@</div>
<div style="">
  <span style="font-weight: bold; font-size: 14px;">
	@author-name@
  </span>
  said:
</div>
<div style="clear: both;"></div>
</div>
<div class="inner">@comment@</div>

DateBrowser

<p>
	<a href="@post-link@">@date-year@ (@total@)</a>
</p>

DirectoryViewer

<h1>@title@</h1>

<if>
 <test>@photo@!=</test>
 <div style="float: right; margin-left: 10px; margin-bottom: 10px; max-width: 350px; margin-bottom: 10px;">
   @slideshow@
 </div>
</if>

@body@

<if>
  <operator>or</operator>
  <test>@facebook@!=</test>
  <test>@twitter@!=</test>
  <h3>Social Media</h3>
</if>
<if>
  <test>@facebook@!=</test>
  <p><a href="@facebook@" title="Facebook Page" target="_blank">Facebook</a></p>
</if>
<if>
  <test>@twitter@!=</test>
  <p><a href="@twitter@" title="Twitter Account" target="_blank">Twitter</a></p>
</if>

MostCommentedBrowser

<p>
	<a href="@post-link@">@title@</a> (@count-comment@)
</p>

MostViewedBrowser

<p>
	<a href="@post-link@">@title@</a> (@count-comment@)
</p>

PostViewer

<h1>@title@</h1>

<if>
  <test>@date-hide@!=1</test>
  <p class="date">@date-published@</p>
</if>

<if>
 <test>@author-by-line@!=</test>
 <test>@author-email@!=</test>
  <p class="byline">
   <a href="mailto:@author-email@">
	 @author-by-line@ 
   </a>
  </p>
 <else></else>
</if>
<if>
 <test>@author-by-line@!=</test>
 <test>@author-email@==</test>
  <p class="byline">
    @author-by-line@
  </p>
</if>

<if>
 <test>@photo@!=</test>
 <div style="float: right; margin-left: 10px; margin-bottom: 10px; max-width: 350px; margin-bottom: 10px;">
   @slideshow@
 </div>
</if>

@body@

RelatedBrowser

<p>
	<a href="@post-link@">@title@</a>
</p>

SearchBox

Simple:

@input@
<input type="submit" value="Search"/>

Complex:

<h1>Advanced Article Search</h1>
<p>Our advanced search feature allows you to search our website using a combination of phrases or words, 
date ranges and within a selected category of your choice.</p>

<table>
  <tr>
	<td>Search For:</td>
	<td>@input@</td>
  </tr>
  <tr>
	<td>Published Between:</td>
	<td>@input-date-from@ To @input-date-to@</td>
  </tr>
  <tr>
	<td>Category:</td>
	<td>@input-category@</td>
  </tr>
  <tr>
	<td></td>
	<td>
	  <input type="submit" style="padding: 1px 10px;" value="Search"/>
	</td>
  </tr>

</table>
<br/>
<script type="text/javascript">
  $(function(){
	$( "#input-date-from" ).datepicker({ defaultDate: -30 });;
	$( "#input-date-to" ).datepicker();
  });
</script>

SearchResult

Before:

<h1>Search Results</h1>
<if>
  <test>
	@search-count@<=0
  </test>
  <p>Your search for '@search-keyword@' returned nothing.</p>
</if>
<if>
  <test>@search-count@==1</test>
  <p>Your search for '@search-keyword@' returned 1 result:</p>
</if>
<if>
  <test>@search-count@>1</test>
  <p>Your search for '@search-keyword@' returned @search-count@ results:</p>
</if>

ItemView:

<div class="ruler"></div>
<if>
  <test>@photo@!=</test>
  <div style="float: right; margin-left: 20px; margin-bottom: 10px;" class="photo">
    <a href="@post-link@">@photo|fitbox=200x200@</a>
  </div>
</if>
<h2>
  <a href="@post-link@">@title@</a>
</h2>
<if>
  <test>@date-hide@!=1</test>
  <p class="date">@date-published@</p>
</if>
<p>@excerpt@</p>
<p class="readmore">
  <a href="@post-link@">read more</a>
</p>
<div style="clear: both;"></div>

SubmitBox

<h2>Create a new Post:</h2>
<if>
  <test>@message@!=</test>
  <div class="error-box">
    @message@
  </div>
</if>

<p>
  Name:<br/>
  @input-author-name@
</p>
<p>
  Email:<br/>
  @input-author-email@
</p>
<p>
  Website:<br/>
  @input-author-website@
</p>
<p>
  Category:<br/>
  <select id="select-category">
    <option value="forum">Forum</option>
  </select>
  <div style="display: none;">
    @input-category@
  </div>
  <script type="text/javascript">
    $(function(){
    $("#select-category").change(function(){
      var value = $(this).val();
      $("#input-category").val(value);
    });
    $("#input-category").val('forum'); // initial value
    });
  </script>
</p>
<p>
  Subject:<br/>
  @input-subject@
</p>
<p>
  Post:<br/>
  @input-body@
</p>

<if>
  <test>@captcha-enabled@!=0</test>
  <p>
    Captcha:<br/>
    @captcha-pic@<br/>@captcha-input@
  </p>
</if>

<p>
  <input type="submit" value="Submit"/>
</p>