Zibster Website Builder includes scheduling that allows visitors to your website the ability to book free or paid appointments with you. This guide will walk you through the steps of using the Scheduler block to add your Scheduler services to your Zibster website.
STEP ONE
Accessing Your Website
Log into your Zibster account and click on the WEBSITE option in the left side menu.
STEP TWO
Adding a Scheduler Block
Click on the page name or add a new page where you want to use a scheduler block.
There are two ways to add a scheduler block to your page:
- On the right-hand side of your screen, click the scheduler icon, and the scheduler block will appear at the bottom of your page.
- Hover your mouse over the scheduler icon, left-click and hold, then drag the block to your preferred location. When a teal-colored line appears where you want the block, release the mouse button to drop the block in that location. To move it, simply drag it up or down.
STEP THREE
Adding Services to Your Scheduler Block
To add services to your scheduler block, click inside the block or on the pencil icon at the top right and choose Advanced. The menu will open on the right side of your control panel and give you the following options to select your scheduler services:
- Display ALL of your scheduler service categories: Displays all scheduler services by category.
- Display a single scheduler service category: Displays all scheduler services within a single category.
- Display all scheduler services tagged with: Displays all scheduler services applied to your selected tag.
- Custom scheduler services: Displays services that you custom select.
Styling Options for Your Scheduler Block
Last Item Link
The Last Item Link feature allows quick loading of additional scheduler services in your scheduler block if the number of services exceeds the total number of rows and columns you've selected for your scheduler block.
You can also use the last item link as a call to action link to other pages, social media, or items you want to direct visitors to. You'll see the following options for Display Last Item Link:
- NONE: No link will be used on the last item in your grid.
- YES, AS A "LOAD MORE LINK": When clicked, it will load another set of items within the page. You can customize the text that appears in the load more link under the Link Text section.
- YES, AS A "STANDARD LINK": When clicked, it will link out to a separate page. You can customize the text that appears in the standard link under the Link Text section. You can also choose what you would like to link the standard link to from the following options:
- NONE: The button will not link anywhere and exists for aesthetic reasons on your page.
- EXTERNAL LINK: Direct your clients to helpful resources that exist outside your website.
- PAGE: Direct your visitors to an existing web page on your website.
- FORM: Connect to a Custom Form you have created in your FORM BUILDER.
- MARKETING: Direct users to a Campaign or Landing Page you have created in the MARKETING tool.
- FILE: Allow users to open a PDF, JPG, PNG, or GIF file that has been uploaded to the DOCUMENTS area of your account's FILES section.
- PHONE: Connecting your button to a phone number allows users to quickly click to call you.
- EMAIL: Connecting your button to an email address opens a user's default mail client to easily send you an email.
- ADDRESS: Allow users to find where you are by opening an address in Google Maps.
- VIDEO: Add a video embed code obtained from YouTube or Vimeo to play in a lightbox.
- POP-UPS: Enable one of your pop-ups to notify clients of your promotions, discounts, or to sign up for your newsletter.
- NONE: The button will not link anywhere and exists for aesthetic reasons on your page.
Scheduler Block Layout Options
You can choose from 27 different scheduler block layouts for displaying your services. The layouts include:
- Modern Square: Services display as squares in a grid with the number of rows and columns you choose. The service title and price display on top of the service image.
- Modern Portrait: Services display vertically in a grid. The service title and price display on top of the service image.
- Modern Landscape: Services display horizontally in a grid. The service title and price display on top of the service image.
- Editorial Circle: Services display as circles in a grid. The service title and price display on top of the service image.
- Editorial Square: Services display as squares in a grid. The service title and price display on top of the service image.
- Editorial Landscape: Services display horizontally in a grid. The service title and price display on top of the service image.
- Editorial Portrait: Services display vertically in a grid. The service title and price display on top of the service image.
- Designer Pinboard: Services are arranged in a grid. The service title displays below the service image, and the price shows on top of the service image.
- Designer Portrait: Services display vertically in a grid. The service title displays below the service image, and the price shows on top of the service image.
- Designer Landscape: Services display horizontally in a grid. The service title displays below the service image, and the price shows on top of the service image.
- Image Small Left: Services display in rows with a small service image on the left. The service title and price display to the right of the image.
- Image Large Left: Services display in rows with a large service image on the left. The service title and price display to the right of the image.
- Image Thin Left: Services display in a grid with a vertical service image on the left. The service title and price display to the right of the image.
- Image Bottom: Services display in a grid with a horizontal service image. The service title and price display above the image.
- Classic Landscape: Services display horizontally in a grid. The service title, description, and price display below the service image.
- Classic Layers: Services display horizontally in a grid. The service title displays above the service image, with the description and price below the service image.
- Contemporary Square: Services display as squares in a grid. The title, description, and price display below the service image.
- Contemporary Landscape: Services display horizontally in a grid. The title, description, and price display below the service image.
- Designer Large Portrait: Services display large and vertically in a grid. The title, description, and price display below the service image.
- Classic Menu: Services display left-aligned in two columns without an image. The title and price are on the same line, with the description below the title.
- Contemporary Menu: Services display left-aligned in two columns without an image. The title displays first, with the description following. The price is displayed last.
- Designer Menu: Services display left-aligned in two columns without an image. The title displays first, with the price following. The description is displayed last.
- Center Menu: Services display centered in two columns without an image. The title displays first, with the price following. The description is displayed last.
- Stack Menu: Services display left-aligned in two columns without an image. The title and price are on the same line, with the description below the title.
- Single Item Portrait: A single service displays a single image for the service in a portrait layout. The title displays above the image, and the price displays below the image.
- Single Item Square: A single service displays a single image for the service in a square layout. The title displays above the image, and the price displays below the image.
- Single Item Landscape: A single service displays a single image for the service in a landscape layout. The title displays above the image, and the price displays below the image.
Styling Options
The scheduler styling section gives you more control over how your services are displayed within the selected layout. By default, this section will use the styling and spacing settings in the global styling section of your website. You can override the global settings for your service block within this area. The settings in this section can include any of the following items:
- Space Between Items: Controls the spacing between services using grid layouts.
- Space Below Blocks: Controls the amount of space before the next block begins.
- Space Inside Blocks: Controls the amount of space at the top and bottom of a block.
- Mobile View: Controls whether services on mobile and smaller devices display in one column or two.
Click on Save Changes to apply your changes to your scheduler block styling options.
Colors
The scheduler color section includes five color options. These colors will override the colors for the button selected in the global color picker section under the DESIGN tab. Click on the color square or enter the HEX color code to customize the color for the following sections:
- Title Color
- Text Color
- Background Color
- Last Item Text Color
- Last Item Background Color
Click on Save Changes at the bottom to apply your color updates.
Background
You can add a background image to display behind your scheduler block. You can upload your own custom background image or choose one from the Background Library. Customize how the background image is displayed under the Background Settings. You can choose from the following options:
- Tile: Will tile your image to fill the background.
- Top Left: Will align your image to the top left.
- Centered: Will align your image at the center of the available space.
- Cover: Will scale your image to be as large as possible to completely cover the background.
Click on Save Changes to apply your changes to the background settings.
FONTS
You can easily customize the fonts you're using on your scheduler blocks to override your global font settings. You can change the font, font size, letter spacing (kerning), and line height for any of the following items in your scheduler block:
- TITLE
- PRICE
- LAST ITEM TEXT
Click on Save Changes at the bottom of the control panel menu to apply your changes.
0 Comments