In the latest release of the Thrive Architect plugin, we've added a speed boosting feature for your landing pages.
Whenever you use one of our landing page templates, you can now choose whether your theme's CSS is loaded on that page or not. To discover what that means and how to make use of this feature, keep reading.
More...
Where to Find the New Option
This new feature applies to landing pages only. That means you will find it when you have Thrive Architect opened on a page that has a landing page template loaded.
Click on the Page Setup icon in the bottom bar:
Then click on "Landing Page Settings" to find the "Remove Theme CSS" checkbox:
What it Does
CSS is an acronym for cascading style sheets. CSS is all the code your browser interprets to figure out how to display a web page. As in: the style information, the information about what things look like.
Depending on what theme you use, this style information may be a lot of code. Removing this code from a landing page means that the page is leaner and that it will load faster.
Here's what you need to know about checking this option:
- By default, all of our landing pages contain all of their own style information. That means they will look and work exactly the same when the theme's CSS is no longer loaded.
- With the theme CSS removed, you can still add and edit anything in your landing pages that involves Thrive Architect elements. Anything added from the Thrive Architect editor will work just fine.
- However, if you load a short code that comes from your theme, it will not render correctly. To fix this, simply uncheck the Remove Theme CSS option.
- When editing fonts/text, the "inherit theme fonts" option won't work when the theme CSS is not being loaded.
That means there are two scenarios in which you want to uncheck this box:
- If you want to load a theme short code.
- If you want to use the "inherit theme fonts" option for text on your landing pages.
In every other case, removing the theme styles is beneficial, because it will make your pages load faster.
Over to You
What do you think of this new feature? Do you have any questions about when to use it or how it works? Let us know by leaving a comment!
This should be a good feature in speeding up the website.
Does it work with landing pages that were built using the old TCB?
Yes, this option works on such pages as well.
I look forward to testing this, Shane! Love this new feature. Any edge in page load speed is an advantage. Good for SEO and good for our site visitor experience.
Exactly! This is why I love this feature as well. 🙂
That is a small change that may have some huge effect indeed. Anything speeding up loading is a win win.
If using a thrive theme like Focus or similar can the the “load css” be permanently disabled across all pages and posts without consequences… except faster load times?
Thanks for your comment, Tony.
This option applies for a Thrive Theme exactly the same way as it does for any other theme.
Exactly what we need. Thanks Shane!
I’m glad you like this new feature, Jonas. 🙂
That’s a great enhancement — every little bit of extra speed helps!
Thank you, Tim!
Q1. How does this relate to using a child theme.
Q2. Can you not create the CSS for the short code and add it to the page independent of the theme CSS file.
Thanks for your questions, Don.
For a child theme, the option will not load any of the child theme’s CSS nor any of the theme’s CSS that is called by the child theme.
If you know the exact CSS needed for an element, you can insert that as custom CSS, yes.
Great feature! As always, Thrive Themes rocks. 🙂 I have a question for you, Shane. I think you wrote a blog post or a forum about the plugin that can help us speed our websites but I can’t find it. Can you recommend the plugin that would speed the website loading? I think many would benefit from this information. Thanks.
Hello Irena, we don’t have any current content on how to optimize a site for loading speeds, sorry. It’s something we plan to create content around later, but right now, I think you’ll have to try and find a different site with tutorials and recommendations.
I hate to say this because I love everything ThriveThemes & ActiveGrowth. But, although only have a LP with TA elements, removing the theme CSS screwed up the layout of my page totally. I’m using the Focus Blog btw.
Thank you for your comment, Harry. Please post about this in the support forum so our guys can find out what caused this problem.
Sure, I will do that!
Hi Shane, excellent! You have to develop a LeadPages to Thrive pages importer. I have tones of Leadpages and It is very difficult and time consuming to transfer everything from LP to Thrive, which is something I want to do. Regards, Hugo
Thank you for the suggestion, Hugo!
That could be incredibly difficult to do, to be honest. But it’s worth investigating, so thank you for the idea!
I aalways love your videos. One thing I notice is when I try to watch them in fullscreen, all it does is remove the background and doesn’t make the video any larger. Is that just me or does it work that way for everyone? Just curious as some of your videos it would be nice to get a closer look at what you’re doing.
Hi John,
We use YouTube for our videos, so it’s mostly out of our hands. Personally, I can watch them in full screen, no problem.
Very nice feature. I definitely will use it
Thank you, Claudemir!
Shane you’re a mind reader. I’ve been lamenting the sacrifice of speed since using Architect for my opt in pages. I just changed a page and noticed that in a paragraph/text element the font changed to my Theme’s default when I checked the Remove CSS box. That seems backwards. Not a huge issue to manually change it back but I thought I’d let you know. Looking forward to seeing my page load times come back down. Thanks!
Thank you for your feedback, Debbra! We’ll investigate this issue.
This is a great feature! 🙂
But no offence, the naming is a bit awkward.
One has to check the box -not- load the theme CSS.
That’s not logic.
From a an ergonomic and expected behaviour standpoint, it is much more clear to users to avoiding negation words, like remove, not, etc.
So: “Load them CSS” would be much more clear in this case.
(Give the checkbox a standaard check status.)
A clear description will give far less confusion, (and support questions) especially when the a user has to manage a multitude of option, like in WordPress / Thrive environment.
Hope this helps.
Best regards, Bart
Thank you for your input, Bart. I see what you mean. The reason for the UI is that loading the theme CSS is the default state. It’s what has always been the case with landing pages. So you check the box to activate the non-default, new state.
This looks great!
My question is similar to Don’s:
What if we have a child theme? Does that get loaded and could it potentially over-ride the landing page’s CSS?
thanks,
Jim
If you’re using a child theme, any CSS that the child theme loads (whether from itself or the parent theme) will be removed when you check this option.
Fantastic!!! Great job and feature!
Thank you, Heiko!
I like this idea, but after testing, images lose their mobile responsiveness.
Thank you for your feedback, Barry. We’ll take a look at this.
Does this effect Facebook pixels?
This should not affect your Facebook pixels, no.
Very nice option. Thanks!
Glad you like this new feature, Wim. 🙂
Great! What about fonts which are inherited from the theme? How will they be replaced? Thanks.
They will default to Times New Roman, like the kind of thing you see on an unstyled web page. 🙂
Is there a good way to work with Tablepress? We use a lot of tables and no way to easily migrate.
I don’t have any experience with Tablepress myself, no.
Fantastic!
Why do I need a theme at all? Can’t I just build a website landing pages. The theme just seems to be getting in the way.
I am a newbie and struggling with all these details and the theme has me most puzzled as I learn and consume so much content about your landing pages. But I think I am soon going to release my first landing pages. I am in the music business as a musician, recording artist and publisher. How can I add a single song audio player to my landing pages?
Also, how do I provide that audio free to my potential customers/clients and have it secure and not downloadable by those who are not signed up or opted in? I am connected to S3 but don’t know how to use it yet.
Still all very fuzzy but I will continue on until I get it figured out.
Thanks so much for the constant feed (via email) of your new and improved stuff. Without it I would have been uninspired enough to move to something else. I will stick with you guys. It will be very cool when I get things up and running.
A number of years ago I signed up with the worlds best indie music distributor (CDBaby.com) and they do an absolutely awesome job. Fantastic services to provide indie artists with access to most major music digital distributors. But – I need a bit more flexibility now and I need the opportunity to drive traffic with free downloads and here we are with Thrive Themes. I am holding on tight for a wild ride.
Cheers,
Thank you for your comment, Andy!
You can indeed build out a simple website using only landing pages. A theme becomes relevant when you want to have shared templates. For example, when you publish many blog posts and you want all those posts to have the same template and to have a page that lists the latest posts. This is where you need a theme.
Regarding your question about giving away an audio track, the easiest way to do so is to simply send people to a specific, hidden download page after they sign up. You can learn more about this kind of free product delivery in this post. I hope this helps!
Thanks so much Shane,
And can I embed an audio player to sample that song in the landing pages?
Thanks Shane!
You’re welcome, Victor.
Thanks Shane and the crew! An unrelated question – what do you use to shoot the videos with the zoom-out talking head? Thanks!
Hello Michael, we created a tutorial on how we create this “bubble” effect in our videos, which you can see here.
Much appreciated!
As usual – awesome!
Thank you, Amod!
Very good feature, but as you recommend us to have it checked as default, how about changing the check box into “Include Theme CSS”?
How about pages that aren’t landing pages? I looked at my start page and it didn’t have the “Exclude Theme CSS” option. Does that mean they depend on the theme and cannot be optimized?
This is an awesomem new feature, the theme CSS can some times be very big.
Hi Shane,
I like this feature and It will definitely improve the performance.
So let me know when you will release this feature.
Thanks,
Amit
Very cool! It’s these nice invisible touches and your attention to detail that make Thrive Architect awesome! As you say, I will probably use this feature turned on (don’t use theme CSS) at least 80-90% of the time!
LOVE IT!!!
I am going to do an AB test. I will have the exact same page but the only difference will be this. I am confident that I will see higher conversions. I will let you know how it goes.
Thanks for being so hands-on and in-tune to what we need and what gets us better conversions. You guys are really on top of it.
Thx
Hi Shane,
great…but one question. When I checked “Remove Theme CSS” the google fonts of my landing page template are still imported into my page:
How can I get rid of this?
Kind regards
Matthias
OMG! Thank you so much!!!!
Curiously googled if there was anything I could re: the flashing weirdness as my page loads….and BAM! Got this article. Awesomeness and much appreciated!
How to remove the CSS from Thrive Quiz?
Hello there,
I’m knew to this and not a programmer either but I like Thrive Architect as I’m leaning it (but I don’t know everything). So, in my site I have a category called “articles” where I put some of my articles. The articles are accessible from the menu under this category.
The issue:
I noticed on top of my pages just above the H1 page title, the text “Category Archives for Articles”. I tried using several WP plugins to remove/hide this text but no success.
Since I’m using Thrive Architect, what’s the way to remove or hide this line?
Thanks.