Snippet Library: Developers

Brick River Code Snippets can be used by content creators on the front end - but they can also be used by coders in Layouts and Page Source view.  Insert the code, customize it, publish it.  Easy.

Click Snippet Names to display or hide details and examples.
The owls are not what they seem.

@BRT.BreadCrumb()
Add breadcrumb links to a page.

 
This snippet can be inserted anywhere on a Page or Layout.  In the Page Design screen you can insert the snippet in either the Design view or the Source view.

This snippet contains the BRT.BreadCrumb() helper which displays a list of breadcrumb links - links to the parent pages of the current page. 

The appearance of links depends on how the site designer has defined the styles for unordered lists. If you understand HTML and CSS you can do change the appearance of these lists.  Learn more here - in our Dev Guide.

If you insert this Snippet from Page Design view - it may not display the links until the Page has been saved, closed, and re-opened.  After saving and re-opening the breadcrumbs will display in a 'code block' - an area of the page that can not be selected and edited further.

 

@BRT.Calendar
Add a calendar to a page.
While this snippet may be inserted in Page Design view, it is most often inserted in Source View or in the design of a Layout.  

Once the snippet is inserted, the DetailPage: parameter should be changed to reflect the Page to be used to display individual Event records when links are clicked in the calendar.



Read more about using Calendar Helpers here in our Developer's Guide.

 

@BRT.CalendarDetail - Calendar Detail Helper
Create a detail page for calendar events.
While this snippet may be inserted in Page Design view, it is most often inserted in Source View or in the design of a Layout. 

Once the snippet is inserted, the returnPage: parameter should be changed to reflect the Page that contains the Brick River Calendar.

This snippet inserts the BRT.CalendarDetail() function - which works together with the BRT.Calendar() function.

BRT.Calendar() uses the DetailPage: parameter to point to the Details Page
BRT.CalendarDetail() uses the returnPage: parameter to point back to the Calendar Page.
 

Read more about using Calendar Helpers here in our Developer's Guide.




 

@BRT.DataLink()
Inserts the @BRTData() Helper. This snippet includes a prompt to provide three parameters used by the Helper.
The BRT.DataLink() Helper is used to open a data form and, optionally, populate the form with default values or open a specific record with the form.

This Snippet prompts for three parameters,
formId:
defaultValues:
recordId
 

 

@BRT.Files - Add Links to All Files in a Folder
Adds an unordered list of links to all files in a designated directory. This is ideal for linking to .pdf files in a .pdf library.
While this Snippet may be inserted in Page Design view, it is most often inserted in Source View or in the design of a Layout.
 
Use the Page Source View or the Layout view to edit the directory: parameter of the BRT.Files() Helper included in the Snippet.

Use this parameter to point to the Brick River folder that holds the desired files.

Additional parameters may be used by BRT,Files().  Read about them here in the Developer's Guide.

This Snippet is ideal for providing links to a library of PDFs or other files.  For example, if you want users to be able to easily download monthly reports, simple create a folder in the Brick River Files Library called monthly-reports.
 

Each month, upload the monthly report to this folder.

On the page where you would like to display links to monthly reports, insert the Snippet.  Edit the directory: parameter to indicate the monthly-reports folder.

 

@BRT.GenerateMeta
Automatically generate Meta Tag data for a site.
This simple Snippet inserts the @BRT.GenerateMeta() Helper with placeholders the keywords: parameter.  It is meant to be used in a site's base layout.

Replace the placeholders with a list of relevant words to include in the site's keywords meta tag.
 

@BRT.Raw (put out the raw HTML)
Adds the @BRT.Raw Helper (used to include HTML encoded fields on pages and layouts).
This simple Snippet inserts the @BRT.Raw() helper - which is necessary when including content from fields enabled to store HTML.  It is used in Layouts and Page Source code.  More information can be found here in our Dev Guide.

@BRT.SiteMenu
Inserts the @BRT.SiteMenu() helper to create a list of links to parent, sibling and child pages.
Use this Snippet to add an unordered list of links to parent, sibling, and children pages - see an example here.

@RenderBody - the default editable page section
Inserts the @RenderBody() Helper
Inserts the @RenderBody() Helper.  Used in Layouts to render the default editable page section - learn more here.

@RenderSection() - editable section
Inserts the @RenderSection() Helper with a placeholder for the unique section name.

@Title - Page Title
Inserts the page title in a layout or page
Inserts the @Title system variable.  This Snippet is used in layouts and pages source.

Create a Drop Down Menu
Adds a Bootstrap styled dropdown menu to a page.
This Snippet is designed to work with the Bootstrap 3 framework. It can be inserted to a Layout or Page Source (Can NOT be used in Page Design View).  

This Snippet uses the @BRTSiteMenu() to create a dropdown menu of links anywhere on a page.  It uses placeholder values for the link text (Sitemap), and the isDropDown: parameter (12345).
 

 

