Don’t Waste Your Time & Money on eBook Cover Images. Build Them with Thrive Architect Instead
Designing cover art for any online product can be a real hassle.
Hiring designers, waiting on rounds of revisions, and optimizing image resolutions and file sizes all takes time and money.
And what happens when you need to make minor modifications to images? Turns out it’s not so minor after all.
You’ll either have to pay designers again just to make the small tweaks for you or load up Photoshop to do them all yourself.
Pretty tedious, right?
Well, this post is going to save you time and money by showing you exactly how to build an attractive eBook cover in just a few minutes using nothing but Thrive Architect.
Watch Shane’s video tutorial above and read our step-by-step explanations illustrated below to learn how you can do the same in minutes on your own website.
In the video, Shane shows you how to create the following eBook cover from scratch using nothing but Thrive Architect:
The benefits of creating a “No Photoshop” design for your website instead of using an actual image is 3 fold:
- The file size is much smaller making your load times near instantaneous compared to images.
- Whenever edits or modifications are needed, you can change the text, colors and features of the design object in moments compared to the hassle required in modifying images with other tools like Photoshop.
- You get to save such designs as either Templates or Symbols in Thrive Architect making them easy to load up and reuse whenever needed across your website.
All that being said, here’s Shane’s recipe for creating the eBook cover showcased in this post.
Let’s Build an eBook Cover Design Using Thrive Architect!
Follow these steps to quickly create your own eBook cover design in Thrive Architect:
Step 1: Establish Your Background
First, you need to set the background color gradient. The color codes for this particular design are lavender (#7a8de5) and pink (#f65fd0).
To create this effect, select the linear color gradient option and set the Angle to 90 degrees in the Background Style tab of whatever parent element will be holding your eBook cover design (like a Background, Column, or Content Box element).
Background Images + Color Gradients
You can also add a background image that will be lightly visible underneath your color gradient from the Background Style tab.
To do this, click the image button, select an image from your WordPress media library, and then set the Opacity of your color gradient to 70%.
Step 2: Create Your First Content Box
Next, drop a Content Box element onto your page over the background you’ve just prepared. Center-align this content box and set its inner Padding to 20 pixels on all sides except for the bottom. Also, set the Bottom Margin to 20 pixels.
Then set its Background Style tab to solid white (#ffffff) with an Opacity of 45%. Set the width of the content box to something like 245 pixels:
Step 3: Create Your eBook Cover
Next, drag & drop a new Content Box element within the opaque white content box.
Set the gradient colors for the new content box to dark blue (#350071) and teal (#30cfd0). Place the two colors on a linear gradient with a 130 degree Angle.
Under the Layout & Position tab, set the blue content box padding to 24 pixels on every side with a negative 24 pixel margin on the bottom to make it extend out from the white content box.
Click on the blue content box Borders & Corners tab in the editor sidebar and set the two Left Corners to 5 pixels of rounding and the two Right Corners to 11 pixels of rounding. This will give the inner content box a “notebook” style look. Following that, set the Left Border to 7 pixels with a dark blue (#350071) color.
Finally, hit the Shadow sidebar tab to place a Drop Shadow at the bottom of the blue “notebook” content box. Set the drop shadow settings to: Black (#000000) at 30% Opacity, 270 degree Angle, 27 pixel Distance, 24 pixel Blur, and negative 10 pixel Spread.
The result so far should look something like this:
Step 4: Setup Your Decorative Text
With the inner blue content box selected, click its Typography tab in the sidebar and set the Font Face to Raleway (a Google font you can set at a Regular
Font Weight of 300 and 600 Bold). These font settings will be applied to the Plain Text elements you will soon insert in the content box as decorative text.
Now, insert a Divider element into your blue content box. Set its Color to white (#ffffff), Width to 1 pixel, and then dial its Opacity down to 30% to give it a thin appearance.
Next, clone the Divider element so you have two in your blue content box.
After that, insert a Plain Text element in between your two dividers to start adding decorative text.
Write “your eBook title” with hard returns where needed. Bold one of your words in the title for emphasis and set the Font Size to 46 pixels and the Line Height to 1.05.
Insert another Plain Text element in your blue content box underneath the second divider element. Type “your subheadline” and set the Font Size to 14 pixels.
Step 5: Add Your Finishing Touches
Finally, add margins to the top and bottom of your divider elements to space the text out in an appealing way.
Also, with your blue content box selected, adjust its Content Minimum Height feature (found in the Content Box Options tab of the editor sidebar) to achieve the correct “notebook” height and width proportions. Something like 225 pixels should work well for this.
If you’ve followed the steps above, you should have a new eBook cover design that looks something very similar to the example shown in Shane’s tutorial video:
FitBrand Landing Page Set Templates
If you’re really short on time and need this particular ebook design right now, it’s available to you in our Fit Brand Homepage Template in Thrive Architect.
Simply load the FitBrand Homepage template on a new WordPress page using Thrive Architect, save the design element as a template, and then load it on any page, post, or opt-in form you need using Thrive Architect’s Templates & Symbols element.
Once loaded, you can quickly modify the text, colors and features to suit your website’s needs and branding.
Now It’s Your Turn
If you followed Shane’s eBook Cover tutorial video or the step-by-step instructions in this post, it becomes clear how simple it is to build, modify and reuse cover designs for your online products.
The question is now, why aren’t you doing it?
Take a few minutes right now to go build and publish your own cover design to see for yourself.
If you have any questions or comments about this design or have requests for other design object tutorials you’d like to see, share them in the comments section below!