7 Best WordPress Themes for Gutenberg

Gutenberg is more powerful than you think. It’s not a mere editor to create blog posts. Instead, you can also use Gutenberg to create the stunning core pages of your WordPress site just like page builder plugins like Elementor and Divi Builder. However, since Gutenberg has fewer design controls, you need to use an appropriate theme to achieve more things. We have curated some of the best WordPress themes if you prefer to create pages using it instead of a page builder.

Two of the common issues when creating a page using Gutenberg are the page layout and typography controls. For instance, to create a full-width page, you need to add a new function to your theme’s functions.php file (unless your theme already has a built-in option to set a full-width layout). Also, you need to back and forth between Gutenberg and theme customizer (Appearance -> Customize) only to change the font family of the Paragraph and Heading blocks. Plugins like Kadence Blocks and Otter are there to offer more design controls if you enjoy creating a page using Gutenberg.

Unlike Elementor and Divi Builder, when creating a page using Gutenberg, the theme selection plays a vital role as it will determine the things you can apply on your design. Not all themes offer option to set the page layout. Even worse, some themes don’t even allow you to change the font of the Paragraph block, Heading block, and other text-contained blocks.

When looking for a WordPress theme for Gutenberg, you should consider the following setting options:

  • Page layout
  • Typography
  • Ability to hide page elements (title, header, footer, featured image, and soon)

Best WordPress Themes for Gutenberg

1. Kadence

Kadence is one of the best options to create a WordPress website using Gutenberg. It comes with a great companion — the Kadence Blocks plugin — to allow you achieve more with Gutenberg. Also, Kadence offers a set of ready-made templates which you can access from the theme’s settings. With Kadence theme, you can control things like page layout and hide the unneeded page elements. You can also control the typography settings, font family in particular. Useful features like breadcrumbs and back to button are also available. Kadence allows you to customize the header and footer of your site as well. You can set things like header color, transparent header, sticky header, and so on.

2. Blocksy

After installing the Blocksy theme, you will see a new icon next to the gear icon within the Gutenberg editor. You can click the icon to access the page settings whereby you can set things like page layout and enable/disable page elements. You can also enable the responsive editing by clicking the Design tab. Same as Kadence, Blocksy also offers ready-made Gutenberg templates to streamline your workflow. You need to install Blocksy Companion to access the templates. After going to the theme customizer, you will see that there are many setting options offered by Blocksy. You will see settings block dedicated to customizing the site header and site footer. On the Typography settings block, you can set the typography settings of page elements like paragraph, headings, blockquote, and button. Blocksy also has a settings block for WooCommerce whereby you can customize WooCommerce pages like checkout page, single product, and product archives.

3. GeneratePress

GenereatePress is also a great theme to create a page with Gutenberg. It also allows you to set the page layout before you start working. The typography settings are also available on the theme customizer. However, GeneratePress is not the best if you want to control other site parts like header and footer. Unless you use the pro version, GeneretePress offers no options to customize the header and footer.

4. Astra

Astra is one of the most popular free WordPress themes. It has over one million users according to a stat on WordPress.org. Astra is also a great theme to create a page with Gutenberg. The ability to set the page layout and enable/disable page elements are just two examples of the features offered by Astra. With Astra, you can control the typography settings of page elements like heading and paragraph (via theme customizer). With Astra, you can also control the appearance of the header and footer of your site thanks to its header and footer builder.

5. Page Builder Framework

Page Builder Framework is one of the best WordPress themes for Elementor. If you want to use Gutenberg instead, it is also a great option although the settings are limited. Apart from setting the page layout, there are no other settings you might want to make with Page Builder Framework due to the limitation of the setting options. Unless you use the pro version, it is impossible to change the font family of the paragraph and headings of your page.

6. Neve

Neve is a theme from ThemeIsle, the developer of Otter. So ideally, you use this theme with Otter installed on your WordPress site. Neve is one of the best options if you are looking for a Gutenberg oriented theme that offers ready-made templates. A separated plugin is required to access the ready-made templates offered by Neve. With the Neve theme active, you will see a new icon next to the gear icon inside the Gutenberg editor. Clicking the icon will open the page settings whereby you can set the page layout and disable the page elements you don’t need.

Does Neve allow you to change the fonts on your site? Yes, it does.

You can go to the theme customizer to change the fonts. You can even set the letter spacing and line heigh. The elements you can change the fonts of are paragraph (body), headings, post meta, post title, and so on. Furthermore, Neve also allows you to customize the header and footer of your website.

7. Customify

Customify is another great theme to create pages with Gutenberg. First, it allows you to set the page layout. Whether you want to create a sidebar-less page or a full-width page, you can do it with Customify. With this theme installed and activated, you will see a settings block on the Gutenberg settings panel. The settings block is aimed at setting the page layout and enabling/disabling the page elements. Second, Customify also allows you to change the fonts of the Paragraph and Heading blocks via theme customizer. Furthermore, Customify allows you to customize the header as well as the header of your WordPress site.

The Bottom Line

Despite the existence of page builder plugins, some WordPress users prefer to use Gutenberg to create pages of their websites for several reasons. The very first thing you need to do if you want to create your site pages using Gutenberg is to select the right theme. Unlike page builder plugins like Elementor and Divi Builder, Gutenberg has extremely limited design controls. To change the font of the paragraph element, for instance, you have to go to the theme customizer, while not WordPress themes offer the setting option to change the font. The ability to set the page layout is another crucial thing to consider when looking for a theme for Gutenberg.

5 Best Conference Elementor Template Kits

Template kit is a useful feature from Elementor to allow you to get a website done more quickly. You can access the default template kits offered by Elementor by going to Templates -> Kit Library on your WordPress dashboard. Don’t find the template kit you need? You can visit a website like ThemeForest to get Elementor template kits from third-party designers. If you are working a website of a conference and looking for an appropriate template kit, we have curated the best ones for you.

Best Conference Elementor Template Kits

1. Confrico

Our first recommendation of the conference Elementor template kit is Confrico. The template kit — which is available in an orange nuance — is designed specifically for conference and the similar features. Confrico is a great template kit if you accept ticket purchase via your website. There is a call-to-action button on its header which you can connect with a WooCommerce page or any page used to sell the ticket. In case you didn’t know, Elementor (the pro version) comes with a WooCommerce Builder feature to create a customized WooCommerce website. The homepage of the Confrico template comes with sections like call to action, event schedules, pricing, a section dedicated to displaying the speakers list, and so on.

  • Price: $10
  • Dependency: Elementor Pro
  • Rating: 4.5 out of 5 stars (4.5 / 5)

2. XEvent

WooCommerce is the best plugin to add an e-commerce functionality to your WordPress website. You can use if you want to sell accessories related to your conference. With Elementor Pro, you can customize the WooCommerce pages like the cart page, the checkout page, the shop page, the single product page and so on. XEvent is a WooCommerce-ready conference template kit. On the homepage of the template kit, you will find a section dedicated to displaying the WooCommerce products. XEvent itself also includes templates dedicated to WooCommerce: the single product page and the product archive page.

The XEvent template kit comes with 20 templates in total, including two homepage templates to choose from. It also offers two page templates dedicated to displaying the event schedules and two templates to display the speakers. Call-to-action buttons are available on some sections of its homepage. XEvent is created with the Hello theme from Elementor but you can import it no matter the theme you use. No need to install an extra add-on as the templates on the kit are created using Elementor only (free and pro).

  • Price: $24
  • Dependency: Elementor Pro
  • Rating: 4.6 out of 5 stars (4.6 / 5)

3. Eventico

Form Builder is one of the features available in Elementor Pro. When it comes to conference site, you can use the Elementor Form Builder to create forms like a registration form, contact form, to email opt-in form. In Eventico, there are at least two page templates that contain a form: the contact page template and registration page template. The forms on these pages are created using the Form Builder feature of Elementor. No need to install a form builder plugin anymore. You don’t even need to install any add-on to import the template kit as the templates included on the are created using Elementor only.

