Snippet Library: Users

Brick River Code Snippets aren't just for the code jockeys.  Lots of snippets are designed to be inserted in the content of a Page, Post, or Email body.  No coding skills required!

Simply insert the snippet, provide a few details if a wizard pops up, and you're done!

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

Email: Quote Box
Inserts a formatted quote box into the body of an email, page, post, or event.
This snippet inserts an HTML <blockquote> element in the body of an email.  It can also be inserted in the design view of a Page or in a HTML enabled field in a post, event, or other content.

Insert the snippet, select an option to float on the right or left of the current paragraph, enter quote content and save.  In the body of the email, the inserted content can be further customized using any text enhancement tools in the toolbar.

Example

It's time to ask for a raise.  We stalk the boss for several weeks online and compose a comprehensive profile so that we may exploit various personality traits to increase our chances of a successful outcome.

Along the way we learn that the boss loves Fleetwood Mac and thinks that Stevie Nicks is one of the greatest song writers in the history of adult contemporary rock.

We compose a message and insert the snippet, choosing placement on the left and a lyric from Edge of Seventeen.

 

And the result is...
 

Email: Button
Add a website link button to an email
This snippet creates and formats a button in the body of an email. Simply insert the snippet, provide button text, button color, and the link to the desired target site.

Example

We would like to direct people to our blog in our weekly email update.  In the body of a new email, we insert the snippet and provide the button text, color, and link.

And the result is...
 

Email: Card with Image
Add a full width card with image to the body of an email.
This snippet adds a full width card with placeholder image and text to the body of an email.  The snippet determines the width of the section where it is inserted and automatically sets an image width and height ( The height is 56% of the width).


For Example

It is time for our famous Dessert First! fundraiser - an fun filled night of music and entertainment with an all you can eat dessert bar.  We compose an Email invitation and insert the snippet

The result...

 
  1. Double click on the image placeholder to replace it with a custom image, and
  2. Edit the placeholder text.
The result...
 


 

Email: Content Digest (Pulls Data)
Add multiple cards with links to site content in the body of an email.
This may be the most awesome snippet.  Insert it in the body of an email and a wizard lets you select content from a database view - and creates cards for each selection with links to the selected content. 

Before inserting this snippet you need know the full URL of the page that will be used to display the content.  In the example below we will create content links to blog articles.  Our site uses a page called 'blogdetail' to display individual articles.  

The easy way to get this URL is to open a blog article in a browser and copy the URL up to the name of the page.
 

If you are selecting content that includes a Primary Image - you can choose to include that image in the card.  

Example

Each week we send a message to our fans with links to our recent blog posts.  We use the Content Digest snippet to create awesome links to this content.  

Insert the snippet...

Choose content and formatting...

  1. Choose the View that contains the desired content
  2. Select the desired content records, click the selection button (3 dots)
  3. Click to choose one or more records
  4. Click Save
  5. Enter the URL of the page used to display the content - from the www to the name of the page (see explanation above)
  6. Choose position of the photo relative to the content summary
  7. Choose the number of columns to be used
  8. Select the height and width ratio for to be used for sizing images
  9. Edit the outer width of the columns - default is the full width of the area where the snippet is inserted
  10. Click insert.
The result...

Email: Grids (Framer)
Inserts a table with placeholder images and text into the body of an email
This snippet makes it easy to insert a grid of sqare photos and captions in the body of an email.  Simply insert the snippet, then choose:
  • Number of columns (up to 3)
  • Number of rows (up to 6)
  • Width of images (default is 536)  
The table is inserted with placehold images and text. 
  • To replace the images - double click on the placeholder, select an image file from the local machine or file system, click Save.  For best results, choose an image that is square (or nearly square) which is larger than the image width designated in the wizard.  The image will be reduced and cropped to the correct size.
  • To replace the text - select the placeholder text, delete, and replace it.  Use design tools to format, resize, and enhance your text as desired.

Example

We are sending an email to a prospective customer and want to include a few testimonials.  We insert the snippet and choose a 3 column, by one row grid.  We accept the default grid width of 536 pixels.

 

The result, an HTML table with the desired proportions and placeholders. 

 

We replace the images with pictures of our current customers.  We replace the text with testimonial quotes.  We add some bold and italic...

The result...
 

 

