Selecting and Adding Components

This section details the purpose and instructions on how to use each component found within the Content Builder for the AMM.

Components found in the component dropdown are categorized into three main sections.

  • Basic Content components
  • Dynamic Content components
  • Personalization components

Basic Content Components

The Basic Content components allow you to add basic content such as links, text and images to your page.

Blockquote

This component allows text quoted from another source to be rendered specially, with a slight extra left and right indent. A Blockquote causes a paragraph break and a line of white space will be allowed between it and any text before or after it.

Blockquote

To create a blockquote, use the following steps.

  1. Insert a blockquote component from within the content builder.
  2. Type your content for the blockquote.
  3. Enter a Cite/Source.
  4. Preview to ensure the blockquote appears how you intended.

Bold Text

Bolt TextThis component highlights information by using a bold font. Simply type your content in the field provided.

Flash

Flash Use the Flash component to insert a Flash element onto your webpage. Select the element from the Asset Manager. The element will appear inline with your content, as opposed to opening in a separate player.

Headline

HeadlineThis component allows you to display section headings, or headlines, to provide structure to your pages. Within this component you can select different levels for the headline you enter (there are six to choose from). How each headline displays depends on the styles of your page theme. Simply add the content in the provided fields to create the headlines.

Horizontal Line

Horizontal LineThis component inserts a horizontal line. This is useful to create visual breaks in the page.

HTML Code

HTMLThis component allows HTML code to be inserted into the content management system. Possible uses include creating a table to display information, or inserting some custom javascript. We do not recommend you use this component to circumvent the available components and insert a custom ‘look and feel’ in a page or newsletter.

Image

Image The Image component displays an image in a page. Images can be large, medium, small, and thumbnail sized. (You may also have Clockwork add more sizes, if necessary.)

To insert an image use the following steps.

  1. Insert the Image component.
  2. Click the Select Image button.
  3. Add the image from your asset library. If the image you need is not in your asset library yet, follow the directions for “Adding Assets through the Content Builder” in this manual.
  4. Type an image description in the Alternate Text field.
    Note: use specific keywords for Search Engine Optimization (SEO).
  5. Align the picture left, center, or right. You may also choose “None”. If None is chosen, the image will share a baseline with the surrounding text.
  6. Select the size of the image you would like to use from the Image Version dropdown. (The AMM automatically saves 4 sizes of every image, plus your original size.)
  7. Enter a caption for your image (optional). This will display as text on your page near the image.
    Note: captions look best when the image is aligned in some way (left, center, right). See step 5 above for more information.

Italic Text

ItalicThis component inserts the information you enter in an italic font. Simply insert content in the field provided.

Line Breaks

Line BreakThis component inserts a line of white space or breaks up a block of text if inserted between text components.

To insert line breaks, use the following directions.

  1. Insert the Line Break component.
  2. Make a selection from the Number of Breaks radio buttons. You can choose either a number of line breaks or choose a type of clearing.

    Click the radio button for the number of line breaks needed.

    If you have an image in your page and you do not want text or other components to wrap around that image, selecting an option within the Clear setting creates a break so that the next component begins below the previous.

Link

LinkCreate a link to a document, internal page, external URL or email address using the link component.

After adding the Link component, select the Link Type in order to designate the appearance of the link. The link can be Plain Text, an Image, Headline 1-6, or List Element. If you select Image, you will need to enter additional information besides what is found in the directions below. More detailed information about images can be found in the Image section of this manual.

To create a link to an asset:

  1. Select "Asset" from the Destination drop down box. The window will refresh with fields associated with selecting an asset.
  2. Enter the Link Text. This is the text that will appear in your page or newsletter.
  3. Select Asset from the Destination dropdown.
  4. Click Select Asset. The Client Assets list will open in a separate window.
  5. Browse the list to locate the asset and click the Add to Page button. This will create a link to the asset.

To create a link to an External URL:

  1. This is the default link type.
  2. Enter the Link Text. This is the text that will appear in your page or newsletter.
  3. Enter the URL. The URL should be the full path including the “http://” This will create a link to an external web page.
  4. Select the check box for ‘Open link in a new browser window or tab’ if you would like the link to open in a new window when clicked.

To create a link to an Internal page:

  1. Select Internal page from the Destination dropdown.
  2. Enter the Link Text. This is the text that will appear in your page or newsletter.
  3. Click the Select Site Page button. Browse the Client Assets list and click the Add to Page button. This will create a link to the internal page.