Eventico offers four homepage templates to choose from. Sections like speakers list, sponsors list, pricing table, and Google Maps are available on the homepage. Four useful page templates included in the list are:

  • Schedule
  • Speakers
  • Venue
  • Registration

Of course, standard page templates like about page and contact page are also included.

  • Price: $25
  • Dependency: Elementor Pro
  • Rating: 4.5 out of 5 stars (4.5 / 5)

4. Aquila

Looking for a conference Elementor template kit that offer a sticky header and off-canvas menu? Aquila is the perfect option to choose, then. It is a well-designed template kit to create a conference website just like other template kits above. The off-canvas menu offered by the template kit is created using Elementor Popup Builder. The popup template for the off-canvas menu is included in the kit. Also for the sticky header.

Aquila offers more than 25 templates in total. From page templates, Theme Builder templates, and popup templates. On the homepage, you will find sections like conference schedules, pricing table, list of speakers, and so on. Some elements on the Aquila templates are provided by DethemeKit. You need to have it installed on your website before importing the template kit. The add-on will be installed automatically if you import the template kit using Envato Elements.

  • Price: $29
  • Dependencies: Elementor Pro, DethemeKit
  • Rating: 4.4 out of 5 stars (4.4 / 5)

5. Asterin

Asterin is another option if you want to create a website with an off-canvas menu. However, it has no sticky header like Aquila above. The template kit includes 19 templates in total. One of which is the popup template for the off-canvas menu. Asterin is designed specifically for marketing conference, but you can also use it to create any type of conference with some modifications.

  • Price: $29
  • Dependency: Elementor Pro, DethemeKit
  • Rating: 4.4 out of 5 stars (4.4 / 5)

The Bottom Line

When creating a website with Elementor, you have two options to start from. First, you can start from scratch. Second, you can start from a template kit. The second option is great in two conditions: you want to get your website done more quickly or you have no idea about the design of the website. Using a template kit, you can eliminate the time-consuming steps upfront such as creating the design concept and defining the style guide. You can go to Templates -> Kit Library on your WordPress dashboard to access the default template kits created by the Elementor designer team. If you none of them suit your need, you can refer to a site like ThemeForest which has abundance collections of template kits. We have curated some of the best template kits on ThemeForest to save you time. Specifically, we curated the template kits for conference site.

9 Best Gaming Elementor Template Kits

Gaming is an evergreen industry. It’s even always evolved day by day. If you have a business in this field and eyeing global audience, the best way to achieve your goal is by creating a website. Today, it’s not required to have programming skills to create a professional-looking website. You can use a tool like Elementor which offers a visual editor. You can even use a pre-made template kit to get your website done in the matter of hours instead of weeks or even months. We have curated some of the best Elementor template kits designed specifically to create a gaming website.

New to Elementor and still unfamiliar with the term “template kit”?

An Elementor template kit is a set of templates designed specifically for a certain website type. They are created based on a design system or style guide to make sure that every element on the templates have the consistent design. Elementor itself comes with a number of template kits which you can access from Kit Library (Templates -> Kit Library). Unfortunately, there template designed specifically for gaming site found on Kit Library so that you have to look for another source.

Here are some of the best Elementor template kits to create a gaming website.

Best Gaming Elementor Template Kits

1. Lunar

Lunar is a suitable Elementor template kit to create a website of a gaming team. The template — which is created using Elementor only (Free and Pro) — comes with page templates like Team to display your team profile, Match Center to display the information about the matches (such as schedules and results), Partners to display the brands your team partners with, and so on. The Lunar template kit includes 17 templates in total. In addition to page templates, it also includes custom templates for header and footer which are created using Elementor Theme Builder.

  • Price: $24
  • Dependency: Elementor Pro
  • Rating: 4.6 out of 5 stars (4.6 / 5)

2. Esportize

If you have a gaming team and want to create a website, Esportize is another template kit you can use. The template kit is also created with Elementor Free and Elementor Pro only. No need to install an additional add-on to make all elements work after importing the templates. Esportize also has a dark nuance typical to gaming websites. It comes with 10 page templates in total, including a page to display your team profile and a page to display your sponsors.

  • Price: $29
  • Dependency: Elementor Pro
  • Rating: 4.5 out of 5 stars (4.5 / 5)

3. Assasin

Assasin has some things in common as Lunar above. First, it uses a video as the background on the hero section of its homepage. Second, it comes with a template dedicated to displaying the profile of the individual players on your team. Third, it also comes with pages dedicated to displaying your partners and event schedules. There are 10 page templates offered by Assasin in total. Also, you will get custom templates for the header and footer. The header template of Assasin has a unique enough layout with a logo lies on the center area and two menus on the left and right.

  • Price: $29
  • Dependency: Elementor Pro
  • Rating: 4.6 out of 5 stars (4.6 / 5)

4. Linx

Link also comes in a dark nuance just like other gaming template kits above. It is a suitable option to create a website of a gaming team as well. The page templates included in the template kit are pretty similar to other pages of the previous template kits. For instance, there is a page template dedicated to displaying the profile of your team, a page template dedicated to displaying the event schedules, and so on. The Link template kit offers two different homepage layouts to choose from. The total page templates included in the kit 12. Plus, you will get two custom templates. One for the custom header and another for the footer header. The template kit is created with Elementor running on Hello theme, but you can use any theme of your choice.

  • Price: $21
  • Dependency: Elementor Pro
  • Rating: 4.3 out of 5 stars (4.3 / 5)

5. Monstra

If your gaming team accepts new membership, Monstra is a suitable template you can choose. The template kit offers a template dedicated to creating a page that displays the membership information, complete with a pricing table. Overall, Monstra has the same concept as other template kits above. It comes with a Match Center page template, a Team page template, and a Sponsor page template.

  • Price: $24
  • Dependency: Elementor Pro
  • Rating: 4.4 out of 5 stars (4.4 / 5)

6. Ninja

Ninja is a well-designed gaming Elementor template kit. It is the best suited option if you have some key players on your gaming team and want to display them in the homepage. One of the notable features offered by Ninja is its navigation. In addition to the main on the header, the template kit also offers a full-screen menu. Also, you will find a tabbed section on the homepage, displaying the event schedules. Ninja also includes a template dedicated to displaying the membership information, complete with the pricing table like Monstra above. Ninja itself is created using Elementor Pro, Premium Addons, and ElementsKit Lite. Before importing the template, make sure you have installed the required add-ons first.

  • Price: $19
  • Dependency: Elementor Pro, Premium Addons, ElementsKit
  • Rating: 4.5 out of 5 stars (4.5 / 5)

7. Knight

Knight is another Elementor template kit that is built specifically for gaming team. So, if you have a gaming team and want to create website for your team, Knight is another option to consider. Knight is especially a great option if you are looking for a template kit that is built using Elementor only. The designer of this template kit used no additional add-ons, allowing you to import the template kit without installing any add-on.

  • Price: $29
  • Dependency: Elementor Pro
  • Rating: 4.3 out of 5 stars (4.3 / 5)

8. Junio

Junio is a well-designed Elementor template kit for gaming team. It offers 19 templates in total, including two homepage templates. Junio is especially a great option if you are looking for a template kit with a slider on the hero section of the homepage. The slider is created using Prime Slider, a slider plugin built exclusively for Elementor. In addition to Prime Slider, some elements on the templates are created using Elements Kit.

  • Price: $24
  • Dependency: Elementor Pro, Prime Slider, Elements Kit
  • Rating: 4.4 out of 5 stars (4.4 / 5)

9. Rhino

You can also use the Rhino template kit to create a website for your gaming team. The template kit is created using Elementor only so that you don’t need to install any add-on. Just like other the previous template kits above, Rhino also has a dark nuance with a little yellow touch. You have two homepage templates to choose from. 10 page templates are included in the kit, as well as two custom templates for the header and footer.

  • Price: $24
  • Dependency: Elementor Pro
  • Rating: 4.3 out of 5 stars (4.3 / 5)

The Bottom Line

