The Best Case Study Template to Get More Views and Conversions (Step-by-Step Guide)

So how ‘bout it? Are you ready to build your own client case study template with Page Blocks using the Ultimate Case Study Blueprint design? Keep scrolling...

How to Create an Amazing Case Study Template for Your Website (with No Code)

This tutorial is super easy and straightforward. By the end of it, you'll have a case study template that looks just as great as ours!

Step One: Download and Install Thrive Architect

If you want to build this amazing case study template, you'll need Thrive Architect, our top landing page builder. It takes the headache out of design work and lets you create stunning case studies (and other landing pages) by simply dragging and dropping. What you see while building is exactly what your visitors will see – no surprises when you hit publish.

When you use this plugin, you get the option to use one of our page templates to build your landing pages -- and these templates are stunning. They're also built with conversion-focus in mind, which means they're designed to get your audience to act.

These templates are just a start. The design magic starts with Thrive Architect's Page Block templates.

They make building so much easier and give you the chance to make your pages uniquely yours.

You also get a library of individual design elements you can easily add to your pages. You can add pricing tables, countdown timers, lead-generation forms, and so many more items to make your pages look and function better.

The best part? Once you've created a case study template you love, you can save the entire layout as a template (and we'll show you how). Next time you land a big client win, you'll have your case study format ready to go. Just plug in your new content and publish – what used to take days now takes minutes.

Your case studies will look amazing whether someone's reading them on a laptop or checking them out on their phone during their commute. Everything adjusts automatically, so you never have to worry about mobile viewers getting a broken layout.

You have Thrive Architect to thank for that.

Step Two: Set Up Your Page in WordPress and Thrive Architect

To get started, open your WordPress dashboard and create a new Page.

Name it something generic like “Case Study Template” (so you can one-click clone it for actual case studies once your template is finished) then save the page as a draft. After that, click the “Launch Thrive Architect” button to open the visual editor.

Select the “Completely Blank Page” option when prompted:

From there, start building your case study template by clicking the “Add A Block” button to open the Page Block Template Library:

Once the Page Block Template Library appears on screen, it’s time to select your...

Step Three: Design Your Hero Area Section

Your hero section sets the tone for your case study and gives readers an immediate snapshot of what they'll learn.

As per the Case Study Blueprint design, this template begins with an above-the-fold Hero Area that includes a:

• Benefit driven headline
• Positive and engaging quote about your business from the client
• And an authentic, eye-catching image of your client or their business

Using Thrive Architect's drag-and-drop editor, you can position these elements for maximum impact without overwhelming your visitors.

To find the right Page Block design, filter for the “Hero Area” templates in the library’s left sidebar and select one of the options that includes these elements:

Once the Page Block design loads, you can swap out demo images for photos of a client (or their business) and replace the demo text with more instructional style copy (to help prompt yourself to write good copy when crafting an actual case study):

From here you can continue on to building the next section by clicking either the “+ BLOCK” button at the bottom of the existing Page Block (shown above) or by dragging & dropping the Block element into the editor window (shown below):

Step Four: Add an Impressive Stats Section for Social Proof

The next thing to add to your case study template is an Impressive Stats section.

A well-placed stats section reinforces your case study's credibility by highlighting the measurable impact of your work.

If you filter for “Statistics” templates in the Page Blocks library, there’s a design available that was made for exactly that purpose:

Once loaded, just update the demo text as needed to give yourself the necessary instructional prompts for future case studies:

Step Five: Build the Challenge Section

This section helps readers connect with your case study by showing you truly understand the problems they're facing. Paint a clear picture of your client's situation before they worked with you.

Next, you need to add a Challenge section. Do this by filtering for “Text/Content” Page Block designs and selecting the one you feel will help you best showcase a client’s problems, goals & frustrations:

Once you replace the demo text with instructional copy, it should look something like this:

Stay focused on problems your target audience will recognize – like "Manual processes eating up 15 hours per week" or "Cart abandonment rate at 82%." Write this section from your client's perspective, using direct quotes when possible to add authenticity. Keep each challenge description brief but detailed enough to show the real impact on their business.