To create a link to an Email address:

Select Email Address from the Destination dropdown.
Enter the Link Text. This is the text that will appear in the newsletter.
Enter the Email Address. (Do not enter “Mailto:”.)

Plain Text

Plain TextThis component displays text in the default style. Multiple paragraphs will be preserved in your page or newsletter.

Rich Text

Rich TextThis component works much like a standard word processing application and allows text, links, tables and even pictures to be formatted and displayed. You can also style, indent, and create bulleted and numbered lists.

To edit the Rich Text click the Edit button. After entering the text to be formatted, indented, bulleted or numbered, highlight the text and then click on the corresponding button.

If you are copying and pasting information into a Rich Text Field, after copying the text, you should highlight the text and click the Remove Formatting button. This will remove any hidden formatting characters embedded in the copied text.

Tip: Hover over buttons to see an explanation for each button.

Dynamic Content Components

The dynamic components allow you to control the look and feel of your web page and integrate multimedia into your page design. Use of assets, especially flash and video assets, should be reserved for experienced users.

Content Rotator

Content Rotator The Content Rotator component allows you to have a section on a page where the items in that section automatically change to new items.

To incorporate this feature on your site, use the following directions.

  1. Insert the Content Rotator component in the content builder.
  2. Choose the Rotation Type.
    • Random Order: changes out the content in the area in a random order.
    • Sequential Order: changes out the content based on the order in which you have added them within the content rotator.
    • Sequential Order By Date – One per day: changes out the content based on the order in which you have added them within the Content Rotator, but only changes out the content once a day.
  3. Click the Add new Rotating Content button. This will add a content section within this component.
  4. Insert and build your first component.
  5. Add and build more components as necessary.
  6. Click Save.

Flash Audio Player

Flash Audio Component

Use this component to play an audio file (currently, only MP3 file formats are supported.)

Inserting the Flash Audio Player component places an audio player on your page. When a user clicks play, the audio plays while directly on that page. To incorporate this component, use the following steps.

  1. Insert the Flash Audio Player component using the content builder.
  2. Click the Select Audio button.
  3. Select the audio file from your asset library. If you have not yet uploaded the file to your asset library, you may do it from here. Follow the instructions for “Adding Assets through the Content Builder” in this manual.
  4. Add a Caption for your audio. Use this caption to tell your users about this audio file.

Flash Video Player

Flash Video Component

Use this component to play Flash (.flv) video on your page.

Using the Flash Audio Player component places a video player on your selected page. When users click play, the video plays while directly on that page. To incorporate this component, use the following steps.

  1. Insert the Flash Video Player component using the content builder.
  2. Click the Select button.
  3. Select the file from the Asset Manager. If you have not yet uploaded the file to your asset library, you may do it from here. Follow the instructions for “Adding Assets through the Content Builder” in this manual.
  4. Set the size of the player on your page by entering a width and height in pixels.
  5. If you would like a watermark to display with your video, check one of the Watermark options. A watermark is an image (typically your logo) that displays with each video. Contact Clockwork Support to change the image used for your watermark.
  6. If you would like the video to play automatically when the user visits the page, check the box for Play Automatically.
  7. Choose to have the video play over and over without any user interaction by selecting Loop forever. Choose Play once if you only want the video to play one time.
  8. Click Save.

Forward to a Friend

Forward To A Friend Component

The Forward to a Friend component allows your site's visitors to send email messages with a link back to your site.

This will allow your customers to market your company on your behalf. By default the component will send the site's primary URL as the included link. To insert a Forward to a Friend component follow these steps:

  1. Insert the Forward to a Friend component.
  2. Enter an Email Subject.
  3. You may also optionally select an internal Thank You page to display after the user has submitted the form. (You will need to build this page first before being able to select it.) If this option is blank the component will simply display a success or failure message.
  4. Select the Newsletter type you would like. A plain text email is the default newsletter type. If you have the Active Messenger Service (AMS) installed, you can send customized email messages. For more information on customizing these messages, see the AMS manual.
  5. Preview the email form. On your website, users will be able to enter their own email address, a friend's email address and a short personal message to be included in the email. Email A Friend Preview

Image Rotator

Image Rotator Component

The image rotator component allows you to specify multiple images that will rotate in the same location on your page. By using this component, visitors will see a different image either in a time sequence you choose.