Creating a website would be a great decision to introduce your gaming team to the world via the internet. Today, you don’t have to be a programmer to create a website. Tools like Elementor and Divi Builder exist to help you create a professional website without coding. When creating a website with Elementor, you can start from a template kit to streamline your workflow. If you specifically want to create a website for your gaming business, the Elementor template kits we mentioned above are worth considering.

4 Best Podcasting Elementor Template Kits

Podcasting has been increasingly popular these days. You have many medium options to start your podcast channel. From SoundCloud to YouTube. If you want to have a full control over your podcast materials, you can also start your podcast channel by creating a website. Elementor is one of today’s best tools to create a website. It is a page builder plugin for WordPress. Elementor allows you to create a website more quickly thanks to the available of template kits. You can read our previous article to learn more about template kit in case you are new to Elementor.

Depending on where you plan to host your audio files. If you want to host them to SoundCloud, you can use the SoundCloud widget to add your audio to an Elementor-powered page. It is (the SoundCloud widget) a native Elementor widget that you can use to add audio files from SoundCloud. You can add either an individual audio or a playlist. If you prefer to host your audio files to your own server, you can use a plugin like MP3 Music Player by Sonaar. The plugin comes with a dedicated Elementor widget aimed at adding your audio files to Elementor. Some Elementor template kits we will mention below are built using the MP3 Music Player by Sonaar plugin.

Here are some of the best Elementor template kits to create a podcasting website.

Best Podcasting Elementor Template Kits

1. Hipsound

Hipsound is one of the podcasting Elementor template kits you can consider. It has a great design dedicated specifically to creating a podcasting website. Hipsound is created with Elementor Pro and three Elementor add-ons: Premium Addons for Elementor, ElementsKit Lite, and Element Pack Lite. Before importing the template kit, you need to install these add-ons first. Or, if you import the template kit using Envato Elements, the required add-ons will be installed automatically during the importing process. Hipsound includes 15 templates in total. In addition to page templates, the kit also includes custom templates for header and footer.

  • Price: $24
  • Dependencies: Elementor Pro, Premium Addons for Elementor, ElementsKit Lite, Element Pack Lite
  • Rating: 4.6 out of 5 stars (4.6 / 5)

2. Morgan Renoud

Do you want to create a self-hosted podcasting website? If yes, Morgan Renoud is a great Elementor template kit to start from. The template kit is made ready for the MP3 Music Player by Sonaar, the plugin we mentioned in the opening section above. The designer used the free version of MP3 Music Player by Sonaar. If needed, you can use the pro version to add features like sticky player, dynamic playlist, track list view, statistic reports, and so on.

Morgan Renound is especially a great option if you are looking for an Elementor template kit that is created using Elementor only (free and pro). The designer of the template kit used no add-on when creating the template kit. If you have a Spotify or Apple Music channel, the template kit provides sections dedicated to these platforms. You just need to enter your URLs. The template kit comes with three useful page templates:

  • Podcast: To display the podcast playlists
  • Episode: To display the podcast episode
  • Our Host: To display the list of podcast hosts

In addition, the template kit also includes standard templates like the homepage, about page, and contact page. Custom templates for header, footer, and single post are also available. The template kit offers 13 templates in total.

  • Price: $21
  • Dependencies: Elementor Pro, MP3 Player by Sonaar
  • Rating: 4.5 out of 5 stars (4.5 / 5)

3. Poco

Unlike the first two template kits above, Poco is not designed for podcasters. Instead, it designed for podcasting studio. So, if you want to create a website for a podcasting studio, Poco is a great template you can consider. The template kit has a white nuance. Poco is created on the Hello theme, but you can also import it on your Elementor-powered WordPress site regardless of the theme you use. The template kit includes 15 templates.

  • Price: $29
  • Dependencies: Elementor Pro, Elementskit Lite
  • Rating: 4.4 out of 5 stars (4.4 / 5)

4. Gocast

Same as the Poco template kit above, Gocast is also not built for podcaster. Rather, it is built for an agency that helps businesses to build their brand awareness through podcast. So, if you are looking for a digital ageny Elementor template kit that specialty in podcast, Gocast is a suitable option for you. Gocast also has a light nuance like Poco above. Since the template is built for podcast agency — instead of podcaster — there are no page templates to display podcast playlist or episode like the ones offered by Morga Renoud. The template kit itself offers 10 page templates, as well as custom templates for header and footer for Elementor Pro.

  • Price: $24
  • Dependency Elementor Pro
  • Rating: 4.4 out of 5 stars (4.4 / 5)

The Bottom Line

When it comes to podcast, you have platforms like Apple Podcast, Spotify, SoundCloud, or even Google Podcast to start your channel. If you prefer to create a self-hosted podcast channel, WordPress is a great tool to create your podcasting website. Elementor is a great page builder to assist you in creating your website. It is the best page builder plugin. You can create your website from a template kit to quicken the website creation. MP3 Music Player by Sonaar is the additional plugin you need to create a self-hosted podcasting website with WordPress+Elementor. It has a dedicated Elementor widget to add your audio files, as well as an audio player to play the audio.

If you plan to host your audio files to SoundCloud instead, Elementor has a native widget — the SoundCloud widget — you can make use of. The widget can be used to embed SoundCloud audio.

We have curated some of the best Elementor template kits to create a podcasting website. If you are a podcaster, Morgan Renoud and Hipsound are two templates you can consider. If you want to create a website for a podcasting studio, Poco is the best option. Gocast is the best option if you want to create a website for a podcast agency.

How to Create a Custom WooCommerce Cart Page in Elementor 3.5 (without Add-on)

Elementor Pro comes with a WooCommerce Builder which you can use to create custom pages for WooCommerce. Before version 3.5, you could only use Elementor WooCommerce Builder to create custom templates for the following WooCommerce pages:

  • Shop page
  • Single product page
  • Product archive pages

You had to install an add-on like JetWooBuilder to create custom cart page of WooCommerce. Now with the release of Elementor Pro 3.5, you can create custom cart page of WooCommerce — as well as checkout page and My Account page without installing an add-on anymore.

How to Create a Custom WooCommerce Cart Page in Elementor

Before getting started, make sure you have updated your Elementor Pro to version 3.5 if you haven’t done so. After updating, you will see three new widgets dedicated to WooCommerce:

  • Checkout
  • Cart
  • My Account

The method to creating a custom cart page, custom checkout page, and custom My Account page is a bit different to shop page, single product page, and product archive pages. Instead of from Theme Builder, you can create custom cart page, custom checkout page, and custom My Account page by directly editing them using Elementor.

In case you didn’t know, cart page, checkout page, and My Account page were generated automatically by WooCommerce when you installed it. You can find these pages by going to Pages -> All Pages on your WordPress dashboard.

There are two options to create a custom cart page, checkout page, and My Account in Elementor 3.5:

  • By editing the existing pages
  • By creating a new page

Option 1: Editing the Existing Page

If you prefer this option, go to Pages -> All Pages on your WordPress. Select the page you want to edit (i.e., cart page) and click Edit.

On the next step, click the Edit with Elementor button to edit the page with Elementor.

Once the Elementor editor opens, remove the existing widget and add the Cart widget.

Go to the settings panel to make the settings. You can make the basic settings on the Content tab. There are five settings blocks you can open here.

  • General

You can open this block to set the layout (one column or two columns). There is also on option to set the right column sticky if you prefer the two columns layout.

  • Order Summary

You can open this block to set a custom text for the update cart button.

  • Coupon

You can open this block to set a custom text for the apply coupon button.

  • Totals

You can open this block to set the cart totals section. You can set things like the label of the cart total, custom text of the update, shipping button, custom text of the checkout button — as well as the alignments of these elements.

Once done making the settings on the Content tab, you can then go to the Style tab to style up the components of the cart page you have set above. There are six blocks you can open here:

  • Sections

You can open this block to set the background of the cart, border width, border radius, padding, and margin.

  • Typography

You can open this block to set the text color of the cart title, typography (font size, font family, font style, and so on).

  • Forms

You can open this block to style up the forms on the cart (i.e., the coupon form). You can set things like the text color, typography, background, and so on.

  • Order Summary