The isDropDown: parameter must indicate the numeric Page Id of a parent page with at least one child page.  The code snippet will generate a link for each child page of the parent.

For Example...

Our Site has a Page titled Project Areas with three children pages. 
 

When the Project Areas page is opened in design view the Page ID is revealed as the final digits in the site URL.  We'll use this to customize the code inserted by the snippet.

 

 

On any page in the website (or in a site layout used by multiple pages), insert the Create a Drop Down Menu snippet at the location desired.  

Edit these placeholders.  For isDropDown: use the Page ID: 42011
 

Save and Publish the page.  The Our Project Areas link is styled as a drop down menu.
 
 

Custom Error Messages
Create a page with custom message for 'page not found' and other HTML error codes.
When a browser sends a request to web server - and the server can't fullfill the request - it sends the browser an error status code.

Most browsers have a generic page  to display these codes, but Brick River makes it easy create and format your own error page. You can create you own error code messages and format the page however you like.

If this is unfamiliar territory, you can read about the various error codes that web servers dish out - here

In any Brick River site, simply create a page with the friendly URL of: error

In the Page Source for that page insert the Custom Error Messages snippet.  The snippet uses the @BRTDisplayError() Helper with placeholder text for HTML errors status codes: 200 (no error), 404 (page not found), and 500 (internal server error).  Customize this code and add entries for other error codes as desired.

For Example...

On our site's Error page (we can name the page whatever we like, as long as the friendly URL is: error) -we insert the Custom Error Messages snippet in the Page Source.  Then customize the HTML  for case 404 like this:
 

So if a user asks the server for a page that doesn't exist... they see this:
 

Download Lister
Want to give users a way to download a quick contact list of all People in your system? Use this snippet...
Insert this Snippet in a Layout - no other content is required.  Name and save the layout and enable it for any websites that will use it. 

Create a blank page that uses the layout and set the friendly name to peopledownload.

A link to the peopledownload page will create new .csv file listing the First Name, Last Name, and Email Address of each record in the People View.

If desired, the code inserted by the snippet can be customized to add addition fields to the download - or to target a different  View.

For Example

We create a new Layout called DownloadAllPeople and enable it for our site.  We insert the Download Lister snippet and Save.

Next, we create a Page that uses the DownloadAllPeople layout.  The friendly URL must be set to peopledownload. Save the page.

Now we can create links anywhere on the site pointing to peopledownload...

When the link is clicked, the system creates a .csv file which includes the FirstName, LastName and Email Address of records in the People View.






 

If field is not null
This snippet insert a few basic examples of using @if statements to use to test fields for null values in your code.
This snippet provides some easily edited code to test fields for null values when referencing them in your code.

Want to include an image field without disasterously including a record where the intern forgot to upload an image?

Insert and edit this:

@if (item.GetFiles("PrimaryImage").Count==1) {
    <a href="@item["Link"]"><img src="@item.GetFiles("PrimaryImage")[0].Url?width=231&height=129&mode=crop" />
        @item["Title"]
    </a>
}

Want to reference an article by it's summary except for when the editor dispicibly doesn't write a summary and it's more appropriate to grab the first 200 characters of the Body field?

This will probably work as is...

@if(!item.IsDBNull("Summary")){
    @item["Summary"]
}
else{
    @BRT.Raw(item.GetString("Body").Summarize(200))
}
Want to include a link to an article author - unless the article is so bad that the author would rather not have a name and photo associated with it?

Use this one.

@if (!item.IsDBNull("Authors")) {

    @foreach(EngineRecord author in item.GetRecordList("Authors")) {          
        if (author.GetFiles("PrimaryImage").Count > 0) {
            <img class="img-circle" src="@author.GetFiles("PrimaryImage")[0].Url?width=50&height=50&mode=crop" />
        }
        <span>
            @if(!author.IsDBNull("FirstName")){
                <a href="/authordetail/@author.Href">@author["FirstName"] @author["LastName"]</a>
            }
        </span>
    }
}


That doesn't cover all the ways that you have to watch out for people leaving stuff null when they should be not null - but that's three of them.

Load a random header image
Add a simple script to randomly rotate a set of header images.
It's often the case that users will want a simple way to rotate through a set of header images.  

Insert this snippet in a Page Source or Layout and customize the code to suit your purposes.

@*
Calls a random number to load a header
*@
@{  
    Random random = new Random();
    int randomNumber = random.Next(1, 5);
    var s1 = "background:transparent url('/files/content/www/images/headerbg/bg";
    var s2 = ".jpg') no-repeat center top;";
}
<div id="header" style="@s1@randomNumber@s2" ></div>


Out of the box - this snippet randomly loads one of five images, named:
bg1.jpg, bg2.jpg, bg3.jpg, bg4.jpg, and bg5.jpg