To use the Image Rotator component follow these steps:

  1. Insert the Image Rotator component.
  2. Click the Add Image button.
  3. Add the image from your asset library. (Pre-size your images before using the image rotator.)
  4. Type an image description in the Alternate Text field. The same alternate text will appear for each image.
  5. Align the picture left, center, or right. You may also choose “None”. If None is chosen, the image will share a baseline with the surrounding text.
  6. Select the size of the image you would like to use from the Image Version dropdown. (The AMM automatically saves 4 sizes of every image, plus your original size.)
  7. Enter a caption for your images. This will display as text on your page near the image.
  8. Select how you would like the image to rotate from the Rotate Order dropdown.
    • Random Order: circulates through your selected images in a random order.
    • Sequential Order (by pageload): circulates through your selected images in the order that you have added them to the component. The new image only appears each time the page is reloaded.
    • Sequential Order (By Date – One per day): circulates through your selected images in the order that you have added them to the component. The new image only appears one time a day.
  9. Add the next image to be used in circulation.

Click the trashcan button next to an image to remove it from the list of images.

Redirect Link

Redirect Component

A redirect link component doesn't create a link so much as it forwards any end-user coming to the page to another URL entirely. The page can contain other content but keep in mind the user will see that content only for a moment, if at all, before they are redirected to the link specified.

Sitemap

Site Map Component

The Sitemap component displays the page hierarchy for your site. Select a Top Page to serve as the starting point of the map. The Depth option controls the maximum number of pages that are shown.

Text Rotator

Text Rotator Component

The Text Rotator component allows you to specify multiple paragraphs of text for rotation in the same location on your page.

Click the trashcan button next to a block of text to remove it from the list of text to be rotated. Use the up and down arrows to rearrange the order of each item of text. Use the Rotate Order dropdown menu to specify the method of text rotation.

  • If "Random Order" is selected the text that displays on the page will be chosen randomly from the list.
  • If “Sequential Order (By pageload)” is chosen the text will cycle through with new text displaying every time the user views the page. (In this mode you can refresh the page to see the text "rotate".)
  • If "Sequential Order (By Date – One per day)" is chosen a new block of text will display every day. (For example, use this option to create a "Quote of the Day" area).

Personalization Components

Personalization allows you to personalize the experiences your members have with your site.

Conditional Content

The Conditional Content component allows you to display a different set of components to a specific list of Members. Choose the member list to match from the Matching List dropdown. You can insert components into the Matching Content area to display only to those members in the list. Insert components into the Alternate Content area to display if the user is not logged in, or is logged in but not in the selected list.

  1. Select a member list from the Matching List dropdown. When a user in this list is logged in they will see the content you place in the Matching Content area. If a user from this list (or any other visitor) is not logged in, they will see the content place in the Alternate Content area.
  2. In the Matching Content area, add components and content that you would like logged-in members to see in this area of your page. (Refer to the “Build Page Content” section of this manual for more information on adding components.)
  3. In the Alternate Content area, add components and content that you would like visitors and non-logged in members to see in this area of your page. (Refer to the “Build Page Content” section of this manual for more information on adding components.)

Edit Profile

The Edit Profile component allows members to update attributes marked as "Edit in Profile". To control which members may edit their profiles you may select one or more Member Lists. In order for the Edit Profile component to display for a member, you will need to select the list that member belongs to from the Member List dropdown.

To add a list to the Edit Profile component simply select the name of the list from the Member Lists dropdown menu. The new list will appear in the component. To remove a list from the component, click the trashcan icon associated with the list you wish to remove.

Email Signup

