1LD Tutorials & Blogs

Tutorials

How To Set Up the Slider

Step 1: Navigate to your Page Inspector > Styles Menu and enable the Slider by selecting ‘Slider’ under the Banner Setting option.

inspector  -> iehjfdjg -> aacgbdbc

Step 2: View your project in Edit mode by clicking the edit button.

fhcjhjgg
Step 3: Import or drag and drop an image into your editor.

Step 4: Double click the image and in the popup menu change the Filename to something that includes the word ‘slide’.

ficbecib

 

Step 5: Repeat steps 3 and 4 until you have as many images you want to use in the slider. Affero’s Slider will now do the rest! The order you place your images into the slider, is the order the slider will display them.

 


How to Add Captions to Your Slider

Step 1: View your project in Edit mode by clicking the edit button.

fhcjhjgg

 

Step 2: Copy and paste the code below into your editor. Step 3: Highlight the code you pasted and select “Ignore Formatting” from the Format drop-down menu.

Caption

Step 3: Highlight the code you pasted and select “Ignore Formatting” from the Format drop-down menu.

ignore formating
Step 4: Now highlight the white space between the code and select “Ignore Formatting” again. This is so you can use RapidWeaver’s formatting tools on the caption (e.g. change color or font-size)

Caption

 

Step 5: Add your desired caption in the white space between the pink highlighted code.

Captioning

 

Step 6: Repeat Steps 2-5 until you have your desired number of contents. Just like the slide images, the captions will display in the order that you place them. If you want to leave one slide without a caption just don’t add text in between the pink highlighted code.

NOTE: Sometimes the editor will change your straight quotation marks into curly quotation marks. The curly quotation marks will cause caption to not work. To change them from curly to straight just delete the quotes and retype them.

 


 How to Add Videos (iframes) to the Slider

Step 1: View your project in Edit mode by clicking the edit button.

fhcjhjgg

 

Step 2: Copy and paste the code below into your editor.

<li class=”slide”>

</li>

Step 3: Highlight the code you pasted and select “Ignore Formatting” from the Format drop-down menu.

ignore formating

 

Step 5: Locate the video you want to use on Youtube or Vimeo. Use the share link “Embed” option to get the iframe code. Paste the iframe code into the space between <li class=”slide”> and </li>

iaegjdfi

acaijbef

 

NOTE: Sometimes the editor will change your straight quotation marks into curly quotation marks. The curly quotation marks will cause caption to not work. To change them from curly to straight just delete the quotes and retype them.

 


How To Enable Lightbox on an Image

Step 1: Navigate to your Page Inspector > Styles Menu and enable the Lightbox by selecting checking the ‘Lightbox On’ checkbox under the Toggles heading.

inspector -> iehjfdjg -> aehagchc

Step 2: View your project in Edit mode by clicking the edit button.

fhcjhjgg

Step 3: Import or drag and drop an image into your editor.

Step 4: Double click the image and in the popup menu change the Filename to something that includes the word ‘lightbox’. You can also change the Alt Tag to set what will display as a caption for the image.

Light Box


How To Add A Button

Step 1: Type in your desired button text into your editor and hightlight the text.

ButtonText

 

Step 2: click the Add link button.

cechgeed

 

Step 3: Add a link to where you would like the button to navigate to and then add a ‘class’ with the value ‘button’.

ebejjeeg

 

Step 4: Click ‘Set Link’ and you are done.

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

Vivid Titles

Create stunning, uniquely-shaped content effortlessly with Vivid Tiles. Tailor your website’s appearance with customizable top and bottom edges, and arrange these elements seamlessly in rows.

Vivid Titles RapidWeaver Stack

Robust Customization

  • Create rows of uniquely-shaped content elements.
  • Customize each one independently.
  • Add almost any type of content.

Diverse Edge Options

  • Edges support 9 shape options with 4 layouts.
  • Mix and match edge shapes and layouts on top and bottom.
  • Incorporate images, icons, or text inside edge design.

Effortless Setup

  • Minimal setup required for immediate results.
  • Customizable style options to fit any website design.
  • Control element size and colors with ease.

Simply Responsive

  • Tiles automatically adapt to browser and device width.
  • Full control over tile horizontal and vertical alignment.
  • Automatically make all tiles in a single row the same height.

Eye-Catching Styles

  • Each edge shape has two unique background layers.
  • Adjust edge layer visibility, placement, and offset.
  • Apply subtle, attention-grabbing in-view animations.

CHECK IT OUT!

Latest News

Newsletter

Join our newsletter to get notified of new releases, updates, and discounts.

Subscribe

Popular Links

Free Stacks & Themes
See Order History
Product Tutorials
FAQs

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

RapidWeaver is a trademark of Realmac Software