Step Six: Create Your Solution Section

Here's where you show your expertise in action. Break down your solution into clear, digestible parts using Thrive Architect Illustrated List template. 

Start with a brief overview of your approach, then detail the specific steps you took to solve your client's challenges. For example: "We implemented a three-part strategy focusing on email automation, checkout optimization, and customer feedback loops."

If you don’t find the design you’re looking for, click the “Filter blocks” dropdown menu (underneath the search bar of the template library’s left sidebar) and select the “Show me all the blocks!” option. This setting will make sure both your Theme Page Blocks AND the Thrive Architect Content Block templates are available to choose from.

But this only works if you're using Thrive Theme Builder as your WordPress theme.

Filter for the “Illustrated List” designs again and select the one you like best:

Once the Page Block design loads, create an attention-grabbing pattern interrupt by changing the Block element’s default white background color to one of the light accent colors from your Thrive Theme Builder brand color palette. This change of background color will visually signal to readers that they’ve entered a new landing page section and help keep them reading:

And once you replace the demo text with more relevant instructional copy, your Solutions section should look similar to this:

Step Seven: Client Testimonial Section

Now, it’s time to add a small Client Testimonial section. A powerful testimonial adds credibility to your case study by letting your client tell the story in their own words.

If you’ve been following along so far, you know the drill…

Add another Page Block to your landing page, filter for Testimonial templates and select one that looks similar to the Case Study Blueprint:

Again, you can change the Page Block template’s default white background color here with your Thrive Theme Builder brand color… this will really make your testimonials POP.

Just be aware that the default grey text color on this template won’t look very readable with certain dark brand colors — so you may need to change the text color to white if this happens.

But instead of changing each individual Text element’s font color, you should follow the Outside-In Principle and highlight the largest container (in this case the Block element), open the Typography tab in the left sidebar, and then change the font color to white there instead.

By doing it this way, all the Text elements within that particular Page Block will update together automatically:

Step Eight: Add The Results Section to Your Page

This section transforms your case study from a story into proof.

Here’s the place to show off impressive client results with graphs and charts by using some of the Page Block “Statistics” templates available. Filter for them in the Page Blocks library and select one of the options with a Heading element:

Then, if you still need to include even more graphs or charts to your Results section, add another “Statistics” template to the page and then drag and drop them into the first “Statistics” Page Block you chose. Just delete the empty Page Block this step leaves behind.

After replacing the demo text with your instructional copy, your Results section could look something like this:

Step Nine: Feel Good Results Section

The Case Study Blueprint recommends creating a “Softer, Feel Good Results” section that follows your charts and graphs.

You’ll find some interesting Page Block options to fit this purpose by filtering for the “Illustrated List” designs once again:

After you update the demo text with instructional copy, you should have a neat image-commentary section you can now use whenever you need to show off some feel good results to help better connect with your prospective clients:

Step Ten: Client Video Testimonial Section

As per the Case Study Blueprint’s design recommendations, you should do your best to acquire happy client video testimonials.

If you’re able to get such client testimonials, use one of the video “Call to Action” Page Block designs to create this next section:

From there, you can templatize the text and swap out the demo video for one of your own.

Also, because the Case Study Blueprint recommends creating a dedicated Call to Action section after the video section, delete any default Call to Action buttons included in the template you chose:

And don’t forget to scroll back up to your Hero Area section at this point so you can assign a smooth scrolling jumplink to the Button element there. Doing so will send visitors down to the testimonial video upon clicking:

Step Eleven: Call to Action Section

The most important part of any conversion focused landing page is its Call to Action section.

That’s why it’s no surprise that the Case Study Blueprint features a prominent Call to Action section immediately after the Client Video Testimonial section.

As you might expect, you can add a Call to Action Page Block design by filtering for the “Call to Action” templates and selecting the one that suits your needs best:

Now, if the default background color of a Page Block you select ever conflicts with the Page Block design above it (e.g. the Fancy Divider of the Video Testimonial section doesn’t transition well into the background color of the new Page Block below it), don’t worry because it’s easy to fix that color clash.

