Swipe

Table of Contents

• How to use
• General
• Title
• Blocks
• Colors & Fonts
• Setting Block icons, links, text

---

---

Introduction

Ready to start using Swipe?!

It's modern, sleek, and easy to setup! : ]

Here you can learn how to use the Swipe stack from Weavium. Of course, if you have any questions along the way, you are always welcome to visit the support page and leave us a message. ^_-

---

How to Use

Swipe is a peice of pie to set up!

Simply add the Swipe stack to your site, and then add blocks using the (+) button. All of the main styles such as sizing and layout can be found in the main stack.

By default all block colors are inherited by the main stack.

If you want a particular block to override the default colors simply check one of the "Custom Colors" option in the settings panel of that particular block!

You can also edit icons, text, and links by clicking on individual blocks.

Enjoy! : )

---

General

Z Index

Here you can set a Z index for the Dive menu. This helps to keep the menu on top of any other fixed stacks that you may have.

Padding (Vertical & Horizontal)

Here you can set the padding around the edges of the stack.

Breakpoints

Here you can set the pixel widths for the tablet and mobile breakpoints. These are the widths at which the tablet and mobile styles will me applied.

---

Title

Hide Title

Here you can choose to hide the main title

Title Size

Simply changes the font size of the main title

Title Spacing

This controls the amount of spacing between the title and the blocks.

---

Blocks

Here you will find the majority of options for the styling the blocks.

Cols (Desktop, Tablet, Mobile)

This is where you can determine the number of block columns that will appear on different devices.

Gutter

Here you can set the amount of space that will appear inbetween each block item. This applies to both the slider and the grid.

Height (Desktop, Tablet, Mobile)

This is where you can set the height of the blocks. You can set different heights for different device sizes.

Padding (Desktop, Tablet, Mobile)

Here you can set the inner padding of the blocks. You can set different padding amounts for different devices.

Radius

Here you can set the corner roundness for each of the blocks.

Icon Size

Here you can set the size of block icons.

Text Size

Here you can set the font size of the block text.

---

Colors & Fonts

Here you can edit the colors & fonts for the entire stack

Fonts

Here you can set the font for the Swipe Stack.

There are 3 options for selecting fonts:

• Preset (choose from a list)
• Custom Google Font (Quick Google Font by name)
• Custom Font (Your own custom font name)

If you choose Custom Google Font all you need to do is type in the name of the google font that you want to add, it will work like magic!

You can find Google Web fonts here: www.fonts.google.com

If you select "custom" you will need set a custom font name of your own. Note, that you must provide your own font library somehow.

Title Color

Here you can set the color of the main title.

Swipe Notice

On Desktop devices, a small notice appears telling the user that they can swipe through items with their mouse.

Here you can set the color of the background and text color of this notice.

Toggle Text (Initial & Hover)

Here you can set the initial & hover colors of the "View All" toggle that appears in the top right corner of the stack.

Block Icon (Initial & Hover)

Sets the color of block icons

Block Text (Initial & Hover)

Sets the color of block text

Block Background

For the backround, you can choose between 5 different options:

• Color
• 2 Color Gradient
• 3 Color Gradient
• Image with a single color overlay
• Image with a gradient overlay

Simply select the background type that you want and the appropriate options will appear. : )

---

Setting Block Links, Icons, Text

Click on an individual block to edit the item link, icon, and text.