Even the best website will throw a 404 error from time to time, so why not use this error to your advantage?
You might take this opportunity to entertain visitors with a humorous or quirky 404 page that really showcases your personality. Or perhaps you try to re-engage disappointed visitors by highlighting all of your website’s most important and interesting content.
You might even use your 404 page as a tool to drive conversions and secure additional sales, by offering a discount code as an apology—or even a reward for “finding” your 404 page!
In this series, our mission is to create a 404 page that people won’t mind visiting. In the first part, I showed you how to add the popular Elementor plugin to your WordPress website. We then used Elementor to quickly and easily create a 404 page using a ready-made template, before building a completely custom 404 page, without using a template.
In this follow-up post, I’ll show you how to access hundreds of 404 page designs, using Elementor and Envato Elements.
Web Design Made Easier, With Template Kits
Why restrict yourself to one template, when you can install an entire template kit?
Elementor template kits, as found on Envato Elements, are themed collections of templates that provide all the pages your website could possibly need, including the homepage, Contact Us page, blog, archive, About Us page, and much more.
If you want to mix and match, then template kits also provide stand-alone blocks that you can drag-and-drop into your page layouts, to create your own unique designs.
Template kits can take the pain out of designing and building a WordPress website. Simply choose your kit, generate all the required pages, make a few customizations, and then connect these pages together—and congratulations, you have a new website!
Alternatively, you can use template kits to enhance an existing website, by adding designs and layouts that give your website an entirely new look and feel, with minimal effort.
Envato Elements provides a wide range of professionally-designed template kits, ranging from flexible, multipurpose templates to industry-specific kits that were designed with your niche firmly in mind—whether that’s pet boarding, skin care, digital marketing, ice cream, or anything in between!
What Is Envato Elements?
Envato Elements is a monthly subscription that provides access to all the plugins and add-ons that we explore throughout this tutorial, plus more than 900,000 additional resources! Along with Elementor template kits, these include graphic templates, premium WordPress themes and plugins, stock images and video, online courses, and more!
You get unlimited, royalty-free access to all of these assets with an Elements subscription.
How to Create a 404 Page With Elementor Template Kits
In this section, I’ll show you how to create a 404 page, using the Envato template kit of your choice. Since we’re working with a full template kit, after completing this section you’ll have access to a range of complimentary templates covering all the most common webpages—perfect, if you like your new 404 page so much that you decide to extend its design to other areas of your website!
To create a 404 page using Envato Elements, first head over to the Envato Elements website.
Find the template kit that you want to use and select Download. In my screenshots I’ve opted for the KickStart template kit. You’ll be prompted to either choose a new project, or add this kit to an existing project. Then your chosen kit will download automatically.
Now log into your WordPress website.
In WordPress’ left-hand menu, select Templates > Add New and select Import Templates.
Next click Choose file and select the zip file that you just downloaded and select Import Now. After a few moments, you should see all the templates that are included in your chosen kit.
Towards the top of the screen, select Add New. Then open the Template type dropdown and select Single.
Open the Select post type dropdown and select 404 page. Give your template a unique name, and then select Create template. In the subsequent popup, click My Templates, then find Page - 404 and select its accompanying Insert button.
Elementor will now load the Kickstart 404 template.
If you’re happy with how this page looks out-of-the-box, then you can publish it immediately. However, Elements templates are easy to customize, so let’s look at a few easy changes that you can make to your 404 template.
Add Your Own Text
Elements templates such as the KickStart 404 template often include boilerplate text that you can replace with your own, custom messaging. To change any of the text in your 404 page just click to select the text that you want to update. Then, in the Elementor Panel, replace the stock text with your own messaging.
Link to Your App Store and Google Play Listings
If you have a mobile app, then the KickStart 404 template has Google Play and App Store graphics that can encourage people to download your app.
By embedding your app’s links in these images, you can drive people towards your Google Play and App Store listings:
- Click to select the image where you want to embed your link.
- In the Elementor Panel, open the Link dropdown and select Custom URL.
- Enter the URL for your app’s Google Play or App Store listing.
Repeat the above steps if your app is available on both Google Play and the Apple App Store.
Twitter, Facebook & Instagram: Adding Social Accounts
Do you have a social media following? Regardless of whether you promote your website on Facebook, Twitter, Pinterest, LinkedIn, or all of the above, you should consider adding links to all of your social media profiles.
By adding social links to your 404 page, you can gain some additional followers, while also reinforcing your brand and creating a consistent look and feel across your website.
To add social links to your 404 template, first find the Social Icons widget in the Elementor Panel. Drag and drop this widget into the section where you want to display your social media links. By default, Social Icons features the icons for Facebook, Twitter and YouTube.
To edit the social icons, select the Content tab from the Elementor panel.
If you want to remove Facebook, Twitter and/or YouTube from the default Social Links widget, then click their accompanying X icon. To add more social media icons, click Add Item.
Once you have your icons, you need to link each icon to your corresponding social media profile. In the Elementor Panel, click to expand the first social media section.
In the Link field, copy and paste the appropriate link, for example linking the Twitter icon to your website’s Twitter profile.
Rinse and repeat for every social account that you want to feature on your 404 page.
Access Hundreds of Template Kits
You can access hundreds of template kits on Envato Elements—or you can browse, preview, and import any of these templates without ever leaving your WordPress account.
If KickStart has you eager to explore additional Envato Elements Template Kits, then in this final section we'll setup the free Envato Elements WordPress plugin. Once this plugin is installed, you’ll be able to access the entire Envato library from inside your WordPress account.
To setup the Envato Elements WordPress plugin:
- In WordPress’ left-hand menu, select Plugins > Add New.
- Search for the Envato Elements–Photos & Elementor Templates plugin. When this plugin appears, select Install.
- Select Activate.
- Next, you’ll need to link this plugin to your Envato Elements subscription. In WordPress’ left-hand menu, select the new Elements item.
- In the toolbar, select Connect Elements Account.
In the subsequent tab, enter your Envato Elements username and password, and then click Sign In.
Now, whenever you’re building a webpage in the Elementor Editor, you’ll see a brand new icon: the green Envato logo.
Click this icon, and you’ll be able to browse, preview and import any template from the Envato Elementor library.
Want More 404 Page Designs? Try These 7 Template Kits
Envato Elements provides template kits for every niche, ranging from fitness, to fashion and beauty, photography, real estate and everything inbetween. However, if you’re looking for a template kit that provides a beautiful, feature-packed 404 page, then we’d recommend checking out the following 7 template kits:
1. Phoenix: A Bold and Beautiful Website Design
The Phoenix template kit boasts a distinctive, minimalist design, and its 404 page is no exception!
Phoenix’s 404 page fits seamlessly with the other templates in this kit, which are all based around a landscape photograph. This 404 page keeps things streamlined by only including a short 404 message and a Go Back link.
2. Style Your eCommerce Store, With Samex
Looking to launch an online store, using WordPress, WooCommerce and Elementor?
The Samex template kit comes packed with eCommerce-themed features, including live Ajax search, product filters, and multiple product gallery options, plus support for wishlists and Product Quick View.
The Samex template kit also provides an eye-catching 404 page.
This 404 template features a Search bar, ensuring that customers can always search your product catalog—even from your 404 page!
3. Restaurant Template: A Feature-Rich 404 Page
The foodie-themed Restaurant template kit is perfect for promoting your bar, cafe or restaurant, but would also be ideal for other areas of the hospitality industry, such as hotels and tourist attractions.
This 404 page continues the template’s distinctive yellow and olive color scheme.
In addition to the usual 404, Contact Us, and Single Post templates, the Restaurant kit also provides templates that are specifically aimed at the hospitality industry, including Book a Table and Menu templates.
4. Sell Your SEO Services, With Onum
Do you offer SEO (Search Engine Optimization) services? Maybe you’re a digital marketing agency or freelancer, or perhaps you’re an SEO specialist?
However you’re involved in the world of SEO, Onum has the templates you need to promote your services, including 8 homepage layouts, 3 header layouts and 3 footer layouts.
Of course, Onum also has a 404 page.
This 404 template reflects Onum’s distinctive blue and orange color scheme.
5. Wendy: A Multi-Store WooCommerce Theme
If you’re looking for a WooCommerce-ready template kit, then Wendy is designed specifically for WooCommerce-powered online stores.
To help convince customers to splash out on your products, Wendy provides Product Quick View and product image zoom, plus the ability to filter products based on size, color and material.
If visitors do wind up on your 404 page, then they’ll have everything they need to navigate back to your “main” website.
Wendy’s 404 page provides a link to your website’s homepage, plus a Search bar that visitors can use to browse your product catalog.
6. Start Your Own Crypto-Trading Business, With ITok
If you’re an ICO advisor, Bitcoin expert, or operate any kind of crypto-trading consultancy, then the distinctive ITok template kit is designed with your business firmly in mind.
The ITok template kit features a bold color scheme and modern design. The 404 template is distinct, but the ITok header and footer elements help tie the 404 page into the rest of the ITok template kit.
Although designed specifically for the cryptocurrency industry, ITok would also be a good fit for other digital businesses, including SEO consultancies, website design and development agencies, and digital marketers.
7. Cafe No.1: A Streamlined Hospitality Kit
Cafe No.1 is a sleek template kit that’s perfect for promoting your hospitality business, especially cafes and coffee shops! This template kit makes heavy use of header images, and its 404 page is no exception.
Since it’s aimed at the cafe, bar, and restaurant scene, it’s no surprise that the Cafe No.1 kit includes templates that are specifically designed for the hospitality industry. The Cafe No.1 template kit provides the usual About, Contact, and FAQ templates, but it also provides some unique foodie-themed templates, including Reservations, Reviews, and Menu.
Conclusion
In this article, we’ve touched on a few of the Template Kits you can add to your WordPress website, but Envato Elements has hundreds of professionally-designed templates for you to choose from.
To find out more, check out the Envato Elements website, or purchase your subscription today.
WordPressCreate Websites Fast With the Elements Plugin for WordPress
WordPress34 Reasons Envato Elements Is Great for WordPress Developers
by Jessica Thornsby via Envato Tuts+ Code
No comments:
Post a Comment