Campaign Management Website Development

Technology Stack

Elementor
WordPress
MySQL
JavaScript
CSS

The Client

The client owns an online campaign management platform. Businesses can purchase and integrate this platform into their existing apps to nurture and convert customers. They can use the tool to create new campaigns, send push alerts, track users, check analytics, monitor ROIs, etc. The client offers three pricing plans to make buying this tool easier for all businesses.

The Challenge

The client hired Capital Numbers to build this campaign management platform. He trusted us and wanted us to create this platform from scratch.

However, the client wanted this platform built with the Elementor page builder. The client chose Elementor over WordPress because Elementor helps make web page changes without requiring code. On the other hand, making design changes in WordPress involves code. As a non-techie, our client, therefore, preferred Elementor.

He was looking for a vendor to use the Elementor framework and make necessary customizations. This was when he got in touch with Capital Numbers.

He had us on board because we were adept with the Elementor page builder. He also chose us because we had the proficiency to override Elementor properties to customize web pages. He engaged with us to develop 12 web pages, allotting us 180 hours for the tasks.

The Solution

Looking at the unique project needs, Capital Numbers brought together one Elementor expert to take care of the frontend and one WordPress developer to handle the backend.

The client had the page graphics and content ready. So, we started using Elementor’s drag-and-drop feature to style the web pages. The drag-and-drop feature helps add themes, colors, templates, and fonts. So, we adjusted these elements as per our client’s needs. Elementor also has 90+ widgets for adding pricing tables, shortcodes, contact forms, accordions, custom blogs, etc. So, we used these widgets to make the necessary adjustments.

But there was a catch. The client had asked for specific customizations, which Elementor didn’t support. So, our backend WordPress expert had to come into play. He had to skillfully integrate custom code in the backend to reflect all customizations on the frontend interface.

For example, we designed the pricing table using custom CSS and HTML code. It wasn’t easy to overrule Elementor’s core elements to write custom code, but we did it successfully to meet our client’s needs. We created three pricing plans with customizable headings, features, and pricing data. We also used CSS code to create a feature comparison table for users to see which pricing plan is their fit. Although the table had to be lengthy and full of data, we ensured we didn't clutter the interface.

We also found that the pre-built Elementor properties would keep the blog section static. So, we overruled the existing properties and used JavaScript functions in the backend to make the blogs dynamic.

As for the database solution, we used MySQL. We chose MySQL because of its outstanding data protection and scalability.

Once we made all the integrations and customizations, we conducted thorough manual and functional tests in our local dev environment before delivering everything to our client.

Results

Overriding Elementor properties to make so many customizations was a challenge. But Capital Numbers did a great job at that. Using the Waterfall method, we completed and delivered this project before the specified time.

Here’s more on the final results.

An Effective Campaign Management Platform

Using Elementor, we built a campaign management platform that marketers can install into their apps to do the following:

Create and customize campaigns with ease.
Send hyper-personalized messages to users.
Provide dynamic updates related to nearby theater tickets, sports, etc.
Analyze footfalls to measure campaign effectiveness.
Track campaigns to determine which ads worked and which didn’t.
Monitor ROI to understand if campaigns need optimizations.
Share blog content and videos.

Well-structured Pricing Page

Our customizations have made the pricing page well-structured. For example:

We distinctly designed the three pricing plans - Lite, Professional, and Enterprise.
We made the ‘Professional’ plan slightly bigger for visitors to focus on it more.
We made the CTAs stand out for each tier to convince visitors to sign up.
We created a clear feature comparison table for visitors to compare plans better.
We included various feature options for users to see their needs.

Dynamic Blog Section

Our customizations also help show and display all blogs dynamically.

Pixel Corrections

We also made several pixel-wise color corrections to make the images high-quality.

Quick Development of 12 Web Pages

Because we had the end goal defined, we developed all 12 web pages on time.

Custom Page Styles in Elementor

We could achieve everything because we were proficient in adding custom scripts and styles in Elementor.

Editable Layouts for Future Use

Because of our work, the client can edit the following for his future use, all without writing code:

Drag and drop design elements.
Build new templates.
Arrange layouts.
Structure content.
Create tables without HTML.
Select from dozens of widgets.
Resize images and fonts.

Short and Successful Project

Although it was a small project, it heavily impacted our client because of the customizations our skilled Elementor and WordPress developers brought into the job.