8 New Features added to Thrive Themes – January 2021
Today, we're going to set the bar high.
It's 2021, and Thrive Themes isn't here to mess around. We're here to take our website building software to a whole new level, and help you get even more out of your online business.
This means some epic updates are on our development roadmap.
But we've already begun.
Last week we rolled out 8 new features to our suite of software tools, and if you read on... you're going to learn how these epic new features improve your already awesome Thrive Themes toolkit.
1. New Thrive Apprentice Lesson List Element
A good book publisher knows that a contents page is not just there to help a reader find what they're looking for...
It's there to sell the book.
Interested readers will read the cover, the blurb and then turn to the contents page to see what else the book explores.
In much the same way, a list of lessons for your online course is a vital part of any online course sales page, showing potential buyers what values lie within.
And if your online course is built with Thrive Apprentice, then the next time you open Thrive Architect to build a page, you'll find a brand new element: The Apprentice Lesson List:
This new Lesson List element borrows the ground-breaking technology behind our Post List element, and combines it with Thrive Apprentice to give you visually editable, interactive course outlines.
Take a look at this example below. Would you believe me if I told you it's a pro-designed template that automatically loaded my courses's module, chapter and lesson titles?
Well, it's true. This is how it looks out-of-the-box:
When you drop the Apprentice Lesson List element on any sales page, content area or dashboard page inside Thrive Architect, it will ask you to select from any of your existing Thrive Apprentice courses.
Once you've chosen the course you want to load, you can pick from any of our pre-designed templates:
The Main Options panel for the Apprentice Lesson List will let you choose a few simple options, including changing the course, setting a Smart Color, choosing collapse & expand behaviours, and setting a course display level.
The course display level allows you to show the entire course outline, choose a specific module, or just a single chapter.
In a matter of clicks, you can drop a beautiful outline of your online course onto any page.
But there's more....
The Apprentice Lesson List element is interactive.
If a user is logged in to your website and has access to the course, then your lesson list transforms from a static display of lesson titles... into a navigation tool that lets them go straight to their desired lesson!
Let's take a quick look at how that feature works...
How to use the 3 Lesson states:
Once you enter the edit mode on the Lesson List, you'll see a floating edit bar with a dropdown offering 3 states...
1. No Access
The 'No Access' state is what a user sees when they obviously do not have access to the course.
By default, the lesson titles are unlinked so a potential buyer on a sales page is not distracted and cannot navigate away from your page.
It reads like a simple contents page for an online course.
2. Not Completed
The 'Not Completed' state is what will be seen when a user is logged in and has access to the course, either by enrolling in a free course or purchasing a premium course through your chosen checkout system.
Should that student come across your sales page or any course outline, it would be frustrating to see lessons titles that aren't linked to the lessons. So in this case, our Apprentice Lesson List element templates are designed with hyperlinked titles and buttons prompting the visitor to get back to the course content:
3. Completed state
I'm sure you see where this is going, but the 'Completed' state is a variation on the 'Not Completed' state, providing visual feedback to the student so they can identify which lessons they have already taken.
Our templates come with a subtle change to the lesson icons and a different call to action, since we know the user would be revisiting lessons they've already seen.
What displays on the front end?
To exaggerate the differences between the 'Not Completed' and 'Completed' states, I've modified the above Apprentice Lesson List example with some new icon colors and strikethroughs, and have logged in as a test student with 3 of the 4 lessons completed.
Check out what an online course student in this situation would see:
All the titles are hyperlinked automatically, completed lessons are crossed out, and the fourth incomplete lesson is easily identified as the next one the student should complete.
Styling the Lesson List
All of our designer-made templates come with each of the 3 states pre-styled out of the box.
In other words, you don't have to configure anything if you don't want to.
But, if you decide to... then you'll start to see how powerful this element really is.
Adding Titles and Descriptions
Inside the Apprentice Lesson List element 'Edit Mode', you'll find 2 new Apprentice Elements available in the element tray: a Description and a Title element:
There are 3 drop-zones inside the lesson list: Modules, Chapters and Lessons. As you drop the description or title elements into these drop-zones, the Lesson List will intelligently load the correct information for that part of your course.
What you add to one drop-zone will automatically populate in the matching drop-zones.
Look at the image below, where I've dropped a 'Description' into the lesson drop-zone:
Notice how it has added to the second lesson as well, and both are displaying the correct descriptions for the two lessons? That's the power of dynamic text feeding through to a visual page builder.
Adding Dynamic Numbering
When we use the word 'Dynamic', it means some information is being loaded from somewhere else and will automatically update to reflect when changes are made to that information.
If you want to add a chapter number or list the number of lessons in a module, you can easily add this as dynamic text:
Once again, the dynamic text options match the drop-zone that you are editing.
This means you can easily add numbering to your lesson list just like I have in the example below.
Pretty incredible, right?
Finally, what makes this even more impressive is that the Apprentice Lesson List will auto-update to match the correct course.
That means if you change course names, lesson titles, or re-order your course content in the backend of Thrive Apprentice, the changes will automatically be reflected in any Apprentice Lesson List element on your website!
If you'd like to learn more about the specifics of this element — so you can push its limits as far as you can — then check out our new knowledge base article: How to use the Apprentice Lesson List Element.
2. New Vertical Menu
This has been one of our most requested features for some time now, and proved to be quite the technical challenge to deliver.
But we think you're going to love the new Vertical Menu variation of our Custom Menu element!
Every Custom Menu template has a Vertical variation, and vice versa. This means if you change your mind and want the other type of menu, it only takes a single click to swap its orientation:
Vertical Menus look just like the image below and are perfect for layouts with columns, sidebars or narrow areas:
When you set your menu to vertical, a few new options will become available in the main options panel.
First, there are some new alignment options:
Content Alignment sets all of your menu options to the left, center or right of the menu element.
Menu Alignment changes the whole menu's position on your page, with the 'Full' option automatically setting maximum width to 100%, meaning it will take up any available space in its parent container.
Then there are some options for the display of submenu items.
The default 'Expand Style' for a vertical menu is a toggle, meaning that submenu items will drop down underneath the parent menu item when clicked, like so:
Other options include 'Drop Right' and 'Drop Left', where your submenu items will fly out to the side and down from the parent.
Be mindful that these fly-outs can go off your page if you pick the wrong direction.
Both Vertical and Horizontal menu types also respect the hamburger menu options per screen size, meaning you can choose to display a hamburger view on mobile or tablet and the full menu on desktop.
3. New Off-Screen Sidebar
This latest feature is for you Thrive Theme Builder's out there, and it will blow your template styling options wide open.
With just a few clicks, you can now turn your simple sidebar layout into this!
The new Off-Screen Sidebar option can be found under a new Sidebar Display settings area on your Theme Builder templates.
Enabling 'Off screen' will automatically enable the sticky sidebar, open a bunch of new options and configurations, and change your template layout previewer to reflect the new look:
How to configure your off screen sidebar
Of the new options available, there are 3 worth noting...
1. Show Sidebar: Over Content vs Push Content
Again, as the name implies, you have two options for how to show your sidebar:
If you choose 'Push content', your expanded sidebar will push your page content away so that no menu items or content are covered, like this:
Whereas, if you choose 'Over Content', the sidebar will slide out over the top of your content, leaving you page unchanged but potentially hiding some content.
Notice in the image below how the Call To Action in the header has been covered.
If you do choose 'Over Content', you might want to combine it with a dark overlay on the rest of your page.
An overlay will make your sidebar unmissable while it's open, as you can see in this image below.
3. Quick Toggle Icon
If the Quick toggle icon feature is enabled, your sidebar will have a small tab with an icon on it. This toggle icon tab will open and close the sidebar when clicked by a visitor:
You can choose to set your Quick toggle icon towards the top, bottom or center of your sidebar, and in true Thrive Theme Builder style, you can change both the open and closed icons, their color and the shape of the tab:
But there's more to this feature too!
If you choose to disable the Quick toggle icon feature, how are you visitors going to get your sidebar open?
Well, on any template that has an 'Off screen' sidebar enabled, you'll have a new option available under the Animation & Action tab: 'Open/close sidebar'.
You can apply that action to anything on your page, from a Button element, to a link, to a menu item or even a Content Box element.
This is perfect when combined with our WooCommerce shop page.
Simply add a Button element on your WooCommerce shop page (above your products), set the action to 'Open/close sidebar', and then your WooCommerce filters will spring out from the side of the page when clicked!
Design Different Sidebars for Different Devices
And here's one last zinger when it comes to 'Off screen' sidebars in Thrive Theme Builder...
Unlike other WordPress themes that offer an offscreen sidebar option, Thrive Theme Builder DOES NOT force you to use the same style of sidebar across Desktop, Tablet and Mobile versions of a given theme template!
What this means is that Thrive Theme Builder allows you to assign 'Normal' sidebars for desktop versions of a theme template, but then assign 'Off screen' sidebars for Tablet & Mobile versions of that same theme template.
Just think about the sidebar design possibilities this exclusive Thrive Theme Builder feature could unlock for your website!
4. Improved Progress Bar Element
For many, many years, we've had a humble Progress Bar element.
You've seen it in your elements tray, on our landing page templates, and in multi-step opt in forms.
Progress Bars are an excellent visual tool for encouraging visitors to complete a conversion goal.
A good marketer knows that you want to focus on getting a visitor to take one simple action, but once they have, you may want to chain it to the next step.
Multi-step opt-in forms and upsell funnel pages can benefit from the inclusion of progress bars, simply because visitors are more inclined to complete all the steps in any process that they've already started.
Knowing this, it was time to give our humble Progress Bar design element a massive update...
Check out the new templates it comes with now!
Out of the box, the new Progress Bar element is massively flexible.
It comes in two different Progress Bar designs: Simple and Nodes. Let's start with the Simple Progress Bar designs...
Simple Progress Bars
With the new Progress Bar element, you can change its height, length, colors, corners, label text, position and so much more!
All the flexible options you could want are right there in the Main Options tab:
But when you go digging into the 'Advanced' tab, that's where you'll find two awesome new options.
1. Fill animation on view
With the 'Fill animation on view' toggle enabled, your Progress Bar design will animate its shift in progress as your visitor scrolls their viewport past it:
You can choose both the speed and the starting value. Let's say you have a progress bar at 50% but choose a 'Start at' value of 25%.
That means as it enters your visitor's viewport, they will see the progress bar grow from 25% to 50% at the speed you've selected, and then pause.
2. Enable Dual Progress
If your visitor is moving through a long sequence of steps, you may want to encourage them to continue by suggesting how far their progress will increase once they complete the current step.
We show this with the 'Dual Progress' feature:
Dual Progress allows you to set a second percentage value on your progress bar and set a different color for it, the result looking like this:
3. Candy Stripe Animation
Rather than finding this option under the Advanced sub-tab, you'll find it when you hover over the actual Progress Bar element in the Thrive visual editor window and click the 'Progress Bar COMPLETED' breadcrumb that appears.
With the 'Progress Bar COMPLETED' breadcrumb highlighted, you can then enter the Main Options tab to set its 'COMPLETED' color as well as toggle on a 'Candy stripe animation' for it.
That means you can show a beautiful striped animation like this with the new Progress Bar element:
Node Progress Bars
With a click, you can also swap your Progress Bar element to display 'Nodes'. Immediately, your Progress Bar will transform into this:
A Node Progress Bar is one that has icons or markers along its length, and is ideal for showing a user which steps they have completed, which have yet to come, and what they have to do right now.
You'll notice some new options jump out when you enable Nodes:
The 'Display progress labels' option will be set to 'All' by default, which means the labels next to every icon will be shown. However, on smaller screens such as a mobile, this might make your Progress Bar design look a bit cramped.
In those situations, you can set it to 'First and Last' which will hide all Node labels except the first and last, or 'Current', which will hide all labels except the one for the current step to be completed.
Adding nodes is as easy as clicking '+ Add', which will drop a new icon on your timeline.
Dig through the templates and you'll find some beautiful designs, including some that use the candy stripe animation too:
In order to support Dynamic Progress inputs, Node progress bars use the CSS state switcher (found in in the top left of the Thrive visual editor sidebar - reference the screenshot below). Be sure to set the State option to 'Normal' when styling your Progress Bar element defaults, including the label fonts, icons and icon styles:
The other two states, 'Hover' and 'Completed', will show which values of the default you are able to change depending on the progress position.
5. New Webhook Triggers in Thrive Ultimatum
Last year, we made an impressive leap forward with our scarcity plugin for WordPress, Thrive Ultimatum.
We added Active Campaign Webhook triggers for evergreen campaigns.
This meant you could trigger a countdown on your website that was unique to one specific subscriber just by sending their data from Active campaign in a webhook.
Although it's more of an advanced marketing feature, it's unbelievably powerful. Unbeatable countdown timers can boost conversions more than any other marketing strategy ever, and we know that one new feature had Thrive Ultimatum users cheering.
Now, we've rolled out support for webhook triggers with Drip, Infusionsoft, Zapier... and we've even added a Generic Webhook that can work with other 3rd party API services we've yet to integrate with.
How it works:
To use the new webhooks, start by creating an Evergreen Campaign in Thrive Ultimatum:
This is a scarcity marketing campaign that is not the same for all visitors. It is uniquely and privately triggered and uses email verification along with cookies to ensure your visitors only see their own, unique countdown.
Now enable 'Activate Lockdown' and choose 'Incoming webhook' as the trigger type. A new list of options will become available.
If you aren't an ActiveCampaign, Drip or InfusionSoft user, you might find Zapier will serve you well.
Or, if you're comfortable with configuring your own webhook, you can choose 'Generic Webhook'.
Our documentation team have put together a highly detailed knowledge base article on how to use Generic Webhooks with Thrive Ultimatum. If that sounds right for you, I recommend you check it out.
6. New One-Click Site Speed Integration: WP Rocket
Setting up the correct caching plugin for your website and hosting provider will make a huge difference to your website loading time.
But it often leads to confusing options and buttons that frankly... you don't care about.
For this reason, last year we added a Site Speed panel to Thrive Theme Builder, with one-click setups for WP Fastest Cache and W3 Total Cache.
In the latest release, we've expanded to support our first premium 3rd party caching plugin, WP Rocket.
Disclosure: This is an affiliate link, which means Thrive Themes get a small commission if you end up purchasing one of their plans. But more importantly, using our affiliate link helps us track how many people we refer. This information helps us to know which integrations are popular so we can continue integrating beneficial partnerships into our tools.
WP Rocket is one of the most highly rated caching tools available for WordPress. Yes, it costs... but many users swear by it.
We don't recommend any one specific caching plugin over another. From our own tests, we've found that the fastest is dependent on your specific configuration and tools.
However, we've been impressed with the results we've seen with WP Rocket.
If you'd like to use WP Rocket to increase your website speed, please use our affiliate link here.
7. Thrive Apprentice Access Rights Update
In this release, we've made an improvement to how you can manually edit your online course student access rights in Thrive Apprentice.
When you access the Customers tab inside the Thrive Apprentice dashboard, you'll have some new options when you click 'Edit access rights' on any user:
Once you are editing an individual customer, you'll see a list of courses they have access to with information about how they received their access.
When you want to manually remove access, it's just 2 clicks on the trash icon:
You can also easily add access to an existing customer or to a new customer you are adding to your website.
When you click to add access, you'll see checkboxes for all the courses that exist inside of Thrive Apprentice. Greyed out checkboxes refer to access that a student already has (and can only be deleted from the previous screen).
Click, save and that student now has access to the course. Easy!
In the 'Edit Customer' view, you'll also see different 'Access Type' data. It's now much easier to identify what courses a customer has access to as well as how they purchased. You can also remove their access to a given course in a matter of seconds.
8. Direct Access To The Knowledge Base
Last year, we moved our entire knowledge base to a new system and published hundreds of detailed, step-by-step articles on how to use our tools.
In an effort to help you get the most of our our tools, we've brought those knowledge base articles even closer to your editing experience.
Over the coming months, you'll start seeing tiny question mark and play button icons discretely added to the Thrive visual editor interface:
If you see one of those icons alongside a feature or option you want to understand better, give it a click and the perfect knowledge base article will load right in front of you!
If you'd like to keep it open while working on your page, just click the 'open in new tab' button and get back to work.
What do you think? Like these updates?
2021 is off to a good start here at Thrive Themes. Our team is feeling refreshed, inspired and ready to push forward with some more exciting features in upcoming releases.
But all of this begins with you.
We're reading your feature requests, your feedback, your comments and we regularly discuss how we can help your online business grow.
So please, drop us a comment below. Let us know what you think of this latest release and what you hope we'll work on next.