You can open this block to style up the order summary (product lists). There are many options you can set here. Like the typography, text color, the gap between rows, divider color and weight, remove icon color, and so on.

  • Totals

You can open this block to style up the total order column on the cart. You can set things like the gap between rows, typography, text color, divider color and weight, and so on.

  • Checkout Button

You can open this block to customize the checkout button. You can set things like button text color, typography, border radius, and so on.

Once you are done styling up the cart, you can click the UPDATE button on the bottom of the settings panel.

Option 2: Creating a New Page

If you prefer creating a new page for the WooCommerce cart page, simply go to Pages -> Add New on your WordPress dashboard to create a new page. Give your page a title and click the Edit with Elementor button to edit the page with Elementor.

Once the Elementor editor opens, you can add the Cart widget. Next, go to the settings panel to make the basic settings and the stylings just like you did on option one above. Once you are done, click the PUBLISH button to publish the page.

After the page is published, you will see a dialog popup asking whether you want to set it as your WooCommerce cart page. Simply click the Save button to set it as the WooCommerce cart page.

Changing the WooCommerce Cart Page

In the future, you might want to create a new page for WooCommerce cart page. In Elementor, you can do so from the Site Settings panel. You can access this panel from the Elementor editor, regardless of what you are doing. Whether editing a page, theme builder template, or popup template. Simply click the hamburger icon on top-left corner (on the settings panel) and select Site Settings.

Click the WooCommerce on the SETTINGS block.

Select the page you want to use as the new cart page on the Cart dropdown.

Click the UPDATE button to apply the changes.

The Bottom Line

The WooCommerce Builder feature of Elementor allows you to create a WooCommerce-based online store with your own design. Creating a WooCommerce website using Elementor offers many advantages as Elementor also comes with a popup builder to create promotional banners and support integration with some CRM and email marketing services. Previously, you could only use Elementor WooCommerce Builder to create the custom templates for the shop page, single product page, and product archive pages. Today, with the release of Elementor Pro 3.5, you can also create a custom page for the cart page, checkout page, and My Account page. This is great as you can match these pages with your brand.

How to Set a Custom Color for Individual Blog Post Title in WordPress

Most WordPress themes come with the setting options to allow you to customize the elements of the single post (blog post). From the font of the post title, font of the post body, to the color of the post title. You can make all these settings via theme customizer (Appearance -> Customize). All settings available on theme customizer are meant to entire website. If you set the text color of the blog post title, for instance, the setting will be applied to all blog posts — be it the existing blog posts or upcoming blog posts.

Is there a way to set a custom color for individual blog post title? You can achieve it with Elementor Pro.

Elementor Pro has two useful features that you can use to set custom color for individual blog posts: Dynamic Color and Theme Builder. Here is how to use these features to set custom color for individual blog posts on your WordPress site.

Step 1: Create the Custom Field for Dynamic Color

First, you need to create a custom field to select the color of the post title. You can use a custom fields plugin that supports color picker field. In this example, we use ACF. If you want to use ACF too, install the plugin and activate it right away once installed.

Once the ACF plugin installed, create a new custom fields group by going to Custom Fields -> Add New on your WordPress dashboard. Give your custom fields group a name and add a custom field by clicking the Add Field button.

Give your custom field a label and name. On the Field Type option, set to Color Picker. You can set the default color on the Default Value option.

You only need one custom field for this purpose. So, once done adding the custom field for the color picker, go to the Location section to assign the custom fields group. Make sure to assign the custom fields group to blog posts (just leave it default to assign the custom fields to blog posts). Click the Publish button to publish the custom fields group.

Step 2: Create the Custom Template for Blog Posts

The pro version of Elementor comes with a Theme Builder feature which you can use to create custom templates for your theme parts like header, footer, and single post. You can make use of this feature to create a custom template for blog posts. Elementor Theme Builder allows you to add dynamic elements, including dynamic color pulled from ACF which you have just created above.

To start creating a custom template in Elementor, go to Templates -> Theme Builder on your WordPress dashboard. On the Theme Builder page, hover your mouse over the Single Post tab and click the plus icon to add a new custom template.

You will be presented with a number pre-made custom templates on the template library. Simply select the one you like. Or, you can simply close the template library if you want to create the custom template from scratch. In this example, we use a pre-made template. You can click the INSERT button on a particular pre-made template if you want to use a pre-made template too.

Once the template is imported, select the Post Title widget to customize it.

With the Post Title widget selected, go to the Style tab on the settings panel and click the color picker on Text Color.

Click Dynamic Tags (the database icon) and select ACF Color Picker Field.

Click the wrench icon on the ACF Color Picker field and select the key (custom field) you have just created on step one above.

You have done with the dynamic post title color. You can edit other elements on your template if you want it. Once you are done, click the PUBLISH button on the bottom side of the settings panel. On the appearing dialog, you will be asked to add a display condition to set where the custom template to be assigned to. Simply click the ADD CONDITION button to add a display condition. If you want to apply the custom template to all blog posts, you can simply select Posts on the Post block. Click the SAVE & CLOSE button to publish the template.

If you are new to Elementor and have never created a custom template before, you can read our previous article for detailed instructions on how to create a custom single post template.

Step 3: Create a New Blog Post

Once the custom template for blog posts is created, the next step is to create a new blog post (or edit an existing one). To create a new blog post, go to Posts -> Add New just like usual. Give your blog post a title and write the content. Once done writing the blog post, go to the custom field section beneath the editor to select a custom color for the post title.

Once done selecting the custom color, publish/update your blog post.

The Bottom Line

You can use Elementor for free, but there are so many perks you will get by upgrading to the pro version. You can access its Theme Builder and dynamic color features. The Theme Builder of Elementor offers limitless customization options thanks to the ability to create custom templates for theme parts like single post, header, and footer. While its dynamic color allows you to add dynamic color to a certain element on your blog post or other content type.

5 Best Car Rental Elementor Template Kits

Do you have a new project to create a website of a car rental business? If you want to create the website with WordPress, Elementor is a page builder you can use to make it easier for you to create the pages of your website. Elementor comes with the necessary elements (widgets) to create a car rental website. From the Form widget to create a booking form, the Testimonial widget to display the positive feedbacks from your customers, and many other widgets. Another perk of creating a website using Elementor is that you can start from a template kit, which helps getting your website done more quickly. We have curated the best Elementor template kits designed specifically to create a car rental website.

While you can use Elementor for free, it would be so much helpful to use the pro version when creating a complex dynamic website like a car rental website. You can use its Theme Builder feature to create the custom template for the custom post type you create for the car listing items. Also, you can display the custom fields data more effortlessly as Elementor Pro has the ability to display the custom fields data.

Here are some of the best Elementor template kits to create a car rental website.

Best Car Rental Elementor Template Kits

1. RentGo

The Form widget of Elementor will play a vital role for a car rental website whereby you can use it to create the booking form. It supports form fields like date picker and time picker. However, the widget doesn’t offer the actual booking functionality. You need to handle the booking process manually. From checking the car availability, set the pickup schedules, and so on. The Form widget only offers the booking form, not the entire booking system. If you want to create a car rental website with a booking functionality, RentGo is the Elementor template kit you need.

RentGo is an Elementor template kit from Crocoblock, the developer company of JetPlugins — a set of premium Elementor add-ons. RentGo is a dynamic template kit dedicated specifically to creating a car rental website. It is made of JetPlugins family like JetBooking, JetElements, and JetEngine. JetBooking is a plugin to add a booking functionality to WordPress. RentGo itself is a well-designed template kit. It comes with necessary templates like listing page templates and listing item templates.

  • Price: Starts from $130/year
  • Dependencies: JetPlugins
  • Rating: 4.5 out of 5 stars (4.5 / 5)

2. Carrentx

