Hero - CTA Button Module

Larger hero module with the option to add a CTA button

Hero CTA Button

Hero - Simple

Here’s a smaller hero module that just includes text and title

Rich Text Editor

Similar to a Word Document or Google Doc, web admins can use this for detailed content. In the text module, there’s options to add content that has been formatted and styled with the ITR guidelines.

I can make indented lists with bullet points and numbers:

  1. To style in an indented list, click the style button in toolbar
  2. Add content as needed
  3. Unclick the list to remove the numbered list styling

The same instructions apply to the bullet point lists:

  • First list item
  • Second list item
  • Third list item

Here’s a quote that can be added!

Using the format dropdown and the heading dropdown menu, I can adjust the content using the different menus depending on the content needs.

For example, I can create a button within this text editor using the formats dropdown. To do this, I highlight the text, create a link with toolbar link button, then select the button style from the formats dropdown.

Example button

There are a few other toolbar options that can be added as well, such as a divider line


 

Toll Calculator

Total

$0.00

This module places the Toll Calculator on the page. And this text box adds content below the total cost.

Featured Story Module

There are a couple extra options/fields in this module. For example, you can select the background color for this module, I’ve selected white. There’s also an optional CTA link that can also be added.

Learn More

Large Story Blade

Used to flow through the different content that zig zags with additional rows of this module. I always need to remember to update the image alignment so images don’t just stack on top of each other.

Large Story Blade

Left aligned Large Story Blade with the optional CTA link.

Click Here

Small Story Blade

Here’s a similar storytelling module that is reduced in size to the Large Blade, but has the same fields.

Left Aligned Small Story Blade

Updated this module with the left alignment for the image to create the zig zag flow of the page.

Continue Reading

CTA Stripe

This module allows for a break in the page to call users to click the notice.

Stripe Button

FAQ Accordion

The module is used for FAQ content. Web admins can add additional rows of content that provide questions/answers in a tray style.

What is the first question in this accordion module?

I can adjust the H-tag for each specific FAQ question to provide page hierarchy.

Will the first question tray be open on load?

Nope, does this needed to be adjusted for it to be open on load…

Is it possible to create a page with multiple FAQ Accordions?

Definitely! There can be multiple accordion modules that outline different answers for specific topics.

2-Column Cards (left)

There are three versions of card modules that can be used.

Second Card Title (right)

This card includes how an added CTA link will display below the description text.

Optional CTA

3-Column Cards / Carousel

Card #1

This is the description placement for the first card. When cards are added, they fit into a 3-column style/layout.

Card 1 Button

Card Title #2

Here’s the second card, which will fit in the middle of the 3-column layout. This is the card without the CTA link field added.

Card #3 Title

Web admins can also adjust each card’s H-tag setting, which can be helpful in establishing the page hierarchy where these modules exist.

3-Column Cards / Carousel

Card #1

This is the description placement for the first card. When cards are added, they fit into a 3-column style/layout.

Card 1 Button

Card Title #2

Here’s the second card, which will fit in the middle of the 3-column layout. This is the card without the CTA link field added.

Card #3 Title

Web admins can also adjust each card’s H-tag setting, which can be helpful in establishing the page hierarchy where these modules exist.

Another Link

Carousel Card #4

When a fourth card is added on the 3-column layout, it creates a carousel function, that adds the arrows allowing users to click through.

Password recovery

Enter your email address to which a password reset link will be sent.
If you have forgot your username, email procurement@indianatollroad.org for assistance. Please do not attempt to create a new account, as that will delay your access.