Text & Media

What Is A Page Title?

Above this text element you will notice that there is a standard page title element. This feature is built into curator to give a quick and easy way to label multiple pages without you having to do it manually. However, if you are looking for a more individualized and custom look as you see below, feel free to use the 'Show Title' toggle located at the top of the page builder window to deselect this view. Give it a go and turn it off and back on.

Custom Page Titles
Want a more individualized experience? You can create your own custom page titles using text elements. This allows you to use custom fonts, type sizes, and positioning. Look below and use the text editor to make the page title below your own. Try changing the type's size, weight, font, alignment and color to get more familiar with the text editor.

(Edit: Page Title Here)

Text and Tiles

Now let's talk about how to use text to create custom tiles. Text boxes are a very flexible element that can contain text, images, links, buttons, and more. We are going to use this to our advantage to create custom tiles. Let's walk through the steps of how to create your own custom tiles.

Text Tile #1

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris

Text Tile #2

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris

Text Tile #3

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris

Text Tile #4

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris

  1. Beneath this text box create four new Text Elements in a row by pressing the ( + ) buttons below, then on either side of the first new element. (As you are creating next text elements you can type placeholder text for the time being we will comeback to edit the text)
  2. Next click on the first text element and in the top left of the element slide out, you will see a button that says edit content. This is when we will input the text. Use type hierarchy to create header and body text with sizing, weight and color.
  3. To add the button on the bottom, beneath the edit content button you will see categories such as Button Settings, Element Styles and Row Styles. Expand Button Settings and click to show buttons beneath content. Scroll to the bottom of the button settings to add new button. Here you can put in text and a link to the proper curator page it links to. If this page has not been created yet, leave this section blank and comeback to it once you have finished your page navigation. (This is how buttons will be added to any element that allows for buttons.)
  4. Last to add the background expand Element Styles tab while you element is still selected. In here you will find element background color. Input desired color for background here (quick tip: keep this color on the lighter side to help with contrast between text for greater readability.
Let's Talk Media
Now that we have gone over the text editor, let's look at how to combine text elements with images and other media elements to create a more polished looking site. 

Hero Images

Hero images are eye catching banner frames that span the entire width of your page. They serve as the first thing a user will see when coming into your page setting the tone for what they will see in the rest of the site. This is the perfect opportunity for you to set the stage for new users, letting know what is to come while navigating your site.

Now that you have changed the imagery, by using element and row styles, you can edit the height/width of the hero customizing the look and feel of the space. Use the height control to customize the size of the hero image in your side panel to make it smaller and larger than it currently is.

Tip: Did you know you can use hero images for more than just the top of your page? Using imagery is a powerful visual tool in the creation of a webpage so edit this image to create a personal touch to your curator site.

Adding Media Elements  

Media is a term that covers any visual item that is not text. Some examples are images, videos, and gifs. Using these elements can add a more welcoming designed feel to your site. Combining text and imagery is an easy way to break up the visual space of you site (as seen in this example). Edit the text and imagery to make it your own.

Video As Media

Media as stated above is a wide stretching term to most visual items that can be placed in your site. As we see to the right there was a video element placed here. This can give your site a very lively or even instructional feel depending on the videos contents. This video shows us the different types of elements that can be selected in Curators backend. Give it a shot by uploading one of your favorite gif files and setting the content type to give in the left panel. Gif is a file format that will loop over and over, and is best used for short format videos that are only trying to get one thing across to the user.

Looking for more tutorial content to work through? 

Here are some more options to take a deeper dive into Curators features.