Zoho Bookings Integration

Seamlessly integrate Zoho Bookings with WordPress to allow users to schedule appointments directly from your website.

Description

Zoho Bookings Integration enables users to schedule appointments directly from your WordPress website. The plugin features a modern, user-friendly interface with timezone detection, country-specific phone formatting, and a step-by-step booking process.

Features

• Modern UI: Clean, professional interface built with Tailwind CSS and shadcn UI inspiration
• Step-by-Step Booking: Intuitive wizard-style booking process
• Timezone Support: Automatically detects user's timezone and converts available slots
• International Phone Support: Smart country detection with proper phone number formatting
• Multiple Service Support: Create different booking forms for various services
• Custom Shortcodes: Use unique shortcodes for each service
• Admin Settings Panel: Easy configuration of API credentials and services
• Responsive Design: Works perfectly on mobile, tablet, and desktop devices

Installation

1. Upload the plugin files to the /wp-content/plugins/zoho-bookings-integration directory, or install the plugin through the WordPress plugins screen directly.
2. Activate the plugin through the 'Plugins' screen in WordPress
3. Use the Zoho Bookings > Settings screen to configure the plugin
4. Add services through the Zoho Bookings > Manage Services screen
5. Place shortcodes on your pages to display booking forms

Configuration

Step 1: Create Zoho API Client

1. Go to Zoho API Console
2. Create a new client
3. Set the redirect URI to your website's URL
4. Generate a refresh token using the documentation provided by Zoho
5. Note your Client ID, Client Secret, and Refresh Token

Step 2: Configure Plugin Settings

1. In WordPress admin, go to "Zoho Bookings" > "Settings"
2. Enter your Client ID, Client Secret, and Refresh Token
3. Set your preferred success and error messages
4. Save settings

Step 3: Add Services

1. Go to "Zoho Bookings" > "Manage Services"
2. Click "Add New Service"
3. Enter a name for the service
4. Enter the Service ID from your Zoho Bookings account
5. Click "Add Service"
6. The system will generate a unique shortcode for this service

Step 4: Add Booking Form to Your Website

There are two ways to add a booking form:

Method 1: Using Service-Specific Shortcode

[zoho_booking_service_name_123abc]

Where zoho_booking_service_name_123abc is the shortcode generated for your service.

Method 2: Using Generic Shortcode with Service ID

[zoho_booking service_id="YOUR_SERVICE_ID"]

Replace YOUR_SERVICE_ID with the actual Service ID from Zoho Bookings.

Folder Structure

zoho-bookings-integration/ ├── assets/ │ ├── css/ │ │ └── shadcn-styles.css │ ├── js/ │ │ └── zoho-booking-wizard.js │ └── img/ │ └── zoho-icon.png ├── includes/ │ ├── class-zoho-bookings-admin.php │ ├── class-zoho-bookings-api.php │ └── class-zoho-bookings-shortcode.php ├── templates/ │ ├── admin-settings.php │ ├── admin-services.php │ └── booking-wizard.php ├── languages/ ├── zoho-bookings.php └── readme.txt

Frequently Asked Questions

How do I find my Service ID in Zoho Bookings?

To find your Service ID:

1. Log in to your Zoho Bookings account
2. Go to "Services"
3. Select the service you want to use
4. The Service ID will be in the URL or in the service details

Can I have multiple booking forms on the same page?

Yes! You can add multiple shortcodes on the same page for different services. Each will operate independently.

Does the plugin handle timezone differences?

Yes, the plugin automatically detects the user's timezone and displays available slots in their local time. All bookings are correctly converted back to the server's timezone when submitted.

How do I customize the appearance of the booking form?

The booking form uses Tailwind CSS and shadcn-inspired UI. You can further customize the appearance by adding custom CSS to your theme.

Screenshots

1. Booking form step 1: Date and time selection
2. Booking form step 2: Contact information
3. Booking form step 3: Confirmation
4. Admin settings page
5. Service management page

Changelog

1.0.0

• Initial release

Upgrade Notice

1.0.0

Initial release

Technical Details

Zoho API Integration

The plugin connects to Zoho Bookings API to:

• Retrieve available time slots for specific services
• Book appointments in your Zoho Bookings calendar
• Handle timezone conversions automatically

Phone Number Handling

• Automatically detects the user's country based on IP address and timezone
• Formats phone numbers according to international standards
• Uses intl-tel-input library for phone validation and formatting

Timezone Support

• Detects the user's local timezone
• Converts server times to local times for display
• Handles booking submissions in the correct server timezone