If you want to create a car rental website without a booking system, Carrentx is the template kit you can consider. The template kit doesn’t even have a booking form although it is created using Elementor Pro. The catalogue page template included in the kit can be used to display the car collections offered by your car rental. Other than this page template, Carrentz also offers standard page templates like homepage, about page, contact page, and so on. Carrents is created using Elementor running on the Hello theme, but you can use it on any WordPress theme.

  • Price: $30
  • Dependency: Elementor Pro
  • Rating: 4 out of 5 stars (4 / 5)

3. CarLane

Looking for an affordable Elementor template with a booking form ready? CarLane is a great option to consider. The template kit, which is created with Elementor only (Free and Pro), allows you to create a feature-rich car rental website. In addition to booking form, the template kit also comes with image hotspots section (used to display the locations of your car rentals), car listing, other useful sections. The booking form itself is available on the homepage and a dedicated booking page. There is a call-to-action button on its header which you can link to the booking page. CarLane comes with two listing page options: one to display the cars in a grid style and another to display the cars in a list style. You have three homepage templates to choose from. There are 21 page templates included in the CarLane template kit in total. Not to mention custom templates for header and footer.

CarLane is created with Elementor Pro, Happy Addons, and Qi Addons. You need to install these add-ons before importing the template kit. If you import the template kit using Envato Elements, the required add-ons will be installed automatically during the importing process.

  • Price: $19
  • Dependencies: Elementor Pro, Happy Addons, Qi Addons
  • Rating: 4.6 out of 5 stars (4.6 / 5)

4. Rotors

Rotors is another template kit that you can use to a create car rental website with Elementor. It is particularly a great option if you are looking for an affordable template kit. You only need to spend $19 to get the template kit. If you are the owner of the AGENCY plan of Elementor pro, Rotors is the perfect item. It is created using Elementor only. No need to install a new WordPress plugin to import the template kit. Rotors comes with a booking form on its homepage. You have two homepage templates to choose from. There are two popup templates included in the Rotors template kit. One for the email opt-in form and another for the off-canvas menu.

  • Price: $19
  • Dependency: Elementor Pro
  • Rating: 4.2 out of 5 stars (4.2 / 5)

5. Lafuma

Lafuma comes with two homepage templates: one designed for car rental and another for car dealer. Also, it includes the necessary page templates like about page, contact page, testimonial page, team page, pricing page, and dealer/rental location. In addition to these core page templates, you will also get custom templates for the header and footer. Lafuma is another template kit that is created on the Hello theme although you can also use it on other WordPress themes.

  • Price: $24
  • Dependency: Elementor Pro
  • Rating: 4.3 out of 5 stars (4.3 / 5)

The Bottom Line

A template kit can quicken the website creation process with Elementor. There are a bunch of resources to get an Elementor template kit for a particular website. Add-ons like JetThemeCore, Happy Addons, and Mighty Addons also comes with template kits, but it you prefer an individual template kit, ThemeForest is the best option to go to. The template kits we mentioned above are great to consider if you plan to create a car rental website with Elementor.

How to Place Post Title Over Featured Image in WordPress (Without Coding)

Featured image and post title are two of the default elements of the WordPress blog post. The layout of these elements — along with post meta and post content — are different on each website, depending on the theme they use. Some themes might have a layout whereby the post title lies above the featured image. Is it possible to create such a layout if your theme comes with a different layout for the single post?

Every WordPress theme has a template file that controls the layout of the single post (blog post). In most cases, the file named single.php. If you have PHP knowledge, you can edit the file to change the default layout. Alternatively, you can create a custom template using a Theme Builder plugin like Divi Builder and Elementor (the pro version). These plugins allow you to create custom templates for theme parts (including single post) without coding. In other words, no PHP knowledge is required. In this article, we will show you how to create a custom template for single post and place the post title over the featured image. We use Elementor in this tutorial.

How to Place Post Title Over Featured Images in WordPress

Before getting started, make sure you have installed Elementor Pro on your WordPress website. You can get the pro version of Elementor on its official website. If you are new to Elementor, you can read our previous article to learn how to use it.

Once you are ready, go to Templates -> Theme Builder on your WordPress dashboard. On the Theme Builder page, hover your cursor over the Single Post tab and click the plus icon to create a new custom single post template.

On the appearing window, you will be presented a number of pre-made custom templates for single post. Simply select the one you like. If you want to create the custom template from scratch, you can simply close the window. In this example, we will create the template from scratch. You can click the X icon on the top-right corner to close the library window.

Once the Elementor editor opens, add a new section by clicking the plus icon on the canvas area. Select a structure according to the layout you planned. We choose the on-column structure in this example.

On the Layout settings block under the Layout tab, set the height to Min Height. This setting is not required, but it will make your featured image more visible.

Next, go to the Style tab on the settings panel. On the Background block, set the background type to Classic and click the Dynamic Tags (the database icon) on the image selector.

Select Featured Image on the appearing options.

You can set the image position and size on the setting options beneath the Featured Image field.

In order to make your post title more visible, you can also add the overlay to the featured image. To do so, open the Background Overlay block. Select the background type (classic or gradient). If you want to add a solid color for the overlay, you can select Classic and select the color you want by clicking the color picker. After selecting a color, you can set the opacity.

Once done setting the featured image, add the Post Title to the canvas area. Make sure to place it to the section where you have set the featured image as the background above.

Once the post title is added, you can go to the Style tab to style it up. You can set the text color by simply clicking the color picker on Text Color. To set the font family, font size, and font style, you can click the pencil icon on Typography.

Once done editing the post title, you can add other elements like post info, post excerpt, and breadcrumbs.

To add the post content, you can add a new section. For more detailed tutorial on how to create a custom single post template using Elementor, you can read our previous article.

Once done editing the template, you can click the PUBLISH button on the bottom side of the settings panel. On the appearing dialog, set where you want the custom template to be assigned to by clicking ADD CONDITION. You can assign the custom template to all posts, posts under certain categories, post with certain tags, posts written by a certain author and so on. If you want to assign the custom template to all blog posts, you can simply select Posts under the Posts block. Click the SAVE & CLOSE button to apply the selected display condition and to publish your custom template.

That’s it.

Here is the example of the result of this tutorial.

The Bottom Line

Theme Builder is a great solution if you want create a fully customized website with WordPress. A Theme Builder offers way more customization options than any theme does by creating custom templates (read: WordPress Theme vs Theme Builder). No need to deal with code as a Theme Builder comes with a visual editor to create the custom templates. By creating a custom template for theme parts (header, footer, single post, search results page, and so on), you can set the layout yourself, add any element you like, and apply any styling you want. Elementor and Divi Builder are two of the best Theme Builder plugins for WordPress. Whether you use Elementor or Divi Builder, creating a layout whereby the post title lies above the featured image is not a big issue.

6 Best Hotel Elementor Template Kits

Elementor Pro allows you to create a complex WordPress-based website with minimum plugins possible. If you want to create a hotel website, for instance, you can use its Theme Builder feature to create a custom template for the custom post type of the room listing item. The ability to display custom fields data makes it possible for you display additional information such as facilities (Wi-Fi, TV, gym, and so on), room parameters (area, beds, bathroom), check in time, check out time, and so on. Running out of idea about the design of website? You have template kits to start from.

What is a template kit?

In the context of Elementor, a template kit refers to a set of templates (be it page templates, popup templates, or theme builder templates) that are created using the same style guide/design system to make sure all elements on the templates have consistent stylings. For instance, if you have a button on the homepage with certain styling (say a square button with a gradient background), the buttons on other pages should also have the same stylings. Another example, the heading section on all pages should have the same typography settings.

Designers might create an Elementor without a particular style guide/design system. The point is that all elements on the templates should have the consistent design. Looking for an Elementor template kit to create a hotel website? We have curated some of the best ones. Here is the list.

Best Hotel Elementor Template Kits

1. Bristol