In this example, you can just change the background color of the new Call to Action section to white, and then open its Decorations tab so you can modify the color of its bottom Fancy Divider design to one of your brand color palette’s accent colors (shown below):

These customizations make sure that the Testimonial Video section and Call to Action section beneath it blend together naturally while preserving their Fancy Divider design flourishes.

Also, you may need to increase the pixel height of your Call to Action section’s Fancy Divider (shown in the sidebar below) so it can blend seamlessly into the next landing page section too.

After making all these customizations and replacing the demo text with instructive copy once again, you should get a good looking result like this:

Optional: Related Products or Services Section 

If it makes sense for your business, the Case Study Blueprint recommends adding a Related Products or Services section beneath your Call to Action. The best Page Block templates for this purpose are the “Product Highlight” designs. Filter for them in the Page Block Template Library and select the one you like best:

Then, make any design customizations you need to (most likely the Block element’s background color and the Button element's hover styling).

To do this, change the Block element’s background color to match the color of the Fancy Divider design above it (again, so they blend together seamlessly) followed by changing the hover styling for one of the Button elements in your related products/service Content Box (shown below):

After making these customizations, you can delete the other default related product/service Content Boxes, clone the one you already customized, and then drag & drop the clones into the empty Column elements.

You should end up with a final design for your Related Products or Services section that looks like this:

Optional: Minimal Footer

To finish off your case study template, simply add a footer to the bottom of your landing page. You can do this by highlighting the Page element in the breadcrumbs and then click on the eyeball icon within the Footer box in the left sidebar:

With that, your case study template is locked & loaded for desktop!

You only need to double check that the design you just put together displays properly for tablet and mobile devices by making small tweaks where necessary. Remember that Page Blocks are mobile responsive by default so only a few design modifications to tablet and mobile should be required.

You can do this tablet and mobile design quality control step by first clicking on the Tablet icon (at the bottom of the visual editor window), scrolling through the tablet mode to make any necessary adjustments, and then doing the same thing for mobile (by clicking on the mobile icon).

Save your work and you now have a fully functional landing page template ready to reuse over and over again for your upcoming case studies!

How To Clone Your Template for Actual Client Case Studies

When you’re ready to create an actual client case study, you just need to one-click clone the template you just built.

To do this, simply open the Pages tab in your WordPress dashboard and locate your “Case Study Template” page.

Hover your cursor over the page to see a set of options appear under its title. Click on the “Clone” option to create a copy of your template:

Now rename the clone to fit the client you’ll be featuring. From there, just open the Thrive visual editor and start replacing each section’s demo images and instructional text with appropriate content about your client.

Once that’s complete, just save your work, update the page’s backend information (e.g. the featured image, permalink, etc.) and publish your new case study!

Dynamically Display Your Published Case Studies with the Post List Element

If you end up publishing several client case studies on your website, consider showcasing them on either your homepage or a “Success Stories” silo page (maybe both!) where prospective clients are more likely to find them.

Luckily, the Post List element makes the task of dynamically displaying your latest case study pages super easy. Simply add a Post List element to a section of your homepage or use one of Thrive Theme Builder’s many silo page templates (that all prominently feature Post List elements in their designs) to create a search engine friendly “Success Stories” page in a matter of minutes.

Just use the Post List element’s advanced filtering rules to dynamically display your client case studies by clicking on the “Filter Posts” button inside the Post List tab of the left sidebar:

Once you’ve programed your Post List element to display all of your case study pages (we recommend from newest to oldest in descending sort order), save & preview your work to see how they’ll now dynamically display based on the display rules you established:

Time to Make Your Case (Study)

Yes it’s true… Page Blocks really do make it that easy to build a conversion focused client case study template — in just a couple of clicks.

They even give you the added bonus of being mobile responsive and smart color enabled straight out of the box!

So are you ready to start publishing new client winning case studies using the Page Block designs showcased in this post? Make sure to get your copies of Thrive Theme Builder and Thrive Architect.

… and leave us any questions about or design ideas you have for new design ideas in the comments section below!