Her question: “When using Quiz Builder, is there a certain number of questions we should aim so that it is not too long or too short?”
My reply below
There are no definite answers as it really depends on your audience. But here are some general guidelines that are mostly true.
Always start with an extremely easy question with just 2 choices or a simple yes/no question. This is so that the barrier to entry is as easy as possible. Try to avoid deep subjective questions at the beginning. Make sure the answer can be clear, straightforward and not blurry (blurry = possible answers like maybe, sometimes in quiz takers heads)
Keep the second question also relatively simple. If a person is already invested in your quiz and has completed 2 questions, they are more likely to stay and complete the rest. Hence the advice to keep the first 2 questions simple.
Make sure your quiz takers don’t drop in between. This usually happens because people do not want to select wrong answers (and receive wrong results / irrelevant emails). So provide options that covers all/most of your audience. These options can be (maybe, sometimes, I don’t remember, Not sure).
I personally avoid answer-gating as much as possible. It feels like holding hostage. Instead give away result and up-sell them to join your list to receive more relevant information. But this is a personal preference.
Keep your quiz 3-7 questions. For longer quizzes, you will need to design your questions to be personalized based on previous answers. Or else they might lose interest answering a long list of generic questions.
Dear reader, please add your input to the comments section and share your quiz experiences to help others.
Dear reader, This is my first 4400-word article. I will keep adding/updating this. Bookmark this page. So if you find any editing errors, leave a comment and help me fix it, please. But, it is free of typos though and ‘Grammarly.com’ says so too.
I’ve written it so you can simply scan through without having to read the entire article. You can directly jump to sections. They are self-contained.
Also please share this article with someone who might benefit from it.
The main reason most people want their website to be redesigned with Thrive Themes is mostly for just one reason – Thrive Architect. They love the ability to make the edits for themselves and to add new pages themselves.
Your entire business’ productivity can potentially 10X or more when you switch from an old outdated setup where you have to wait for ages to make a simple change on your website.
Historically, you have always needed to ask your web developer to add new pages, or in some cases a full team – designer, developer, admin, etc. But now with the advent of modern day page builders, the game has changed. One person can totally put together a kick-ass landing page or even a full website in just a few hours.
So all you need to do is make a list of pages that you want to redesign using Thrive Architect first.
Using Multiple Page Builder Plugins
Remember this important point, just because you use Thrive Architect doesn’t mean that you cannot have other page builders installed.
And no! installing multiple page builders don’t slow down your website (at least not Elementor and Thrive Architect). Because internally, the plugin is used only if the page is built with that particular page builder plugin.
I have built multiple sites where both page builders I recommend are installed – Thrive Architect + Elementor. I have them both installed on this very site too.
Picking the right theme for using with Thrive plugins.
Good folks at Thrive Themes claim that their plugins work with all WordPress themes. Personally, I have verified that it works great with StudioPress themes or any Genesis child theme. I also recommend the Astra theme or GeneratePress. They both seem to be gaining a lot of popularity due to their speed and light-weight nature.
Two Modes of using Thrive Architect
There are two modes of using Thrive Architect to build pages.
Mode 1: From a blank canvas (without the theme header and footer), or Mode 2: From a normal page where you still have your WordPress themes’ header, footer and in some cases even sidebar.
Advantages of Mode 2: The advantage of using it with your theme’s header/footer is that the page you build will inherit the styles from your themes. This is great for building branded landing pages easily. Also, you don’t have to manually set the font, color, sizes, etc. for your text, buttons and few other elements.
Advantages of Mode 1: The advantage of building a page on a blank canvas is that it is portable. You can simply export and import it to any website and it will look the same. But you will have to manually set the styling on each page. If you use the Thrive Architect’s built-in typography settings and create a few templates/symbols for common elements, you can reduce the amount of work and make the page maintainable.
A word of advice to newbies:
Avoid setting fonts, colors, sizes manually in multiple places throughout your page. Not only does it look bad, it is complicated to process if you use too many fonts (a common amateur designer mistake), also it is hard to maintain/change.
Instead, use the typography setting inside Thrive Theme Builder and simply use one of those choices. Use a maximum of two font families if you absolutely have to do it. If you are bad at design, stick to one font family and multiple weights of the same family.
The great thing about Genesis child themes is they are easy to customize with a little knowledge of CSS and WordPress coding (enough to find and edit the child theme’s style.css) Their code is so well commented I almost cried looking at how elegant their sample child theme was.
But this advice is not for the average DIY business owner. I don’t recommend learning CSS or anything. Instead, you’re better sticking to what your theme offers and focus on your business until you have enough money to hire a professional.
Word on updating:
Do not update frequently. Unless they explicitly claim it is a security fix or something. In my experience for the last few years, never once was there a security update. Their plugins are pretty secure.
But remember that Thrive Themes’ plugins and updates are a little buggy when they update. Especially when they release new versions. They don’t test it well enough and rather release and use users feedback to fix their bugs. I hate this practice, but the company hasn’t changed its attitude towards this.
Also, you do not want to be breaking your website and fixing it all day instead of building your business.
Thrive leads
How to organize your massive list of Thrive Leads lead groups? Thrive Leads lead groups.
If not arranged properly it can give you a lot of headache down the line. You can have multiple lead groups within which you can have multiple forms of opt-ins.
Here are the shortcuts to understanding Thrive Leads lead groups
You can ONLY have one lead group active on a page. So never expect your 2-step ribbon from one lead group to appear along with your post footer opt-in from
Arrange/sort them so that the most generic ones go in the bottom and the specific ones go in the top. What do I mean by this? If you have a lead group for just 1-2 pages/posts, those should be kept above lead groups that are designed to appear site-wide or for an entire category of blog posts.
That is it! These are the two most important rules to avoid all confusions with Thrive Leads lead groups
Don’t innovate on layouts unless
Never innovate on layouts. Don’t make your users and customers think (and solve puzzles) to engage with your brand/business. If something isn’t apparent in 3 seconds then it needs improving.
The only exceptions are:
You’re building art – in any form. Perhaps it is a live installation. Maybe it is an art festival website and you want to do something to compliment the theme.
Your end-users love solving puzzles and novelty for the sake of it. Perhaps you’re building a website for a game release. Or its a website for hardcore programmers who would appreciate and enjoy a command-line interface inside the website.
In any other case where the purpose of your website is to communicate, connect, convert (and delight) your audience, puh-leeze do not innovate on layouts and make your users stare long and hard at their screens trying to figure out how to use the fancy new website.
“Just look at the world’s top websites from the biggest companies used by billions of people every day and generates millions in revenue through them. How many of them are complicated? How many have innovative layouts? They don’t
Pre-planning work before you start your website redesign
This part of the article applies to every type of website redesign job. It doesn’t matter if you use thrive themes or any other theme.
1) Retaining the SEO when you start your website redesign
1.1) Run a crawler/spider on your website
Okay, don’t worry. I’m not asking you to go near an actual spider. I’m scared of them and I know a lot of you are. No shaming in admitting.
A crawler is a software that can crawl through all the public pages on your website. This is important to get a list of pages that are accessible by Google and other search engines. The software outputs a huge list of all your search-engine accessible pages and all the pages linked through these pages along with technical on-page SEO details.
Important: check if your crawler can automatically read your sitemap.xml file. If you have specified non-linked pages directly on the sitemap.xml, you might have performed a manual crawl on those pages if your software doesn’t automatically detect that.
There are various elements on your website pages that communicate important data to search engines. This is usually called metadata. This is partly responsible for your search engine optimization and contributes to your website traffic.
1.2) Hunt and export all your backlinks in a list
Backlinks are simply links mentioned on various pages on the internet that point to resources on your website. These are a major part of “trust signals”. The real world analogy would be people recommending your business to other people. It is extremely valuable, builds trust and eventually translates to business revenue.
You will need a professional SEO tool to do this. The good thing is that a lot of them give you a free trial. Some of the world-famous ones are Moz Pro, Ahrefs, SEMRush, Mangools.com, etc.
Also second thing, you will need to export linking sites from google webmaster console.
These lists are important as backlinks play a big role in how your pages rank in search engines. It is very important to pay attention to your most linked pages and the metadata on them.
Also, you will need a plan to set up redirects (also called 301s) for your backlinks. This will ensure Google doesn’t see a page missing error when following various backlinks for pages that you might modify/remove.
1.3) Export important pages from Google Analytics
“Important” is subjective to each business. But as a starter, you can safely assume you will need the following for most businesses
List of pages that receive 80 percent of your entire traffic. You can do this by going to Behaviour > Site Content > All Pages and sort by sessions/users.
List of all your product pages. If you’ve set up google analytics e-commerce tracking properly, this will be available under the conversion tab.
An idea of how important mobile is for your website. It is assumed that everything is mobile now. While it is true for the majority of cases, I still come across sites where the users are primarily desktop-only. You can get this from device reports. Also if you have an e-commerce website, find out which devices your buyers use to make purchases.
Apart from this, you will need to sit and think about what other pages could be important. Because in some cases, low traffic pages might have a high revenue rate due to your visitor pathways. So you need to consider investing some time to learn how buyers, subscribers and converting visitors travel on your website.
2) Track other factors to help your redesign process
2.1) Make a list of all important private-pages
This is going to be usually manual. These are pages that are not accessible by search engines (maybe because you’ve intentionally hidden them using Yoast plugin settings, or they are meant to be accessible only by their links)
Usually, this includes pages built for your mailing list, membership content pages, or any page that can be seen only after signing-up or purchasing.
2.2) Make a list of plugins and shortcodes that are used by old pages
A lot depends on your current setup so I have explained a few setups that are very common.
If you have visual composer, make a note of all the pages that actually use visual composer. If you use a visual composer on some of your blog posts and you have a lot of blog posts, then it is going to be a bit of work to make this list.
It is very common for clients to want to get rid of plugins during a redesign. Plugins can become a living hell to update and maintain your website if setup wrong. When you want to turn off plugins or replace them, you need to take care of shortcodes supported by them.
A good way to track these down is to set up a clone of your existing website on a staging server and disable the plugins you are hoping to get rid of. Then manually check your old blog posts and pages to see if they render properly.
Not all plugins are visual. Some are used to facilitate/automate various internal operations and they will need to consider on a per-plugin basis.
Once you identify the shortcodes to get rid of, have a plan in place to re-write those parts.
2.3) Make a test plan
This might sound fancy, but you will write down the common use cases of how people use your website.
Common examples could be
Subscription flow for your website
Purchase flow for the website
Mailing list automation(s)
Course completion automation(s)
Once you have these ready, you can perform these tests on the new website at the final stage before making it live, to ensure a peaceful sleep during the night.
Thrive comments
There is a huge army of people and automated software (aka. spam bots) continuously running to invade your comments section. Also purely for their own benefit without adding any value to your website or your readers.
They are getting more and more creative every day. Take this example comment below
“I am not sure exactly, but I love the way you’ve written this article. Great work, please keep posting.”
This is a typical comment designed to stroke your ego. Cleverly kept generic so it can be left on any blog with a legit writer.
BUT, this is by a spam bot.
Why do they do this?
For a few reasons…
The most common one is for getting a link. Usually, such people clearly leave their website URL. This is so that they can have their website linked permanently from your comments section.
Even though comment links are not considered valuable for SEO, due to the nature of SEO itself the rules are not well known. In some cases, I have personally seen comment links help in SERPs of really niche pages. But it could be a coincidence.
(Nerd stuff: Comment links usually have a nofollow attribute, which makes them lot less valuable than normal backlinks)
Anyhoo.. on the other end of the spectrum though are your actual engaged readers who love to leave a comment. They add a lot of value (for other readers) with their feedback, questions, etc. to your website.
And moreover, a person who leaves a genuine comment has a higher chance of
wanting to promote your content (given an opportunity), or
wanting to buy your products or services.
This is where Thrive comments plugin comes in. My favorite feature is to simply turn off the backlinks by default. This prevents spam links from getting added, and even prevents people who are sleazy in leaving comments.
Preparing the site-wide styles
This is is perhaps the most important thing, if you want to save your time changing designs. Prepare a style-guide. Just a minimal one.
A style guide is a loose definition of a one-page guide which visually shows, how the most common elements of your website should look like. It serves as a single point of reference that everyone working on the website can go back to. It reduces the time spent on design revisions.
IMPORTANT: There is no right/wrong way to define a style guide. The elements contained can decided based on your needs. Usually if its a brand style guide, it is extensive with a lot of rules and examples.
For a website style guide, you can keep things simple to start with. And you can evolve it as you keep making changes. As a starting point, you can use the list below. List contains the basic elements you will need in a website style guide
Logo on white, black and colored backgrounds.
Typography / Fonts
Headings – H1 to H6
Paragraph text
Links
Font Weights
Font Colors
Font letter spacing
Font line spacing
Buttons – primary, secondary and outline styles
Colors – List of permitted colors
Lists
Bullet styles
Ordered and Numbered
Indents
Icons styles
The above list is just a reference. There is no hard and fast rule about what needs to go in your style guide.
But, remember to have a central style guide that is accessible to everyone who makes changes to the website. There will be times when the styles defined in the style guide isn’t sufficient. When that happens, just add the new style in this document and continue working.
When maintained well, a good style guide will
Save hours of your time
Increase sales and conversions on your website, by giving a consistent user experience to all your customers across the website (and other channels if done right)
Make the homepage first
Okay, so when you start either a new website or redesign an existing website, always make your homepage first. In fact, you can design the homepage from everything you’ve put together in your style guide.
The home page becomes a great first implementation test for your style guide. Also, you will see what works and what doesn’t. (So be ready to make changes to the style guide you made before)
A great homepage should have as many of the following elements
A great StoryBrandstyle headline about one of the following
What can you solve for your customers?
What promise do you make to your customers?
A clear bold primary call-to-action that is visually distinct and easy to spot.
A good low-risk secondary call-to-action that offers them free value in terms of content. This needs to be connected to your mailing list so you can contact them later.
A easy-to-memorize tagline below the fold that describes two things
What do you do?
Who do you do it for?
Testimonials and other social proof (certifications, awards)
Additionally, a way for them to give feedback easily (this tip is from the book – Making Websites Win). You can easily implement this with a service like hotjar.com
Building the other pages
When you start building the pages, you need to make a decision. Do you want to use Mode 1 or Mode 2 (as described above)?
My personal preference is to use Mode 2 for the following reasons
It allows less room for errors as the styles are inherited already
Thereby enables clients to create beautiful pages with design skills
I don’t have to recreate a header/footer in Thrive Architect and maintain two copies
So most general website pages will be created in Mode 2
That being said there are reasons why you might want to use it in Mode 1
When you create a template that might be used in multiple websites that belong to your business.
When you want something distinct from the website’s existing style.
You want to make use of Thrive Architect’s templates to create campaigns/automation fast. This can be webinar pages, mailing list pages, etc.
Key points to save (a lot of) time
Keep an image optimization plugin installed as early as possible. (E.g. Shortpixel, Smush, etc). This saves a lot of time, space and generates more money for your business. How? Because images are the #1 reason why websites become slow. And we often forget to optimize/resize them before uploading. Slow websites mean, lost visitors. Lost visitors mean lost revenue.
Redesign your existing pages, instead of re-creating them. This helps you retain your old permalinks (URLs) easily. Think about plugins like Yoast SEO. All those settings will also be retained. Otherwise, it would be a nightmare to record them and replicate them on the newly created pages (especially if you have a lot of them).
For more technical tips on preventing most disasters and saving time when using thrive architect, click here.
Mobile Optimization Tip
It is a shame that after all these years, they still haven’t set up a default padding/margin to make mobile optimization easy. I really hope someday they fix it.
For now, every first-timer goes through disappointment when they preview their newly built page in mobile view. It looks ugly with text touching the left and right edges of your mobile screen.
To prevent that
Always put all your content into one or more background sections
Remember to set up a left and right padding for these background sections so they automatically apply to mobile as well.
Amateurs and hobbyists do not test. If your business has customers dependent on it, you need a test plan or your visitors will be disappointed, confused and you will lose revenue/new customers. Depending on the amount of time and people available you can try to do as many things as possible from the following checklist.
Top traffic pages from google analytics
Important marketing automation pages
Pages that you think are important
All publicly crawl-able pages
Test them using your browser’s tablet and mobile simulator
Chrome
Edge
Safari
Other browsers if any is popular among your visitors (you can get this from google analytics)
Test them using the most common tablets and phones
iPads
iPhones
Top Android devices
Find most used mobile devices (again from google analytics) and test on those
Test your purchase flow pages
Test your marketing automation pages like mailing signup, confirmation nudge page, and confirmation success pages. If you have other automation like webinars, test those pages too.
2) Get performance benchmarks
Get an idea of how well your new website performs. Remember that you will still test using a staging server so things won’t be as fast as the production server. But some web hosting companies help you temporarily switch on optimizations on your staging so you can test.
Use the following websites to test your website
Google page speed
Pingdom
Webpage speed test
GT Metrix
These websites give you a lot of data. So you will need a professional to make sense of it. Sometimes it is not worth it to get everything higher (e.g. google page speed numbers don’t always reflect real-world effects)
Here are some basic recommendations that apply to most sites
In general, always have your pages load within 2-3 seconds to have the best user experience and not lose revenue.
Enable lazy loading for images, so the page doesn’t have to wait.
Enable script minify/combine for HTML, CSS and JS
Use a CDN to deliver most static resources. Cloudflare is a famous free CDN. MaxCDN is a paid option. A free Cloudflare account also takes care of many security threats and performance optimizations automatically.
3) Setup Google Tag Manager and Google Analytics
It’s 2019. There is no way you can survive without google tag manager and google analytics.
Google Tag Manager
The tag manager can help you save loads of time. Today every website has at least a handful of third-party code snippets inserted inside them. Esp from companies like Facebook, Google, Chatbots, Marketing platforms, etc.
Inserting and removing them can be a painful process. Some companies still have to ask a developer to insert and remove them. Not to mention testing after that.
Google tag manager makes this process so easy. You can do it all from a single portal, test before deploying within your own browser.
Google Analytics
Google analytics has become the default analytics platform whether you like it or not. If you prefer alternatives go for it. But make sure you have at least one analytics platform integrated.
Here is an odd-but-useful google analytics tip
Use the annotations feature on google analytics to note important events. Eg. new site launch, marketing campaign launch, SEO optimization activities, new backlink gain, etc. These will be overlaid on your timeline so you can understand your data changes better. For instance, if you mark your website changes, it will be easy to track when the traffic started dropping and work on reversing it to see if you can get it back.
The most important thing of all
It is your web hosting company. It can leech your productivity and revenue without even your realizing it slowly like a latent virus. A great web host will help your site load faster, assist you in times of need and help you generate a lot of revenue. The best hosting companies have so much automation and technology setup to prevent security attacks/losses and accelerate your growth.
Siteground is an extremely reliable and fast web hosting company for all businesses. This website is hosted on their servers too. I’ve been with them 2+ years now
If your business is bigger and you don’t mind paying a bit more ($35-$50 a month), then I recommend WPEngine or Kinsta. Once you try any of these guys, you’ll never want to go back. Their support is top-notch.
I have personally tested all the above web hosting companies for my clients and can vouch for them.
(Disclaimer: Siteground link is an affiliate link, as I use them too. When you click and buy their plans, I might get a small commission. But your price will be same regardless of whether you click the link or not)
Even though I don’t recommend the thrive themes’ themes, I started this website long before I learnt that. So naturally I went with the theme I liked best – Minus. I love the minimal look which puts all focus on the content. But I’ve always hated the way it looked on mobile – too narrow, too much spacing on left and right, the top text logo part alignment looked broken
Try your website on mobile too, especially the non-thrive-architect content pages.
Anyways I fixed it with a bunch of CSS and spending quite a bit of time. I think the result though minimal, is worth it and gives a better experience for mobile readers.
Below is the image showing the change and the CSS I used to fix it.
CSS to fix it
/* mobile fix for header*/
@media only screen and (max-width: 540px)
{
.wrp {
width: auto;
padding: 0px 25px;
text-align: left;
}
@media only screen and (max-width: 540px)
{
.wrp .bpd {
width: auto;
}
@media only screen and (max-width: 380px)
{
.wrp {
width: auto;
padding: 0 25px;
text-align: left;
}
@media only screen and (max-width: 380px)
{
.wrp .bpd {
width: auto;
}
@media only screen and (max-width: 380px)
{
header #logo, header #text_logo {
margin-left: 0;
}
@media only screen and (max-width: 380px)
{
header .hmn {
margin-right: 0px;
margin-top: 10px;
}
How to Use
Paste the code inside Thrive Dashboard > Theme options > Style and Layout settings > Custom CSS
Word of Warning
This isn’t the most important thing to focus on if your website is new and you are still validating your funnel/products. I have been running this site without this optimisation for long time and I still managed to gather readers/email subscribers. This can be part of improving after all important basic work is done.
Additional Tip
The above screenshots were taken in Chrome. Did you know you can mobile preview any website in Chrome?
You just have to right-click on any page first.
Select “Inspect”
In the new Inspector window that opened up, click on the tiny icon on the top-left (screenshot below)
Beginners will avoid 90% of mistakes that mess-up their new thrive architect page design… if they use this checklist.
Also aesthetically, it will prevent you from making your visuals amateur.
Are you creating page sections to hold every content on your page?
Is your page section properly sized (max 1.5x your screen height, unless in special cases you can go up to 3x).
Are you setting up a default left/right padding for every page section you create? (min. 15px recommended) This will save 80% of mobile optimising time.
Don’t use the colour control on the text directly as much as possible. Set them globally for the page in the landing page text settings (only once for H1 to H6, text and links). Then use the H1-H6 for various text you want.
When you use max-width setting under layout and positioning, make sure it’s not in % mode accidentally. If you need % mode instead of PX mode, make sure you think about how it will look when you move it inside another container, or how it might look in mobile screen.
When using anything that allows you options in % mode or PX mode, make sure it is not in % mode by accident. Think about what % mode means in various screen sizes and parent containers.
Use the Alignment setting under layout and positioning for anything other than text.
Don’t overuse bold, underline and italic set for individual text elements (a common mistake – overusing this takes away the importance/functionality of bold/italics and creates irritation for the readers).
Don’t tweak individual text font-size, line height and letter spacing, unless its absolutely essential. Control them from global landing page text settings only in most cases. This will also avoid making your page look amateur.
Don’t use custom self-hosted videos in TA video control unless it perfect 16:9 ratio. (They might fix this in the future)
Don’t over-do the text shadow effect. Unless its globally setup.
I might release a part 2 of this checklist. Ask me if you need explanations for any of the points above.
This shouldn’t come as a surprise to anyone who has done their research. Thrive themes’ themes suck.
Its hard to customise – even for basic stuff like fonts, colors, spacing. Its just bad aesthetics. But doesn’t mean its bad for conversions and for validating your ideas. But the good news is that they are making a theme builder using which you can make all type of themes.
Do you design pages in Thrive Architect from scratch?
Then I bet you hate this moment.
I’m talking about the moment when you finally finish designing, and when you test it in mobile everything looks messy. A major thing that bothers people when they test in mobile is that everything touches edge-to-edge of the screen. It looks soo ugly and broken.
I realised a small tip could save you lot of time mobile optimizing.
How do we prevent this?
Never have any element that is not inside a background section (ref screenshot below). Its simply good practice to have a parent container for your content. Beware of not putting everything in a single background section. Especially for long form sales pages (if you make any of those).I recommend a background section to be maximum of 1-2 screen scrolls in height. If that was confusing, let me try rephrasing that – If your page is long, make sure each background section within isn’t too tall/long. What I mean by too tall/long is a background section cannot be more than 2 times your screen height.
Every background section must have 15 to 30 px padding on left and right side (ref screenshot below). This has to be set in the beginning, while on normal desktop mode. Keep the padding amount same on both sides obviously. Now this will apply to mobile mode automatically and most elements on the page will look good by default as they won’t touch edge-to-edge on mobile screens.
Hope this helped you Thrive Architect users out there. Let me know if you liked tips like this and if this helped. I have picked lot of time saving mini lessons like this over the last 3 years and would be glad to share if you’re interested.