In general, there are two types of hotel websites. The ones with a booking functionality and the ones without a booking functionality. If you want to create the first hotel website type, Bristol is a template kit you can use. Elementor has no built-in feature to add a booking functionality. JetBooking is a great plugin to add booking functionality. It is a booking plugin from Crocoblock built exclusively for Elementor (also available for Gutenberg). Bristol is an Elementor template kit that is built using JetBooking and other Elementor add-ons from Crocoblock, including JetEngine. The template kit comes with pre-configured booking forms to allow the aspiring visitors to make a booking directly from your website. JetBooking is used to manage the bookings. It can be integrated with WooCommerce for the payment. Here are the key features offered by the Bristol template kit:

  • Single Room Page Template
  • Rooms Catalogs Template
  • Booking Functionality
  • Ajax Filtering

JetBooking is the key plugin in the Bristol template kit. You can learn more about the plugin on the official website of Crocoblock.

  • Price: Starts from $130 per year
  • Dependencies: JetPlugins
  • Rating: 4.5 out of 5 stars (4.5 / 5)

2. Mendoz

If you don’t need the booking functionality and are looking for a more affordable template kit, Mendoz can be a great option. The homepage of the template kit has a form section to find and check the availability of rooms, but it doesn’t work the way a room finder should be. When you hit the Find button, the from submission will be sent instead of displaying the available rooms. You can use the form as a manual booking form if you want it.

Mendoz itself has a beautiful enough design, with the slider on the hero section of its homepage displaying the views around the hotel. Mendoz comes with a single room page template and a listing section on its homepage to display the rooms on your hotel. Mendoz is created using Elementor only (free and pro). No need to install an add-on to import the template kit. There are 15 templates included in the kit in total, including custom templates for header, and footer.

  • Price: $19
  • Dependency: Elementor Pro
  • Rating: 4.4 out of 5 stars (4.4 / 5)

3. Resortly

As the name suggests, Resortly is an Elementor template kit designed specifically to create a resort website. You can also use it to create a website of a hotel and other lodging types. Same as Mendoz above, Resortly also has a booking section on its homepage. It even comes with a page template dedicated to creating a booking page, complete with the booking form. But again, the booking form doesn’t have a feature to check the availability of the rooms. You can only use the booking form to accept a booking whereby the availability of the rooms should be checked manually. JetBooking is a solution if you need an automated solution for this matter.

Resortly is created using Elementor Pro and DethemeKit. There are 17 templates offered by Resortly in total, including two popup templates for the email opt-in popup and off-canvas menu.

  • Price: $29
  • Dependencies: Elementor Pro, DethemeKit
  • Rating: 4.4 out of 5 stars (4.4 / 5)

4. Brooklyn Heights

The pro version of Elementor (read: Elementor Free vs Pro) comes with a Popup Builder feature. The designer of the Brooklyn Heights template kit makes use of the feature to create a booking popup, which will appear when a visitor clicks the Book a Room button on the homepage. The booking popup contains a phone number and email address a visitor can make the contact. Brooklyn Heights has a great design. It offers six homepage templates you can choose from. The template kit also offers a listing template to display the rooms offered by your hotel, as well as a custom template for the room details. You have 18 templates in total.

  • Price: $18
  • Dependency: Elementor Pro
  • Rating: 4.4 out of 5 stars (4.4 / 5)

5. Byra

Byra is another Elementor template kit that is designed specifically for hotel website. You can use it if you are looking for a template kit that is created using Elementor only. The designer of the template kit uses Elementor Free and Pro to create the templates, without involving any Elementor add-on. Byra comes with two homepage templates, a listing page for rooms, a custom template for detailed room, custom templates for header and footer, contact page, and about page.

  • Price: $24
  • Dependency: Elementor Pro
  • Rating: 4.2 out of 5 stars (4.2 / 5)

6. Hosteller

If you want to create a website of a hostel, Hosteller is a perfect template kit you can consider. Overall, the features offered by this template kit are not much different from other templates above. It also has a booking from created using the Form widget of Elementor. You will also get a listing page template, complete with the single page template for the listing items. Some pieces of information available in the single listing item are facilities (bed, AC, Wi-Fi, parking space, and so on). You might need to install ACF before importing the template kit. The Hosteller template kit is created using Hello theme, but you can import the template kit no matter the WordPress theme you use.

  • Price: $20
  • Dependency: Elementor Pro
  • Rating: 4.5 out of 5 stars (4.5 / 5)

The Bottom Line

Creating a website from a template kit has always been a great option. Whether you truly run out of idea about the design concept of your website or simply want to get your website done quicker. You can skip the time-consuming steps upfront like creating the style guide. When it comes to hotel website, Elementor has widgets like Form, Google Maps, Image Gallery, and so on which you can use to add the necessary elements to the pages of your website. Also, it comes with a Theme Builder feature which you can use to create custom templates for the listing items, theme parts (header, footer, single post, and so on). If you want to add a booking functionality, there is JetBooking to look at. If you are okay with the manual process of booking management, then Elementor Pro is enough. The template kits we curated above are great to create a WordPress-based hotel website with Elementor.

12 Best Restaurant Elementor Template Kits

No matter in which field your business is, online presence is crucial in the internet era like today. Social media alone is not enough. You need to create a website for your business to strengthen its brand. Elementor has made it easy for any business owner to create a website themselves. The best part when creating a website with Elementor is that you can start with a template kit to streamline your workflow.

Looking to create a website for your restaurant business? We have curated the best Elementor template kits you can use.

If you are new to Elementor, you can read our previous article to learn how to use it. Elementor has some useful design elements (called widgets) you can make use of to create your restaurant website. Two of which are the Price List and Google Maps. You can use the Price List widget to display your restaurant menus, complete with the prices. While for Google Maps widget, you can use it to add the map of your restaurant to make it easier for your aspiring clients to find your restaurant location.

Here are some of the Elementor template kits that you can use to create a restaurant website.

Best Restaurant Elementor Template Kits

1. Grande Cuis

Crocoblock is a well-known name in the Elementor community. It is the developer of popular Elementor add-ons like JetElelements, JetEngine, JetMenu, and JetWooBuilder. Grande Cuis is an Elementor template kit from Crocoblock that is created using its own add-ons. The template kit is designed specifically for restaurant website, which is perfect to create your restaurant website. It is very well-designed, comes with the necessary elements such as price list and menu gallery. The template kit includes a page template dedicated to creating a menu page. You can use the page to display the popular menus on your restaurant. There are also call-to-action buttons you can make use of. Grande Cuis tends to expensive. You need to spend $130 per year to use the template. The price includes the add-ons from Crocoblock, which are 18 in total.

  • Price: Starts from $130/year
  • Dependency: JetPlugins
  • Rating: 4.6 out of 5 stars (4.6 / 5)

2. Resta

Resta is a perfect template kit to create a feature-rich restaurant website. On the homepage, you will find sections like a booking form, price list, menu table, opening hours, and so on. Resta is especially a great option if you want to add an e-commerce functionality to your restaurant website. The template kit includes custom templates for WooCommerce pages such as shop page and single product page. As you know, Elementor (Elementor Pro more precisely) comes with a WooCommerce Builder feature to allow you to create custom templates for WooCommerce pages.

Other features offered by Resta include transparent header and off-canvas menu (which is created using Elementor Popup Bulder). There are 23 templates included in the template kit in total. In addition to page templates, Resta includes custom templates for header and footer, single post, WooCommerce shop page, WooCommerce single product page, and so on. Best of all, Resta is way more affordable. You can get it at only $19.

  • Price: $19
  • Dependency: Elementor Pro
  • Rating: 4.8 out of 5 stars (4.8 / 5)

3. TastyMeals

If you want to add a little natural touch to your website, TastyMeals is the template you can consider. It uses white as the base color, combined with soft green to give a natural touch. Same as Resta above, TastyMeals also comes with an off-canvas menu created with the Elementor Popup Builder. There is a call-to-action button on its header. Clicking it will open a popup containing a reservation form. Therefore, you will have two popup templates. One for reservation form and another for off-canvas menu.

  • Price: $19
  • Dependency: Elementor Pro
  • Rating: 4.4 out of 5 stars (4.4 / 5)

4. Midtown

