This article will walk you through updating content on the Artez Donation and Tribute Template.  Below the video you will find some additional resources as well. 

Let's Learn

• Updating Content
• Frequently Asked Content How To’s
• Adding a Hyperlink
• How to embed an image
• Adding a Microsite Page
• How to Embed Videos or Google Maps
• Donation Thank You Page: Keywords

  Updating Content

 

 

Each form in the FrontStream system utilizes numerous content pages. 

Step 1 Click Content

Tip: All potential content pages are grouped for ease of use.To expand the list of pages, select Expand All or click “+”.

• The list of items on your screen may be different than our example. It depends on the event configuration.
• For access to all the content pages at once without enabling the event settings, click the box beside Enable all pages for editing and hide help icons. This will allow you to edit the content on those pages but does not automatically enable those pages in your event.
• For those pages requiring additional configuration, click the “?” beside the link for more information.
• To help you keep track of what you have changed, “Default” appears beside the pages you have not yet customized. “Custom” will indicate changes have been made.

NOTE: If you have English and French content turned on for your event, be sure to select the correct drop down of the content editor pages to update the corresponding language you are working.  You will need to update both sets of content as they do not automatically translate. 

 

Mass update content:

• Enter the original content you wish to replace, as well as the replacement content.
• If you want to replace only specific case sensitive instances of original content (“Event”, and not “event”), then ensure that you check off the “Match case” checkbox.
• You will be provided a list of suggested changes and the option to cancel or proceed.

Advanced Language Options:

• To add French language to your event, click French and Add Language.
• All content will need to be customized in English and French.

Step 2 Select a page to Edit and Preview

Edit & Preview can also be referred to as a  WYSIWYG (What You See Is What You Get).

Tip: To move to the Previous or Next content page, click the buttons as highlighted below

To edit content in the preview window, simply make your changes directly in the window provided.

The toolbar above the WYSIWYG will allow you to make formatting changes. Simply highlight the content you wish to format and click the appropriate button.

You have the option to customize content per scenario so just be sure to take a look at each scenario and customize as you like. 

Don’t forget to save your changes.

The toolbar explained:

To hide one of the input fields on the page, move your cursor over the field. When a small floating menu appears, click Hide.  Not all fields allow for this but those that do will appear. 

If you want to change whether an input field required or display an error message if the registrant does not fill it in, move your cursor over the field. When a small floating menu appears, click Turn Required On (or Off, as the case may be) or Error Message. Not all fields allow for this but those that do will appear. 

Tip: Many of the top level functions in the Edit and Preview can be found in more detail in the Edit Content and Hidden Items menu options (see below).

Step 3 Edit Content & Hidden Items

The Edit Content and Hidden Items sections provide you with a complete list of potential fields that are displayed on the event pages and a deeper level of configuration access.

In Edit Content you will find additional content fields.

Be sure to select the language you are looking to update. 

In Hidden Items, items with a check mark are currently displayed fields while items with no check mark are currently hidden fields. For example, to remove the Search a Team link from the home page, uncheck the option below.

Frequently Asked Content How To’s

Adding a Hyperlink

1) Go to the content section

2) Open the page you wish to edit

For example, the Event Homepage is located under the first heading, “Start Up & Password”

3) Highlight the text on the page of which you want to hyperlink

4) Click on the link icon on the WYSIWYG  toolbar

5) Select the appropriate link type and enter the page you wish to link to.

 

 6) Click Save.

How to embed an image

The below four steps will show you how you can use simple html codes to easily embed an image in any content page. Let's get started!

Step 1 Host your image

Have your image hosted on a secure server. If you do not have access to a secure server, send your image to our support team by clicking submit a request above. Our team will host the image for you and return your secure image URL.

Step 2 Go to Content

Using Internet Explorer, go to the Content section and open the page which you would like to add an image to.

Step 3 Open HTML box

Hover over the area which you would like add an image to and then click on the HTML box that appears:

Step 4 Insert your codes

Insert the following code into the HTML box, exactly where you want the image to appear:

<img src="InsertYourImageURLHere">

E.g. <img src="https://secure.artezimages.com/secure/artez/artezsupport/fs.jpg">

Please note that event customization through CSS/HTML coding is not a supported feature of our product and does require some in-house expertise. Please remember to test your live event pages after adding any CSS/HTML code.

