Frontend Dashboard

Hydra Booking is one of the best appointment booking solutions in the WordPress ecosystem. We are committed to taking booking management to the next level, transforming your WordPress site into a SaaS-like booking system.

As part of this commitment, we are excited to introduce a brand-new Hydra Booking frontend dashboard. This dashboard will function as a standalone interface, separate from the default WordPress dashboard, providing a more intuitive and streamlined experience for managing your bookings.

In this article, we’ll explore how you can use the Hydra Booking Frontend Dashboard to its full potential. We’ll walk you through its features, how to navigate it, and how to make the most of its functionalities.

Let’s dive into it.

What is a Frontend Dashboard?

The Frontend Dashboard is a modern and stylish alternative to the traditional WordPress admin panel. While it offers the same features and settings as the WordPress dashboard, it provides a more user-friendly, visually appealing, and intuitive interface for managing your bookings.

With the Frontend Dashboard, you can access all essential booking functionalities without needing to navigate through the WordPress backend, making the booking experience smoother and more efficient.

image 32 - Themefic

Hydra Booking Frontend Dashboard – All you Need to Know

Pages of Frontend Dashboard

After installing Hydra Booking (Version – ), three pages are automatically created: Hydra Dashboard, Hydra Login, and Hydra Register. These pages play a crucial role in the frontend dashboard experience, allowing users to manage bookings without accessing the WordPress backend.

image 34 - Themefic

Let’s break down each page and how it works:

Hydra Dashboard

This is the main booking management panel where hosts can view and manage their appointments, settings, and other booking-related activities. It provides a user-friendly and modern interface separate from the WordPress dashboard.

image 35 - Themefic

Hydra Login

This is the dedicated login page for hosts to access the Hydra Dashboard. Instead of using the standard WordPress login, hosts can log in through this page to maintain a streamlined experience.

image 37 - Themefic

Hydra Register

This page allows new hosts to sign up and create an account for booking management. It ensures a smooth onboarding process for customers or host members who need access to the booking system.

image 38 - Themefic

You can also change the pages according to your needs. Just you need to create a page and add your page templates (Hydra – Dashboard, Hydra – Login, Hydra – Regestration) to the newly created page. –

image 39 - Themefic

Settings of Frontend Dashboard

Before we proceed, there are a few important options and settings you need to know about.

To customize the Frontend Dashboard, navigate to Hydra Booking > Settings > Frontend Dashboard in your WordPress dashboard. This is a newly introduced option that provides various customization settings, allowing you to tailor the frontend dashboard to match your preferences and branding.

image 33 - Themefic

In this section, we’ll go through each frontend dashboard setting one by one, explaining how they work and how you can use them to customize your booking experience.

General

Once you navigate to the Frontend Dashboard option in the settings, the first section you’ll see is General Settings. This section includes several important options that allow you to customize the behavior and appearance of the frontend dashboard.

Let’s go through each option one by one to understand how they work and how you can configure them for the best experience.

Dashboard Header Logo

The Dashboard Header Logo refers to the logo displayed at the top of your Frontend Dashboard. This setting allows you to upload and customize the logo to match your branding.

You can choose any size for the header logo, ensuring it fits well within the dashboard layout. Simply upload your preferred logo, and it will appear in the dashboard header, giving your booking system a professional and personalized touch.

Here is my logo –

image 40 - Themefic

Here is the frontend dashboard view of the logo.

image 41 - Themefic
Responsive Logo

In addition to the main Dashboard Header Logo, there is also an option to upload a responsive logo. This version of the logo is specifically designed for smaller screens and mobile devices, ensuring better visibility and a cleaner look when viewed on responsive devices.

If the main logo appears too large or misaligned on mobile, the responsive logo will be used instead, providing a better user experience across all screen sizes.

Here is my settings of the logo

image 42 - Themefic

Here is the frontend view in the Dashboard. (I have tested this with the Chrome DevTools Responsive option. and device width is 1024)

image 43 - Themefic
Color Palette for Frontend

In Hydra Booking Settings, you can customize the frontend dashboard by selecting a color palette that matches your website’s design and branding.

This feature allows you to adjust dashboard colors, ensuring a seamless and visually appealing experience for your users. Whether you want to keep it minimal or add vibrant colors, you have full control over how your booking dashboard looks.

n Hydra Booking, you have two color palette options to customize the frontend dashboard: Default Palette and Custom Palette.

The Default Palette is Hydra Booking’s pre-set brand color scheme, designed for a clean and professional look. If you prefer a ready-to-use design, you can keep this as it is.

The Custom Palette allows you to personalize the dashboard colors according to your website’s branding. With this option, you can adjust the primary colors, buttons, background, and other elements to create a fully customized look.

Here I set up a custom color palette for the frontend.

image 44 - Themefic

Here is the frontend view of the color palette.

image 45 - Themefic

Signup

After configuring the General Settings, the next section in the Frontend Dashboard Settings is Signup. This section contains several options that allow you to customize the user registration process for Hydra Booking.

image 46 - Themefic
Sign Up Title

The Signup Form Title is the main heading displayed on the registration page. This title appears at the top of the Signup Form, helping users understand what the form is for.

Here is my backend setting.

image 47 - Themefic

Here is my frontend view.

image 48 - Themefic
Sign up Subtitle

The Signup Form Subtitle is the text displayed directly below the main title on the registration page. It provides additional context or instructions for users before they fill out the form.

Here is the backend setting.

image 49 - Themefic

Here is my frontend View.

image 50 - Themefic
Registration Page

This option allows you to choose or change the registration page for your Frontend Dashboard. By default, the registration page is set to Hydra – Register, but you have the flexibility to select any other page as your registration page.

If you have a custom registration page or want to use a different layout, simply select your preferred page from the dropdown menu. This ensures that users are directed to the correct registration form when signing up.

image 51 - Themefic
Redirection after Register

This option allows you to set the redirect URL or page where users will be taken after completing their registration. By default, users are redirected to the login page after signing up.

However, you have the flexibility to choose between redirecting users to a specific page or a custom URL. If you want users to land on a welcome page, dashboard, or any other section of your site, simply select the desired option.

Login

The Login Settings function similarly to the Registration Page Settings. You can customize the login page title, subtitle, and redirection settings just like you did for the signup page.

To configure the login page, simply follow the same steps outlined in the previous section for the registration settings. This ensures consistency across your Frontend Dashboard and provides users with a smooth login experience.

image 52 - Themefic

Leave a Reply

Your email address will not be published. Required fields are marked *