The images are to found in the folder:
content/www/images/headerbg

Edit accordingly to change the number of images in rotation, use of .png files, or different file names and locations.

News Article Detail
Create a basic page to display content of News artcles.
This snippet creates a basic News article page.  Used in combination with the New Article Index - you can create basic news index and detail pages in less than five minutes.
  • Create a page with a friendly URL of news - insert the News Article Index snippet there.
  •  
  • As a child page of News, create a page with a friendly URL of newsdetail - insert the News Article Detail snippet there.

These snippets are coded to pull content records from the built in News View. 

With just a few lines of customization you can modify the code to create Blog Index - Blog Detail pages, Event Index - Event Detail Pages - or anything similar.
 

News Article Index
Create an index of News articles.
Brick River provides a built in defition of News content. Using this snippet in combination with the News Article Detail snippet you can easily add a directory of News articles to your site.

The News Article Index snippet inserts the code to create a basic News index.  It pulls data from the built in News view.

For each article the index presents:
 

1 A thumbnail of the article Primary Image
2 The article Title
3 Publication Date
4 Summary

Out of the box, the news index will look like this...
 
 

News Article List with Categories
Creates an index of news articles categorized by article topics.
Slightly fancier than the News Article Index snippet, this one categorizes content by the article Topic field.  Articles with no topic are not included in the resulting index.

Like the other News snippets, this one will work with no further customization - as long as:
  1. no modifications have been made to the built in News view, and
  2. the page used to display news details uses a friendly name of newsdetail

Root Layout
This snippet provides an easy root layout to utilize the Bootstrap 3.3.6 framework and a local css file.
Most sites use a single Root layout as the parent for all other site layouts.  The root layout contains the base <head> content for the site.

Insert this snippet in the design of your root layout and customize as needed. 

Out of the box, this snippet uses links to the Bootstrap 3.3.6 framework.

One line requires customization - the <link> which includes placeholder text for you to indicate your root local css file:

<link href="/files/content/put-in-your-site-folder-here/put-in-your-css-file-here.css" rel="stylesheet">



RSS Feed - in a page - for news
This snippet works together with the RSS Feed - the layout snippet to compose a RSS feed to news articles or other dynamic content.
Use this snippet to configure an RSS feed to news articles or other dynamic content.  It works together with the RSS Feed - the layout.

Insert this snippet to the body of the page.  No other content is required on the page.
 


1   Set the Layout to the name of the layout that includes your customized RSS Feed - the layout snippet.
2   Customize the two lines of code which indicate the site pages to be used to present the dynamic conent.

RSS Feed - the layout
This snippet works together with the RSS Feed - In a Page - for News snippet. Insert this snippet in the Layout used by the Page that will display the RSS feed.
This snippet, together with the RSS Feed - in a page - for news snippet, make it easy to configure an RSS feed to news articles or other dynamic content.

Insert this snippet in the Layout that will be used by an RSS feed page.  No other content is required in the layout.

The snippet composes a block of XML with a placeholder for the <link> tag.  Replace this text with the URL to your site homepage - or another page on your site.

 

Save the layout.

Search by Zip
Add a field to search for contact records in a specific zip code.

Use this snippet in a Page Source to insert Search by Zip fields.  These fields are typically used on pages with directories to people or places.

Fields include:

  1. A text entry field for a zip code
  2. A drop down selection list to choose a radius, in miles (1 ,5,10, 25, 50, or 100)
  3. A submit button


This snippet takes advantage of Brick River's built in radius based search indexing. 


The content to be searched requires physical address information - most importantly.... wait for it....  a five digit zipcode in the Physical Address Zip field.

The inserted code requires three modifications to work.



1   Set the <form> element action attribute to the friendly name of the page containing the code

2   Set the @BRT.Index viewId parameter to the Id of the View to be searched, and

3   in the itemTemplate parameter, edit the link to include the friendly name of the page to be used to open detail records.

 

Search Form & Results
Adds a text entry form field and submit button to perform a Brick River content search..
Use this snippet in the Page Source of the page that will return a result list of a Brick River search.  

Read all the gory details - here.

Search Results
Insert the two lines of code required to present the results of a Brick River content search.
This snippet inserts the two lines of code needed to create a Brick River search results page.  This snippet has a fancy pants cousin named Search Form & Results - which inserts six lines of code.

When six is too many and two is just right - use this Snippet.  Read all you need to know about it here.

Secure Pages Layout
Creates a layout for secure pages - pages only visible to authenticated users.
This snippet creates a layout to be used by pages that will require user authentication.

No modification is required if the layout is:
applied to a secure portal landing page with the friendly name securepage, and
applied to a secure help page with the friendly name securepagehelp

Secure pages should be created as children to the secure portal landing page and should link to the layout containing this code.

Read all about creating a secure portal - here.