Want to create restaurant website with an off-canvas menu? In Elementor, you can make use of its Popup Builder to create an off-canvas menu. No need to install an extra plugin to create off-canvas menu in Elementor. Midtown is another Elementor template kit that offers off-canvas menu. Next to off-canvas menu, you will see a call-to-action button which you can link to the reservation page (page template for reservation page is included, complete with the reservation form which is created with the native Form widget of Elementor). Midtown comes with a sticky, transparent header, which turn into black when you scroll down the page. Furthermore, Midtown comes with an email opt-in popup template. The total templates included in the template kit is 17.

  • Price: $29
  • Dependency: Elementor Pro
  • Rating: 4.8 out of 5 stars (4.8 / 5)

5. Lapar

Lapar means hungry in English. It is another template kit that is designed specifically to create restaurant website. It comes with 10 page templates as well as custom templates for header and footer. All elements added to the templates use the native Elementor widgets so that you don’t need to install an extra add-on to import the templates. One of the page templates included in the template kit is a reservation page.

  • Price: $24
  • Dependency: Elementor Pro
  • Rating: 4.4 out of 5 stars (4.4 / 5)

6. Ristoly

Ristoly offers two homepage templates you can choose from. Also, it offers three templates to create the menu page of your website. Other page templates included in the template kit include menu detail, about page, a page to display the chefs, FAQ, gallery and testimonials. The template kit also offers custom templates for header and footer. There are 14 templates offered by Ristoly. They are created using Elementor (Free and Pro) without involving any add-on.

  • Price: $24
  • Dependency: Elementor Pro
  • Rating: 4.5 out of 5 stars (4.5 / 5)

7. Pizzeria Trattoria

Do you want to create a website for an Italian restaurant? If yes, Pizzeria Trattoria is a great item you can consider then. The template kit is designed specifically to create an Italian restaurant website although you can also use it to create a website for any restaurant type. The template kit applies a scroll effect on its homepage. By the way, it offers two homepage templates you can choose from. There are also three templates dedicated to creating the menu page on your website. Pizzeria Trattoria also offers a template dedicated to creating a reservation page.

  • Price: $19
  • Dependency: Elementor Pro
  • Rating: 4.4 out of 5 stars (4.4 / 5)

8. Dinery

If you have a restaurant that sells local foods and want to create website, Dinery is a template kit worth-considering. Of course, you can also use the template to create a website regardless of the food types you sell. The Dinery template is created with Elementor only, no need to install an extra add-on to import all templates. Same as other template kits above, Dinery also comes with a page template dedicated to creating a reservation page. You have three templates to choose to create a gallery page. The call-to-cation button on its header can be linked to the reservation page. Or, you can also create a popup yourself if you want it.

  • Price: $19
  • Dependency: Elementor Pro
  • Rating: 4.4 out of 5 stars (4.4 / 5)

9. Burger Food Truck

As the name suggests, Burger Food Truck is designed specifically to create a burger restaurant. More specifically, it is designed for burger food truck business. The template kit includes a page template dedicated to displaying the schedules of your burger food truck. To allow aspiring buyers to learn your menus, Burger Food Trucks offers three page templates that you can use to create the menu page on your website. Also, you have two homepage templates to choose from. There are over 10 templates included in the template kit in total, including custom templates for header and footer, single post, and email opt-in popup.

  • Price: $19
  • Dependency:
  • Rating:

10. Basilia

Looking to create a website that has a sticky header? Basilia is a great template kit to consider. It has a great design aimed specifically at restaurant business. Some animation effects applied to the template kit — although not too significant — will make your website looks more alive. In addition to sticky header, the template kit also offers off-canvas menu. Some elements added to the templates of Basilia are provided by the DethemeKit add-on. In other words, you need to have this add-on installed on your WordPress site before you can import the template kit.

  • Price: $29
  • Dependency: Elementor Pro, DethemeKit
  • Rating: 4.8 out of 5 stars (4.8 / 5)

11. Lezzatos

If your restaurant sells foods from several countries, Lezzatos is a great template kit to use to create the website of your restaurant. The perfect font selection is something you will love about this template kit. There are 10 page templates offered by Lezzator, including two templates for the menu page. Plus, Lezzatos also comes with custom templates for header and footer. The homepage of Lezzatos has sections like reservation form, price list, pricing table, video, and so on.

  • Price: $29
  • Dependency: Elementor Pro
  • Rating: 4.7 out of 5 stars (4.7 / 5)

12. Cooked

Your restaurant might have promotional video that you want to add to your website. Cooked has some buttons dedicated to displaying a video in a lightbox. It also has a call-to-action button on the header which you can add an actionable link to. Cooked has no price list on its homepage, but it does offer a page template dedicated to displaying the menus of your restaurant where you can display the price list. Other page templates included in the template kit are about page, testimonials page, service page, pricing page, and gallery page. Cooked offers an interesting footer section (custom footer for template is included).

  • Price: $24
  • Dependency: Elementor Pro
  • Rating: 4.6 out of 5 stars (4.6 / 5)

The Bottom Line

Price list, reservation form, and image gallery are three of the common elements usually found on a restaurant website. In Elementor, you can add these elements — as well as other elements like video, counters, and pricing table using its native widgets. The best part of creating a website with Elementor is that you can start from a template kit to make everything get done quicker. The template kits we mentioned above are great to create a restaurant website. Elementor also comes with a WooCommerce Builder in case you want to add e-commerce functionality on your website. You can use the feature to customize your WooCommerce pages.

12 Best Medical Elementor Template Kits

Being a multipurpose page builder plugin, you can use Elementor to create any type of website. Medical is no exception. One of the advantages of creating a website with Elementor is that you don’t need to install too many plugins thanks to its huge collections of native widgets. You can add elements like form (from a contact form, marketing form, to booking form), pricing table, slider, and call to action without installing an additional WordPress plugin. Plus, you have limitless customizations thanks to the Elementor theme builder feature. Another advantage, there are a bunch of pre-made template kits to allow you getting your website done more quickly. Not just template kits offered by Elementor, but also the ones offered by third parties like ThemeForest and Crocoblock.

New to Elementor? If yes, you might haven’t familiar with the term “template kit” yet. An Elementor template kit is a set of Elementor templates created based on the same design system or style guide. Design system/style guide is created as a reference to create the templates. This helps making sure every element on the templates has the consistent stylings. A template kit is designed specifically for a certain website type. If you want to create a medical website, for instance, you can search for a template kit that is designed specifically for medical website like we will mention below.

Best Medical Elementor Template Kits

1. Medcenter

When creating a medical website using Elementor, you can make use of the Form widget to add an appointment form. However, the widget has no capability to manage the booked schedules. Instead, you need to manage the booked schedules manually. If you need an automated solution, you can use JetAppointment. It is an appointment plugin from Crocoblock developed exclusively for Elementor and Gutenberg. Medcenter is an Elementor template kit that comes with an appointment feature powered by JetAppoinment. In addition to JetAppointment, Medcenter is also created using other JetPlugins family, including JetEngine and JetElements.

The appointment feature of Medcenter allows you visitors to make an appointment with the doctors. They can select a service, doctor, and appointment schedule via a wizard that will appear when a visitor clicks a button on the header.

  • Price: Starts from $130/year
  • Dependencies: JetPlugins
  • Rating: 4.7 out of 5 stars (4.7 / 5)

2. Plasta

Plasta is another template kit from Crocoblock designed to create a medical website. Specifically, it is designed for surgery medical site. Just like Medcenter above, Plasta is also created using JetPlugins, but it has no appointment functionality yet by default. You need to configure the appointment yourself if you need the feature.

  • Price: Starts from $130/year
  • Dependencies: JetPlugins
  • Rating: 4.5 out of 5 stars (4.5 / 5)

3. Medicate

Medicate is a great option if you are looking for a more affordable solution of medical Elementor template kit. The template kit is created using Elementor Free and Elementor Pro (read: Elementor Free vs Pro) only, no need to install an additional add-on to import the templates. Medicate comes with a page template dedicated to creating an appointment page. The template contains an appointment form created using the Form widget of Elementor. But again, you can only manage the booked appointment schedules manually as Elementor has no default feature that offers automated solution for appointment. If you really need one, you can buy JetAppoinment separately at $19 per year. There are 18 templates included in the Medicate template kit. From page templates to theme builder templates.

  • Price: $29
  • Dependency: Elementor Pro
  • Rating: 4.5 out of 5 stars (4.5 / 5)

