Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

Using the Quote component or the Quote component in  block in combination with the List component  schema allows you to insert styled Testimonial Galleries to a page.

The following instructions provide information on how to create and insert styled Quotes, Testimonials, and Testimonial Galleries into your page via TridionBeatrix CMS.

Info

Please see Introduction to Beatrix CMS: Content Blocks for instructions on creating your content block.

Table of Contents

Table of Contents
excludeTable of Contents

...

The first step in adding Quotes & Testimonials is to create a Quote componentblock.

The fields available in this schema are:

...

  • Title

...

  • Quote (

...

In the Building Blocks folder of your respective website, click New Component (highlighted in blue above) in the Create tab (highlighted in yellow above) of the navigation bar.

You will be taken to a new page for creating the component (shown below):

...

Creating an individual FAQ component.

There are a few required steps to creating an individual FAQ component:

...

Name the Quote component

...

Choose Quote from the Schema drop down menu (highlighted in yellow above).

Insert a Quote and Source for each testimonial.

...

  • required)

  • Source of quote

  • Title of source

  • Image

  • Links to:

    • Content Item

    • External Item and “Custom Read More” text

Note

Do not enter quotation marks in the Quote field, Tridion will do this ; they will be added automatically.

...

The optional information can help provide context or additional information for the quote or source, but the most important (especially in a Testimonial and Testimonial Gallery) is an image.

To attach an image to the quote, click the magnifying glass icon to the right of the Image field, highlighted in green above).

  • You will be taken to a pop up window, showing your Building Blocks folder (shown below):

...

In order for images to appear in this window, you must add them to Tridion as Multimedia Components (see https://ysmweb.atlassian.net/wiki/spaces/HELP/pages/1772880021/Components#Multimedia-Components for more information).

Select the desired image, and click Insert to attach the image to your Quote component.

When you are satisfied with the information in the Quote component, click Save and Close.

Inserting a Quote Component Into a Page

To put a Quote onto a web page, you must navigate to the desired page in the root folder and open it.

  • Click Insert in the Component Presentations tab of the page, which will open up the pop up with the Building Blocks folder in it (shown below):

...

Inserting an individual Quote component into your page.

on the image field and either select from the Media Library or upload your image. Add the Title and Alt Text as prompted.

...

Layout Options

Select the Quote component you created, then choose one of the following options from the Component Template drop down menu (highlighted in yellow above).

Info

Examples of the following types of Component TemplatesLayouts can be found in the next section of these instructions.

...

Once you’ve chosen the type of component Layout View you want, click Insert Add Content to add it to your page.

...

Back in In the window for your page, click Save and Close and you are ready to Publish Publish Content.

Individual Quote Examples

The screenshots below are examples of the different Component TemplatesLayouts you can choose from when adding your Quote component block to a page, as they look on a website:

...

You can create a Gallery of Testimonials (example above) by using a List component - Single Level schema, or content item, made up of several Quote components blocks.

To start, create several your Quote components blocks (information about this can be found above in these instructions).

Once all of your Quote components Quotes have been completed, you must create a List componentList - sing level item.

  • This component list will house all of your Quote componentsQuotes.

  • Then, you can add the List to a page , where the quote components will make up the slides in a Gallery.

In the Building Blocks folder of your respective website, click New Component in the Create tab of the navigation bar.

You will be taken to a new page for creating the component (shown below):

...

Creating a List component for the individual Quote components.

At this stage, you must label the component a List component before you can add your Quotes to it.

  1. Choose List from the Schema drop down menu (highlighted in yellow above).

  2. Do not enter any text in the Display title field.

  3. In the List element field, click on the folder/magnifying glass button (highlighted in blue above).

A window will pop up that shows you the Building Blocks folder:

...

The Building Blocks folder with your individual Quote components.

To add your individual Quote components to the List component:

  1. Select a Quote component you've created.

  2. Click Insert (highlighted in yellow above).

  3. Back in the window for your List component, click on the green + icon (highlighted in yellow below).

...

The pop up for the Building Blocks folder will appear again, and you can enter your remaining Quote components by selecting them and using the Insert button, like you did before.

...

Your completed List component, containing your individual Quote components.

  • or create it from the page editing area.

When you have multiple Quote components in the list, you can sort them by dragging the sort icons (highlighted in yellow above) or delete them using the trashcan icons (highlighted in red above).

Once your list is complete, click Save & Close in the Home tab (highlighted in blue above).

Inserting Your List Component Onto a Page as a Testimonial Gallery

To actually put the Testimonial Gallery onto a web page, you must navigate to the desired page in the root folder and open it.

  • Click Insert in the Component Presentations tab, which will open up the pop up with the Building Blocks folder in it (shown below):

...

Inserting the List component onto a page as a Testimonial Gallery.

Select the List component you created, then choose Tetimonial Gallery Blue or Testimonial Gallery Gray from the Component Template drop down menu (highlighted in yellow above).

Once you have chosen , click Insert to add the component to your page.

Back in the window for your page, you’ll see that your Testimonial Gallery component is there.

When you are happy with your page, click Save and Close and you are ready to Publish (see Publishing for more information)a Layout View, you can publish your page.

Example of a Testimonial Gallery on a Page

...