Crocoblock Dynamic Templates – Full Sites with Dynamic Data

Introduction

Crocoblock recently reshuffled their product plans. The suite has grown to include 18 plugins and the team believed they needed to adjust the features of each offering to reflect common usages focusing on design, e-commerce, or dynamic data. Additionally there is the option for “All-Inclusive,” which not only includes everything in the other packages, but also has some top-shelf premium “extras.” There is an annual and a lifetime All-Inclusive plan, so there are two ways to gain access to the extras. This article looks at the new Dynamic Templates extras that come with the All-Inclusive plans. Dynamic Templates take the concept of pre-designed templates to an all new level.

Video Version

Overview of All-Inclusive Extras

The Extras are available in two categories: Popup Templates and Page Templates, and there are two different sets of each.

Popup Templates

There are more than 150 ready to use popup templates that are compatible with JetPopup. These are organized into a number of different categories based on use: contact forms, countdown, content locker, subscription forms and more.

A number of addons include template libraries and even Elementor Pro has popup templates. However, these are a cut-above the typical popup template and some of them even include a modal background image.

Interactive Popup Library

The other set of popups available in the Extras collection are interactive popups. There are more than 50 interactive popup templates available. Unlike “static” popups, interactive popups include some animation that is triggered by user action.

For example, here is an interactive popup for a sale that includes a “scratch-off” feature.

In addition to scratch-off, there are peel-away, slide-reveal and click-and-go interactive popup templates. Here is a slide-reveal of a coupon code. When you mouse over Santa, the cursor turns into a double arrow, and if you hold down the mouse then you can slide the sleigh to reveal the coupon code.

Pre-Designed Templates

We are all familiar with pre-designed templates. The Extras collection currently has 47 pre-designed page templates to choose from. These also are organized by category.

These are full design pages with a number of sections that include animations and artistic elements.

Dynamic Templates

The category that really caught my attention was the “Dynamic Templates.” These are full site kits, along the lines of Elementor Pro site kits, but with a big difference. Dynamic Templates include the back-end setup so that the front-end templates have been wired up and are fully functional. This includes the Custom Post Types, custom fields, filter configurations, templates, WooCommerce, booking forms — everything.

There are currently 7 full Dynamic Templates site kits available: for a car rental site, a grand hotel site, a mini-hotel site, a doctor appointment site, a hair salon booking site, a vacation rental site, and a car dealership site.

Dynamic Template Deep Dive

I decided to take a closer look at one of these template sets to what they involve. I selected the Car Dealer Dynamic Template.

Setup and Installation

I setup a new testing site using the free Page Builder Framework theme.

To start, I only have Elementor free and the WP Reset Pro plugins installed. WP Reset is used to reset the site between tests.

To install a Dynamic Template you need to start by installing and activating the Crocoblock Wizard plugin. This is found in the downloads section of your Crocoblock account dashboard.

I downloaded and activated the plugin. I then got a screen to start the wizard.

I was prompted to enter the license key.

Then to select the installation type. I picked Full Crocoblock Installation.

I was surprised to be prompted to choose a theme. I know that the Page Builder Framework is compatible with Elementor, so I didn’t change, but clicked the “Continue with your current theme” button.

The next option was to pick the template. You can use the other tab to select a static template instead, but I want to try the CarDealer template and so I picked that.

Then there was a screen to configure plugins. I just went with the default, though I guess you can add more plugins if you know you will need them.

There was then a progress page showing the plugin installs.

Then there was a screen to pick whether to append or replace the site content with the demo content. Since I didn’t have anything else on the site I picked Replace. Note there is also the option to “skip” installing the demo content.

There was a progress screen as the sample data was imported.

Then a process started to regenerate thumbnails. This took a long time.

Finally, I got a screen that the installation wizard had completed.

Overview of the Car Dealer Site – Front-end

Looking around at the site I see that it is centered around ads for motor vehicles. There is a sign-up form to create an account. When you do then you have a subscriber account and can create an ad, which has to be approved. In your user account area there is a place for some extra profile information.

When you go to your account page then you see a summary of your ads, with a link to create a new ad.

And when you click on the New Ad page then there is a front-end form to create an ad, with a ton of information to enter and check.

Visitors to the site see a sophisticated front page. You have the ability to search by a number of parameters: price, miles, engine capacity, make, model, and brand. There is also a section for featured (VIP) ads and latest news (from posts) . These are examples of different types of front-end searches and filters.

There is a pretty cool Brands page that lists all of the brand logos. If you click on one then you go to a page that lists the ads for that brand.

There is a page where you can search listings, which is another example of multiple types of searches and filters.

Overview of the Car Dealer Site – Back-end

On the admin side, only one Custom Post Type was created, “Ads.” Ads has 5 custom taxonomies: Color, State, Models, Makes, and Types of Transport. These power many, but not all, of the front-end filters.

Looking at an ad, there are a large number of custom fields and many of them are used in the front-end for searching and filtering.

If you go to the JetEngine Post Types menu you find the Ads Custom Post Type. The fields are listed with the Custom Post Type.

Under the JetSmartFilters menu item you can see the list of 12 filters that were defined.

Most Elementor widgets use taxonomies to power the front-end filters. Crocoblock’s JetSmartFilters plugin makes it possible to define a number of other filters that are based on custom fields. Here are the settings for the Mileage filter.

There were also a number of templates that had been saved and which were used to create the pages.

Summary and Conclusions

I was surprised at how extensive the CarDealer Dynamic Template was and by the number of ads (70) that had been created to demo the functionality. I was also surprised that there was only one Custom Post Type that powered the entire site. That got me thinking about how we often over-complicate data architecture when creating sites with advanced functionality.

Looking at the Custom Post Type, custom fields, and the filters, which are the three components that make this work, it is clear that it would be pretty difficult to install and then adapt the CarDealer Dynamic Site for some other purpose. I can’t imagine going in and trying to rename fields and adjust filters. I don’t think that would work well. So, one conclusion is that these Dynamic Templates are mainly useful for real sites only if the site purpose is very closely aligned with the subject of the Dynamic Template. Also, if using a dynamic template on site for production, you may not want to install the demo data or there would be a lot of delete later.

The site was no design masterpiece. It seemed to focus on functionality. What I see from that is that this is a great source for learning how to put together a classified type of site. Toolset’s Reference Sites are the only thing comparable to this. The twelve filters defined for the searches would be good examples to see how JetSmartFilters work. So, if you don’t need a site that is closely aligned with the exact subject of these Dynamic Templates, then you can install them for reference.

Most of the other Dynamic Template sites included WooCommerce, and you would need to add some way to take payment for ads if you wanted to use this as a basis for your own classified site. The Dynamic Templates take pre-designed templates to a new level, beyond Elementor Pro’s site kits. This new addition to the Crocoblock suite is yet another high-quality feature added to the already extensive Crocoblock collection.