Getting Started

‍

What is Zeltac Slider?

Zeltac Slider is a Webflow App that lets you create interactive sliders with a few clicks - no coding required. The app automatically generates all the necessary elements in your Webflow Designer, creates basic styling and writes the JavaScript, so you can focus on design and content rather than technical implementation.

Key Benefits:

• No-Code Solution: Create sliders without writing any code
• Automatic Element Creation: App generates all slider elements in Webflow Designer
• Automatic JavaScript Generation: App writes, injects, and manages the necessary JavaScript code automatically
• Page Script Management: App handles adding/removing JavaScript code from your pages
• Real-Time Preview: See changes immediately in the app to get an idea of how the published slider will look like
• Webflow Integration: Seamlessly works within your existing Webflow workflow

‍

Installation

Prerequisites:

• Active Webflow account
• Access to Webflow Designer interface

Installation Method 1: Webflow Designer Apps Pane

1. Open Webflow Designer
2. Navigate to the Apps pane (usually on the left sidebar)
3. Search for "Zeltac Slider"
4. Click Install or Add to Site
5. Installation Prompts: A new tab will open asking for Webflow authorization
6. Select the site or workspace you want to give access to
7. Click Authorize to grant permissions

Installation Method 2: Webflow App Marketplace

1. Go to Webflow App Marketplace or directly to Zeltac Slider listing
2. Search for "Zeltac Slider" (if not using direct link)
3. Click on the app listing
4. Click Install App or Add to Site
5. Authorization: You will be redirected to webflow authorization page to select a site/workspace to authorize, complete that proces
6. After Authorization: You'll be redirected to Webflow Designer with the authorized site open
7. The app will be available in your Apps pane

Note: Both methods require Webflow authorization in a new tab where you select which site/workspace to grant access to.

‍

First Time Setup

Initial Authorization:

• Authorization happens automatically during installation
• A new tab opens asking for Webflow access permissions
• Select your site or workspace
• Click Authorize to complete the process

Account Creation (Optional for First Use):

• You can create a simple slider to explore the app features without logging in
• Login Required: You'll need to sign up/log in when editing existing sliders
• Sign Up Options: Use email & password OR Google OAuth
• Account Linking: When you sign up, your Webflow account is permanently linked to the app
• Important: You cannot use the app on other Webflow accounts - it's tied to the account you authorized during installation.
• Workspace Access: You can use the app in any workspace or site within your authorized Webflow account

Note: Create an account early to unlock full editing capabilities and save your slider configurations.

‍

Quick Start Guide

Create Your First Slider (Under 2 Minutes):

1. Launch the App
   • Click on Zeltac Slider in your Apps pane
   • Click New Slider button
2. Basic Configuration
   • Give your slider a name
   • Choose basic settings (optional for first slider)
   • Click Create Slider
3. See Your Slider
   • The app automatically creates slider elements and basic styles in Webflow Designer
   • Publish your site to see the basic slider in action
4. Customize (Optional)
   • Return to the app to make edits
   • Apply changes
   • Publish again to see your customizations

What Happens Behind the Scenes:

• App generates slider HTML structure
• Creates necessary CSS classes
• Writes swiper.js JavaScript code with your configuration
• Injects JavaScript code into the page automatically
• Manages page scripts (adds/removes as needed)
• Integrates with your existing Webflow elements

Success Indicator: You should see a working slider on your published site within 2 minutes of starting.

‍