Email: Image Float
Add a floating image box (with caption) to the body of an email.
Use this snippet to add a floating image (with caption) to the body of an email.  Insert the snippet in the desired paragraph, choose to float the image to the left or right, and compose a caption.

The snippet inserts the object with a placeholder for the image.  Select the placeholder, insert an image, set the image size and save.  That's it.

Example

In the body of an email, we would like to tell the recipients that they are outstanding in their field.  Naturally, we will use an image of some outstanding cows.

We insert the snippet in the desired paragraph, choose to float on the right and compose a caption.

 

Then we select the placeholder and replace it with an image of cows out standing in their field.  We set the image width to 250 pixels...

 

And the result...

 

 

Email: Image Table (Framer)
One click to insert a two column / three row table with placeholders for images and text content.
Add this snippet to the body of an email for an instant two column / three row table.  Replace the placeholder images and text.  Format as desired.

Want more options than two columne / three row?  Check out the Email: Side Images (Framer) Snippet.

Example

Our Children's Wildlife Museum is sending out our winter newsletter.  We use the snippet to promote our monthly programs.

We insert the snippet...
 

Then we double click the image placeholders and select our own photos.  Images will insert at their original size.  It's almost always best to set width or height settings to force all images to the same size. 

Small images are usually best for email content.  Setting the width to 150 pixels works perfectly for our table.

We select and replace the text and the result is...
 

RaCookin is a real thing - check it out here!

Email: Registration Button
Easily create a registration form button in the body of an email.
There are lots of ways to direct users to your custom registration forms.  One easy way is to insert the Email: Registration Button in the body of an email (you can also use this Snippet when designing a Page or creating Events or Posts.

Insert the Snippet, select the desired Reg Form and choose a color for the button.

Example

It's time to invite people to register for our famous Mini Golf Tournament and Fundraiser. 

In the body of the email we insert the snippet. We are prompted for a button color and form name.
 

We choose the form we've created for this event...
 

And the result...
 


 
*TIP - Want to customize the button text?  After inserting the snippet, simply select and edit the button text.

Email: Side Images (Framer)
Add a two column / multi row table with placeholders for images, captions, and text.
This snippet inserts a table to the body of an email with placeholders for images, captions, and text.  

Example

Our Summer Camp is sending an email to our mailing list to introduce this summer's staff.  We insert the snippet and are prompted for the placement of the narrow column (for images), caption, number of rows and table width (default is the full width of the column where the snippet is inserted).
 

A table is inserted with placeholders...
 

We double click the image placeholder to choose images of our staff, and then we replace and format the captions and text.

The result...
 

Embed Code - video, map, etc
Embed content from another site (such as a Google Map or a YouTube video) in a page, post, or event.
Many web services provide easily accessible 'embed codes' so that their content can be included in other websites - including yours.  Two types of popular embedded content are YouTube Videos and Google Maps. 

Once you aquire and copy an embed code from the host site - use this snippet to add that code to your Brick River content.  

This snippet is available in Page design and in the Body field of content records, such as blog posts, events, and contact records.


For Example

We're creating an event on our calendar to invite people to a posh website release party.   Of course we booked our favorite venue - the Odd Fellows Hall at 115 Water St in Exeter, New Hampshire.

To aquire the embed code, we visited https://maps.google.com and searched for: 115 Water St, Exeter NH.

When Google returned that address -  we clicked the Share link.

 

In the Share options

 

 
  1. Click the Embed tab
  2. Select the desired map size
  3. Select and Copy the entire text of the Embed Code

Back in Brick River, we composed a new event.  We clicked on the line where we wanted to place the map and inserted  the snippet.

In the dialogue box, we pasted the embed code.

 

The result...



 

Image Box
Adds an image box with a caption and placeholder to add an image.
This snippet adds an image box to a Page or Body field of a content record.  You will be prompted for a caption and paragraph placement (to the left or right of the current paragraph).

Once the image box is placed, double click the image placeholder to replace it with your own image.

Example

On one of our site pages, we'll insert an Image Box with a quote from our hero, Yogi Bera.

In page design view, we click the desired paragraph and insert the snippet.  In the dialogue box, we copy in a quote.

 

The Image Box is inserted with a placeholder.

 

We double click the placeholder and select a mug shot of Yogi Bera.

The result...

 

The size of the image box will match the width of the inserted image.  To change that size, simply double click the image and change the width (in pixels).

Once caption text is inserted, it can be selected, edited and enhanced just like other text on the page.