4. Gomedic

Gomedic is an Elementor template kit that has a great design. It is also designed for medical websites. Gomedic is another great item if you need an affordable solution. You can get it at only $24. Gomedic is designed using Elementor Free and Elementor Pro on Hello theme, a theme developed by Elementor. But you can also use it on any WordPress theme. Same as Medicate above, Gomedic also comes with a template dedicated to creating an appointment page whereby the page contains an appointment form creating using the native Form widget of Elementor. Gomedic includes 11 page templates as well as custom templates for header, footer, and 404 page.

  • Price: $24
  • Dependency: Elementor Pro
  • Rating: 4.7 out of 5 stars (4.7 / 5)

5. MedisCare

If you want to create a medical website using Elementor only (Free and Pro), MedisCare is a great option as the template kit is designed with Elementor only. Also, the designer used the Hello theme when designed the template kit although you can also import the template kit on your website regardless of the theme you use. MedisCare includes no appointment page template, but it does have listing page dedicated to displaying the list of doctors. There is also a template dedicated to displaying the detailed profile of each doctor. MedisCase offers 14 templates in total.

  • Price: $24
  • Dependency: Elementor Pro
  • Rating: 4.5 out of 5 stars (4.5 / 5)

6. Jovanka

Jovanka is an Elementor template kit that has a great design designed specifically for medical website. Its homepage template contains a section to allow visitors to make an appointment. There are also tables to display the operational hours of your medical clinic. Jovanka itself is created with Elementor (Free and Pro) and DethemeKit. You need to have the DethemeKit installed on your website before you can import the template kit. Alternatively, you can import the template using Envato Elements to automatically install the necessary plugins.

  • Price: $29
  • Dependencies: Elementor Pro, DethemeKit
  • Rating: 4.6 out of 5 stars (4.6 / 5)

7. Mediku

Looking for a medical Elementor template kit that offers an appointment page? Mediku is another option you can consider. It offers a page template dedicated to creating an appointment page, complete with an appointment form created using the native Form widget of Elementor. You can set the form submissions to be sent to your email or your website. Elementor has a built-in feature to manage the form submissions in case you didn’t know. The Mediku template kit itself depends on Elementor Pro, DethemeKit, and Jeg Elementor Kit. There are 11 page templates included in the kit, including an appointment page template and a static listing page to display the doctors.

  • Price: $29
  • Dependencies: Elementor Pro, DethemeKit, Jeg Elementor Kit
  • Rating: [4.3]

8. Dunmedic

Dunmedic is another great template kit to create a medical website with Elementor. It comes with the necessary page templates such as listing page to show the doctors, a page dedicated to displaying the detailed page about each doctor, an appointment page to make it easier for aspiring patients to make an appointment, and so on. Dunmedic includes 11 page templates in total. Also, it offers custom templates for single post.

  • Price: $25
  • Dependency: Elementor Pro
  • Rating: 4.4 out of 5 stars (4.4 / 5)

9. MedikAid

If you are looking for a template kit that has a map section, MedikAid is an item you can consider. Elementor has a native widget to allow you to add a map from Google Maps. You don’t need to install an add-on in order to make the map section works after you have imported the template kit. Same as other template kits above, MedikAid also comes with an appointment page template in case you want to add this page on your website. In addition to page templates, other templates included in the kit include a custom header template and a custom footer template.

  • Price: $25
  • Dependency: Elementor Pro
  • Rating: 4.4 out of 5 stars (4.4 / 5)

10. Medicale

You might want to add a timetable to make it easier for aspiring patients to learn the schedules of the doctors at the medical clinic you create the website for. Medicale offers a page template dedicated to displaying the timetable of the doctors, as well as the list of the doctors. It also offers an appointment page template just like other template kits above. All elements added to the templates use the native widgets, including the appointment form which is created using the native Form widget. In other words, you can import the template kit without needing to install an addition Elementor add-ons first.

  • Price: $24
  • Dependencies: Elementor Pro
  • Rating: 4.4 out of 5 stars (4.4 / 5)

11. The Clinic

The Clinic is a well-designed Elementor template kit to create a medical website. It has a call-to-action on the header and the footer dedicated to make an appointment. The appointment page template itself is also offered by template kit. You can simply set the link of the call-to-action button to the appointment page of your website.

  • Price: $20
  • Dependency: Elementor Pro
  • Rating: 4.4 out of 5 stars (4.4 / 5)

12. Medisa

Green is a color that is identical enough with the medical world. Medisa uses green and white as the base colors. The template kit offers a very well-designed appointment page template that contains phone number and appointment form. You can set the number into an actionable link if you want it. For instance, visitors can make a call by clicking the phone number. Medisa also comes with a listing page to display the doctors of the clinic, as well as well-designed page to display the profile of each doctor. The doctor profile page contains elements like schedules, contact information, a call-to-action button, and short intro about the doctor. Medisa offers 12 pre-made templates in total.

  • Price: $24
  • Dependency: Elementor Pro
  • Rating: 4.6 out of 5 stars (4.6 / 5)

The Bottom Line

With or without additional add-on, you can create a beautiful medical website using Elementor. Depending on the features and functionalities you want to add to your website. If you want to add an appointment form and okay with manual scheduling, then the native Elementor Form widget is enough. Conversely, if you look for an automated solution, you can use JetAppointment or the similar plugin to add the appointment functionality to your website. Basic elements like image gallery, button, icon, call to action, pricing table, and map are already provided by Elementor.

How to Create Image Scroll Effect on Hover in Elementor

Did you ever find a website whereby when you hover your cursor over an image, it will reveal the rest part of the image with a scroll effect? This type of effect usually found on a website that offers website templates. The purpose of the effect is to allow visitors to see the full screenshot of a template (which usually long). Elementor has no default feature to create this type of effect, but you can create it using custom CSS.

To give you an overview of the scrolling effect we mean, take a look at the following screencast.

How to Create Image Scroll Effect on Hover in Elementor

Before we get started, make sure you have upgraded your Elementor to pro version since custom CSS is only available in Elementor Pro. Once you are ready, create a new page (Pages -> Add New) and edit it with Elementor. New to Elementor? You can read our previous article to learn how to use Elementor.

On the Elementor editor, add a new section by clicking the plus button on the canvas area. Select the one-column structure.

On the Layout block under the Layout tab, set the height to Min Height on the Height dropdown. Set the minimum height to around 400.

Add Inner Section to the section you have just added and delete of the default columns. You only need one column for this matter.

Set the height of inner section to Min Heigh like its parent section as we have showed above.

With the Inner Section still selected, go to the Style tab. On the Background block, set the background type to Classic and select the image you want to use by clicking the image picker.

Set the image position to Top Center. On the Repeat option, set to No-repeat. Set the size to Cover.

Next, go to the Advanced tab and open the Custom CSS block and paste the following CSS snippet.

The CSS snippet:

selector{
    -webkit-transition: ease-in-out 4s !important;
    transition: ease-in-out 4s !important;
}
selector:hover{
    background-position: center bottom !important;
}

If you want to change the scrolling speed, you can simply change the value of the transition variable on the CSS snippet above.

If you want to duplicate the effect, you can duplicate the outer column (column of the parent section).

The Bottom Line

If you want to create a website that offers website templates with Elementor, then the simple tip above is great to be implemented to increase the user experience on your website. Your visitors will be able to have a glance look of a template appealing to them before they click the demo button (if you offer a demo). The ability to add custom CSS in Elementor Pro makes it possible for you to add an effect that is not offered by Elementor by default.

Pin It on Pinterest

Creating with WordPress?‚Äč

Subscribe and join 1,000+ WordPress users receiving tips and insights on creating with WordPress in the no-code era. At WP Pagebuilders, we write about the following topics a lot.