Adding a Microsite Page

Administrators now have the ability to create additional blank content pages for their events. These “microsite pages” can be linked from any page, external website or blog. Microsite pages are available for all event templates.

To create a microsite page:

Step 1: Open the Content section of your event

From the admin console choose your event, donation form or purchase template. Then, click "Content" on the left menu.

Step 2: Expand the Microsite section and click "Add"

Step 3: Set a Title & URL Segment for the page

In the Title field, specify a title. This is the title of the page displayed in the browser when the page is viewed.

In the URL Segment specify a value. The value inserted here should be meaningful as it will be appended to the end of the microsite page URL. For instance: “About_Us” or “Our_Corporate_Sponsors”

Step 4: Add content to the body of the page

The editor allows you to create or insert content for your page. You can simply type in content, create tables, insert images, or you can also click on the source button to insert or modify HTML.

Use the Toolbar to perform a variety of tasks such as formatting, pasting, inserting images, tables, hyperlinking, etc. 

In the Additional CSS section, you can specify unique CSS that will be applied only to your microsite page. (Please note that opening and closing style tags are not required.) This CSS will override the overall event CSS if you have modified your event pages with CSS.

 

Step 5: Click Save

You can also preview the page by clicking on the Preview button or copy the link into a browser window.

Notes:

Content pages support bilingual events. You may choose to build an English and a French page with content that is unique to each. Alternately, you may make a single page that is applicable to users in both languages.

How to Embed Videos or Google Maps

The below steps will show you how you can easily embed videos from YouTube and Vimeo and Google Maps in any content page. Let's get started!

Step 1 Find your Video or Map 

Find the link for your video or map, click the share button and copy the html code from the 'embed' sharing option. 

Here is an example using YouTube

Here is an example using Google Maps

Step 2 Go to Content

Using Internet Explorer, go to the Content section and open the page which you would like to add your video or map to. 

Step 3 Open HTML box

Hover over the area which you would like add an image to and then click on the HTML box that appears:

 

Step 4 Insert your codes and save

Insert code you copied into the HTML box, exactly where you want the video or map to appear. 

Tip: you may need to play with the width and height to reach the size you want.  To make that change, simply update the pixel width or height in the code.  If you want the video or map to be the width of your page you can use 100% for your width

Here's an example: 

Default YouTube Embed code:

<iframe width="560" height="315" src="https://www.youtube.com/embed/watRtKIrtDY" frameborder="0" gesture="media" allow="encrypted-media" allowfullscreen></iframe>

Change the width of 560 to 100% to make the video the width or the page, or you can change it to a specific pixel width. 

 

Please note that event customization through CSS/HTML coding is not a supported feature of our product and does require some in-house expertise. Please remember to test your live event pages after adding any CSS/HTML code.

Donation Thank You Page: Keywords

Use these keywords to personalize your content on the Donation Thank You page!

The keywords will be replaced with information collected for donors or participants.

Please note: The %CreditCardNumber% keyword displays only the last four digits in the number. For instance: ***-1234

• Example: Hello, %FirstName%! Thank you for your donation of %DonationAmount%.
• Result: Hello, Andrew! Thank you for your donation of $25.00.

%EventName%
%Organization%

Donor
%AddressLine1%
%EmailPermission%
%AddressLine2%
%FirstName%
%AddressLine3%
%FullName%
%AddressLine4%
%JobTitle%
%AddressType%
%LastName%
%Apartment%
%MiddleInitial%
%AuthorizationNumber%
%MiddleName%
%BusinessTitle%
%NamePrefix%
%CardholderName%
%NameSuffix%
%CellPhoneAreaCode%
%PaymentDate%
%CellPhoneNumber%
%PaymentID%
%City%
%PaymentStatus%
%CompanyName%
%PaymentType%
%ConstituentID%
%PostalCode%
%Country%
%PostPermission%
%CreditCardNumber%
%Province%
%CreditCardType%
%TelephoneAreaCode%
%Department%
%TelephoneExtension%
%DonationAmount%
%TelephoneNumber%
%EmailAddress%
%Title%

Participant/Team (if donation sponsoring a participant or team)
%ParticipantFirstName%
%PersonalPageLink%
%ParticipantFullName%
%TeamName%
%ParticipantLastName%
%TeamPageLink%
%PersonalOrTeamPageLink%