Setup
Add a Booking Form to WordPress
Add the Avenue booking form to your WordPress site with a plugin, step by step.
This guide shows how to add the Avenue booking form to your WordPress website.
Prerequisites
Before you begin, make sure you have:
- Access to your WordPress admin dashboard
- Permission to install plugins or edit existing plugin settings
- Your Avenue embed code (sent to you via email)
How It Works
The Avenue embed code is a script that needs to be added to your website's header. Once added, the booking form will appear as a floating button on your site.
There are two recommended methods depending on your setup.
Method 1: Simple Custom CSS and JS Plugin
This is the simplest method for most WordPress sites.
Step 1: Install the Plugin
- Log in to your WordPress admin dashboard and go to Plugins
- Click Add New Plugin
- In the search box, type "Simple Custom CSS and JS"
- Find the plugin and click Install Now
- Once installed, click Activate
Step 2: Add the Embed Code
- In the WordPress admin menu, go to Custom CSS & JS > All Custom Code
- Click Add HTML Code
- Delete any default template code in the editor
- Paste your Avenue embed code
- Change the title at the top to "Avenue Form"
- Click Publish
Step 3: Verify
- Click Visit Site or go to your website
- Refresh the page
- You should see the Avenue booking button appear
Method 2: Elementor Custom Code
If your site uses Elementor Pro, you can use its built-in custom code feature instead of installing an additional plugin.
Step 1: Access Custom Code
- In the WordPress admin menu, go to Elementor > Custom Code
- Click Add New
Step 2: Add the Embed Code
- Give it a title (e.g., "Avenue Form")
- Set the location to Head
- Paste your Avenue embed code in the code editor
- Under display conditions, select Entire Site
- Click Publish
Step 3: Verify
- Visit your website
- Refresh the page
- You should see the Avenue booking button appear