The Email Signup component allows your users to sign up for emails from a particular list. This actually allows users to add themselves as Members in your Personalization area to the lists you specify. (Note: this does not mean they can log into Member's Only web pages. For that you need to insert a Registration Block.)

To allow users to sign up for that list (and become Members), choose a list in the Member Lists dropdown menu.

To delete a list from the lists your user can sign up for, click the trashcan button associated with that list.

Member Cancellation

The Member Cancellation component provides a way for your members to cancel their membership with your site. Members who cancel will no longer be able to log in using the Member Login Component, nor will they be able to receive mailings from the Active Messenger Service (AMS) if you have this package installed. A member who has successfully canceled their membership with the site will have a status of “inactive”.

Within the component, the Newsletter you select is what the user will receive via email after they have cancelled their membership. The default option in the Newsletter dropdown is “Plain Text E-mail (Default)”. This will send a generic email letting the user know their membership has been canceled. If you have the AMS installed, you may customize this email by creating a newsletter and selecting it from the Newsletter dropdown. For more information on creating customized newsletters, see the AMS manual.

The Exit Page you select will be the page that the user is sent to after they have been canceled. This page should be a non-member’s only page. This page could inform your user that their membership has been canceled and thank them for being a member, as well as tell them any other pertinent information.

Member Directory

The Member Directory component will give a formatted list of all members. By adding lists to the directory all members in those lists will be displayed. The display can be configured to show attributes that have been associated with those members. Additional detailed attributes can be shown if the member is selected from the listing, this required that the member have an attribute called either First Name or Last Name for the link to be provided.

Member Logout Button

The Member Logout Button component provides a way for your site's members to log out of the site and forget any stored login cookie information. You can customize the button's text by editing the Button text box.

By default, after the user clicks the logout button, the component will redisplay on this page. You may also select a page that the user sees after logging out by using the Select Page button. You may clear the page you have selected by using the Clear button.

Member’s Only Login

The Member’s Only Login component creates a login box for registered users to login and will validate the member’s identification along with their password. Logging in will allow members to see pages with the “Members Only” status set. Additionally, personalized information and content for that member can be displayed using personalization variables or specific conditional content components. “Always redirect to the success page” will always display the success page after a successful login. If this option is not checked, the user will be forwarded to the page they were tying to visit that required the member to login first.

Password Reset

The Password Reset component allows members who have forgotten their password to request a link to reset the password. When displayed on the live site the Password Reset component will ask for the member's e-mail address. After entering and submitting their e-mail, the member will receive an automated message from the live site including a special URL to visit.

After clicking on or pasting the URL into their browser the member can enter (and confirm) a new password for their member account. After submitting this information the member is invited to visit the primary Member Login page to log in using their new password.

Registration Block Confirmation

This component (to be used with a Registration Block Component) provides a custom confirmation page that will redisplay the information entered into the registration block in a customized way. Choose the registration block component to be confirmed from the select list.

When a page has this component inserted it acts like a Personalized page in that there is a list of variables that become available for use on the page. Click the "variables available on this page" button to view the variables that can be included. (Variables are strings of text that begin with a dollar sign and get replaced with some other block of text on the live site.) In this case the variables redisplay the data entered by the user into the Registration Block Component.

Registration Block Questions

This component is used to insert questions from a Registration Block onto a webpage. Read more about Registration Blocks and how to set them up in the Personalization section of this manual.

Questions you set up within your registration block fall into three categories; Basic, Member Creation, and Advanced.

Basic

  • Checkboxes, Dropdown menus, and Radio buttons allow prospective members to select from a pool of possible responses to a question.
  • Multi-line questions allow for longer responses.
  • Phone number allows your user to enter their phone number. Phone numbers entered will be checked for accuracy, allowing for higher accuracy in the member data you receive.
  • Single-line text questions are for questions that require relatively short, one-line responses.
  • Standard Name and Address requests and provides fields for the prospective member to submit this information.

Member Creation

  • Account Creation is required for every registration block you use. By default, email address is the attribute a user would enter to register. However, you can change this to another value if you choose.
  • Email Address requests the email address of the person registering. If you are already using email address as the attribute required to register, then most likely you will not use this question. However, you could use it if you would like to provide an opportunity for users to enter a second email address. By using the Email Address question, the information the user enters is checked for any common errors (such as missing ‘@’).
  • Email confirmation requires prospective members to enter their email address twice before submitting the form. The two email addresses entered are checked to make sure they match.

Advanced

  • Age verification allows you to require members confirm they are of the appropriate age to view your site.
  • Challenge question is used if you want to limit membership to individuals who have been pre-selected (similar to access keys.)
  • File upload allows your user to upload a file, such as their photo.
  • Image verification requires the prospective member type in the letters that appear in an image when submitting their registration.
  • Regular Expression Text should only be used if you have very advanced AMM skills. Contact Clockwork Support if you have questions about using Regular Expression Text.
  • Required Code can be used if you want to only limit registrations to those users who have received a special code, such as one they received in a mailing.

Registration Block Summary

The Registration Block Summary component is used on the "Thank You" page specified in a Registration Block's preferences. It allows you to redisplay the information that has been submitted by that Registration Block using personalization variables.