blog-tutorial-post-template

Tutorials

Testimonials

General

Autoplay (Checkbox)

If you check the autoplay option the carousel will automatically slide through all of the items. Also, once checked, you will see an input for setting the speed of the carousel.

Max Width

The max width determine the width of the testimonial cards, although cards will shrink when necessary on smaller devices.

Breakpoints

Here you can set the breakpoints for both Mobile, and Tablet

Connect Arrows (checkbox)

If the connect arrows option is checked, then there will be no space between the arrows, and they will be connected together like a button group.

If this option is unchecked then a space will be placed between the arrows, and you will see an option for setting exactly how much space is between them.

Align Vertical

This select dropdown allows you to place the arrows on the Top or Bottom of the carousel.

Align Horizontal

This select dropdown allows you to place the arrows on the Left or Center, or Right.

Size

The size option determines the size of the outer button of the arrows.

Icon Size

The icon size controls the size of the arrow icons inside of the arrow buttons.

Radius

The radius controls the corner roundness of the arrow buttons.

Color

The color option controls the color of the arrow icons.

Background

The background option controls the color of the arrow buttons.

Hover Color

The color option controls the color of the arrow icons when hovered.

Hover Background

The background option controls the color of the arrow buttons when hovered.

Cards

Min Height

The min height controls the minimum height for all cards. This is useful when you want all cards to be a similar size despite the amount of content inside of them.

You will find options for Desktop, Tablet, and Mobile devices.

Margin

The margin controls the spacing around the inner cards of the carousel. Use this to control the spacing between each card.

Padding (Vertical & Horizontal)

Here you can set the padding of the cards, both vertical and horizontal.

Inner Padding (Padding around content)

The inner padding specifically controls the padding around the testimonial text itself. This is useful when you want to add padding between the quotes and the inner text.

Radius

The radius controls the corner roundness of the cards.

Background

The background controls the background of the cards you can choose from:

  • None
  • Single Color
  • Gradient Background (including orientation)
  • Image background (With overlay if wanted)

Shadow

You can also add a box-shadow to the cards by turning the shadow option on and then configuring the shadow properties.

Cards > Content

Text Color

This controls the color of the actual testimonial text itself.

Text Size

This controls the font-size of the testimonial text.

You will find options for Desktop, Tablet, and Mobile

Text Align

This controls the horizontal alignment of the testimonial text.

Font Family

The first font family option controls the font of the testimonial text. It comes with some preset options, or you can choose custom and select your own font by including a URL and the name of the font.

Hide Names

If you check this option, the names of the testimonial cards will be hidden.

Name Color

This controls the color of the actual testimonial Names.

Name Size

This controls the font-size of the testimonial Names.

You will find options for Desktop, Tablet, and Mobile

Name Spacing

This controls the amount of space between the testimonial text and the name.

Name Align

This controls the horizontal alignment of the testimonial Names.

Font Family

The first font family option controls the font of the testimonial Names. It comes with some preset options, or you can choose custom and select your own font by including a URL and the name of the font.

Cards > Quotation Marks

Hide Left Quotation Mark

This option will hide the beginning quotation mark

Hide Right Quotation Mark

This option will hide the ending quotation mark

Orientation

Here you can choose to have the quote be placed on the top and bottom, or on the left and right of the card content.

This is useful when you want to have a unique design with vertical quotes that are centered, or vice versa.

Alignment

  • Normal (beginning quote on top, ending quote on bottom)
  • Swapped (ending quote on top, beginning quote on bottom)
  • Center (places both quotes in the center)

Color

This simply controls the color of the quotation marks

Size

This controls the size of the quotation marks, note that you will need to set a fairly large size, around (50 – 100) is best.

You will find options for Desktop, Tablet, and Mobile

Bold Quotes

If this option is checked, the quotes will be bolded. This is the default. You may want to uncheck this for certain fonts.

Cards > Images/Icons

Hide Images

If this option is checked all images/icons will be hidden.

Align Vertical

Here you can choose to have images/icons placed on the Top or Bottom of the cards

Offset

This can be used to pull the images/icons slightly outside of the card.

Note: Set this to 0 if you want the images to be inside of the cards

Align Horizontal

Here you can choose to have the images placed on the Left, Center, or Right

Size

Here you can set the size of the images or placeholder icons.

You will find options for Desktop, Tablet, and Mobile

Spacing

This input controls the amount of space between the content and the image.

Radius

This controls the corner roundness of the images

Icon Color

This controls the color of the placeholder icon when an image isn’t specified.

Background

This controls the background of the image placeholder when an image is not specified.

Cards > Ratings

Hide Rating

If this option is checked, all ratings (stars/hearts) will be hidden.

Type (Stars / Hearts)

Testimonials allows you to specify the type of rating icons that will be used. You can choose between

  • stars
  • hearts

Hopefully more icons will be added soon.

Align

This allows you to set the horizontal alignment of the stars/hearts, you can set them to be Left, Center, Right

Color

This simply sets the color of the stars/hearts

Size

This simply sets the size of the stars or hearts

Spacing

This controls the amount of space between the ratings and the other content.

Quick Links

RapidWeaver Stack Tutorials

RapidWeaver Theme Tutorials

RapidWeaver Project Documentation

Tutorials and documentation for all 1LD Project files can be found at the link below.

See Documentation

Get the power of a framework, for the price of a theme, in the convenience of a prebuilt RapidWeaver project file

Blog

Movable Windows

  • Posted On

Move beyond the confines of static content layouts! Movable Windows allows your page visitors to effortlessly drag and reposition custom content windows anywhere in the browser viewport. Windows can be minimized to free up space and stay fixed to the browser viewport so they are always accessible.

Resize & Minimize

Windows can be resized to take up more or less space, or maximized to fill the entire screen. But that’s not all – these windows are like handy sidekicks, always ready to assist. Need quick reference? No problem! Windows can be minimized when not in use, saving precious screen space for what really matters – your page content.

Inline

Open windows stay fixed on screen so they are always accessible. Minimized windows have three modes to choose from. “Inline” keeps it in line with other content, “Fixed” is always on screen, and “Draggable” lets you move it around while minimized.

Customizable

It’s not just about functionality; it’s about style too. Customize your windows by size, position, and color. Add in text, images, forms, links – you name it! Want a little more flair? Allow window resizing, choose whether they start minimized or open, change the toggle icon, or hide the window title when minimized.

Check it out!

 

 

© 2011 One Little Designer, 1 Little Designer (1LD)

RapidWeaver is a trademark of Realmac Software