Jupiter X v1.10: Custom Single Page, Archive Custom Template, Custom Title Bar and More

Recently we released Jupiter X v1.10. This new version pieces together some very exciting and frequently requested features and additions to Jupiter X. In this post, I’m going to outline the 4 most important features added in the version.

Custom Single Pages

Creating custom single pages was not previously possible in Jupiter X without Elementor Pro. It’s needed when you want to define a different standard design for a single page of your post type. It can help save a lot of time redoing a design for every post and also completely customize it for you or your clients’ needs and preferences.

Custom Single Pages for Blog, Portfolios & Pages

Before, you had to choose from readymade templates available in Jupiter X in order to add custom single pages to your blog and portfolio posts. But now, you can design your very own templates with Elementor and assign it to your portfolio and single pages.

After updating to Jupiter X v1.10, you’ll see a new tab labeled Single in the saved templates section where you can add and manage the single page templates. You can click on the Add New button and just like a regular header, page or section templates, you’ll be taken to the Elementor editing space to build your page whichever way you want and save it.

Jupiter X v1.10 Blog Single

Once saved, you can go to Customizer and simply assign the template you just built to all new portfolio single pages.

By using the same method, you can also create a standard design to apply to your page templates. Imagine that when your client requires specific elements on every page, you’ll be able to create a template including those elements to load every time they create a new page.

Learn more about new custom single pages in the knowledge base.

Custom Single Page for Custom Post Types

You can now define custom single pages for your custom post types as well. Imagine you’re running a hotel-listing website with tons of rooms you constantly manage, add and remove. You’ll need a custom post type with a custom single page design that includes only the content you require (e.g. room types, sleeps, amenities, options, price, etc.)

Jupiter X v1.10 Post Single

Or say you are creating a talent-listing website for a headhunting company with a large database of freelancers. They need a custom talent post type with a custom single page that includes the talents’ information such as personal information, location, bio, experience, skills, etc. with a vertical portrait next to this info. You’ll need a custom layout that you cannot find in the readymade blog single styles in Jupiter X.

In Jupiter X v1.10, you can simply create a custom single page for your custom post type and make it standard for all future posts in that post type.

Learn more about new custom single pages for custom post types in the knowledge base.

Dynamic Content in Custom Post Types

The attributes you need to include in the single pages for hotel and outsourcing website examples are custom data sets that are not normally included in a blog or portfolio single page. In order to add all this info, we need to do two things:

  • Inside our custom post type, define and add a set of dynamic content fields for the custom attributes we need (rooms, price, skills, bio, etc.). These fields will appear inside the post meta section in the single page in the backend. The tenant will set the value for each attribute and publish the post
  • The attributes along with the values set by the tenant for each should appear in the frontend. So we should add each dynamic data set we require inside the blog single page for the custom post type as well.
Jupiter X v1.10 Custom Elements

All this is now possible with Jupiter X. Thanks to the new Dynamic Fields Mapping feature, you can add a variety of standard elements to your custom single page such as heading, image, button, video, text editor, as well as many dynamic elements such as post content, post comments and post meta.

Custom Archive Page Template

If you want a custom design for your blog, portfolio or any other post type archive page, you are now able to do it without any other plugin such as Elementor Pro. Thanks to the new Archive Custom Templates in Customizer, you can create, edit and assign custom archive page templates for any post type.

Using the advanced dynamic tools, you can add both the blog loop wherever you want in the custom archive page template as well as any other dynamic content to your template:

  • Heading Element
  • Image Element
  • Video Element
  • Button Element
  • Text Editor Element
  • Photo Roller Element
  • Posts Element
  • Posts Carousel Element

Assigning a custom archive page for blog and portfolio is easy with Customizer. If you need to assign the archive page template to your custom post type, simply enable your desired custom post type from Jupiter X > Control Panel> Settings and check the Customizer settings again. You will see the post type name in your Customizer menu, and it will give you the ability to assign custom templates to it.

Learn more about new custom archive pages in the knowledge base.

Custom Title Bar Template

With Jupiter X, it was previously possible to customize the comprising elements of the Title Bar such as the container, title, subtitle, breadcrumb or enable/disable the title bar for different post types. However, it was not possible to create a custom design from the ground up and set it as the standard page title. Now it’s possible.

In Jupiter X v1.10, you can use Customizer to design a custom title bar just like a page section in Elementor and assign it as your page title. With the help of the newly added Breadcrumbs element to the Raven plugin, it’s also possible to choose between Jupiter X default Breadcrumbs, YOAST Breadcrumbs, and NavXT Breadcrumbs.

Would you like me to give you an example of this feature? Though so. Imagine you wanted to add a dynamic image to the background of your title bar so each page could have its own title bar background image. Similar to any other dynamic templating feature, you can now assign a dynamic background image element to your page title container section and set it to fetch the source from the featured image. Isn’t that cool?

Learn more about the new custom title bar template in the knowledge base.

Global Typography Option for Post Content

This is a feature that has been frequently asked about by heavy-duty bloggers and writers. In Jupiter X Customizer, you were able to customize the look of many things in your blog single page including the featured image, title, meta, tag, social shares and more – but the main body text was not one of them. If you weren’t using Elementor to write blog posts, there was no way you could define standard formatting for the main body text in your blog single pages.

With the latest update, you’ll have a Post Content section among your blog single style tab in Customizer where you can define all the formatting attributes for your body text in the blog single page. This is not limited only to your blog post content, as you can do the same thing for a portfolio and any custom post type single pages as well.

Learn more about the new post content formatting in the knowledge base.

What’s Next!

What’s next is great projects made by great people for great people! We believe the newly added features – particularly the custom single pages and the new dynamic content in custom post types – adds even more capabilities to Jupiter X as a WordPress website builder. Dynamic content alone opens a whole new chapter on the types of websites that can be created by Jupiter X. Just one example is various listing websites!

In the near future, we’ll publish blog posts to exclusively cover each of these features more in-depth. Until then, we’d like to know your feedback about Jupiter X v1.10 and if you think its features might come in handy for your next Jupiter X project. Let us know in the comments and stay tuned for related blog posts soon 😉.

How to Add Filters to WooCommerce and Custom Posts

Add filters to WooCommerce and Custom Posts Featured Image

Just imagine how an actual customer experience looks like in a retail store. Most people don’t know what exactly they want in the first place. They like to see collections of items and then evaluate their options by narrowing down their selection. This is the ultimate experience.

Why do you need to add filters to WooCommerce and Custom Posts?

If you’re running an online store or using custom post types, you need to make sure that your users are able to easily find what product or post they are looking for. Having a search field on your website is a great help, but not nearly enough.

Just imagine how an actual customer experience looks like in a retail store. Most people don’t know what exactly they want in the first place. They like to see collections of items and then evaluate their options by narrowing down their selection. This is the ultimate experience.

Now, you should ask yourself as an online store runner. Does your website have this capability? Do you let your customers play with their options and narrow down their preferences?

Booking.com has a huge database but it is easily searchable by humans with the help of filters

Jupiter X is not only giving you an easy-to-setup and fully customizable platform to sell your products on, but it also offers comprehensive Woocommerce features to amplify your customer’s shopping experience even further.

Jupiter X comes bundled with a plugin called JetSmartFilters so you can add filters to WooCommerce and custom posts. This tiny and powerful plugin uses powerful AJAX filters so your customer can find the right WooCommerce products and custom posts they’re looking for.

Who needs to add filters to WooCommerce and Custom Posts?

It’s a must for pretty much anyone running an e-commerce website or custom post types.

  1. Any online store based on Woocommerce
  2. Listing websites such as real estate, car rentals, etc.
  3. Websites with custom post types

Features

Speed

JetSmartFilters is created based on AJAX technology, which allows the filters to work without refreshing the page, making them even faster. So, users can work with options and filters seamlessly without having to refresh or reload the page.

7 Smart Filter Variations

There are several filter types you can choose from based on your need. Everything is built on Elementor, so you can easily modify, customize, and add filters to WooCommerce and custom posts.

9 Filters and Pagination Widgets

Further improve your visitor’s experience with these versatile filters and pagination widgets:

Highly customizable WooCommerce and Custom Post Filters

JetSmartFilters is built upon the Elementor plugin, therefore it is extremely customizable, just like any other Elementor widget. You can easily drag and drop the filter widgets to the page and start customizing their elements until it matches your desired style and theme. With Jupiter X, it’s that easy to add filters to WooCommerce and custom posts!  

Official plugin website

Documentation

How to Add Amazing Visual Effects to Your Content with Jupiter X

Add Amazing Visual Effects to Your Content with Jupiter X Featured Image

Visual effects such as parallax, sticky elements, unfolding contents, hotspots, web particle animation, and more. are helpful in almost every kind of website. E-commerce websites, for instance, can present their products better with hotspots on product images.

Landing pages can tell better and shorter stories – which translates to less bounce rate – with sticky elements or unfolding content. Parallax effect is also quite handy when creating eye-catching content. Normally, you would spend extra for different plugins. But with Jupiter X, they are all included for free in one plugin called JetTricks.

Add Amazing Visual Effects to Your Content with Jupiter X 1

Different Ways to Add Amazing Visual Effects to Your Content with Jupiter X

To make your content more useful and interesting to read, the rich library of visual effects available in JetTricks plugin is at your disposal. There are numerous cases where you can use these effects, but here are some of them:

1. Parallax effect is everywhere and it can be used to add a 3D depth to your content. Use it to create your static pages more dynamic and captivating! Parallax Effect Demo

2. Sticky elements are great in creating a custom scrolling experience. Make an important part of your content fixed while the rest scrolls down. Sticky Elements Demo

3. Unfolding columns and view more content effects are what you see in most introductory landing pages. Offering a long description does no good to your page bounce rate. By hiding a chunk of it and make a section optional to read, you can make your pages more effective. Unfolding column demo and View more content demo

4. Hotspot on images is a great addition to your online shop. You can also use it for more descriptive and interactive images across your website. Hotspot on Images Demo

5. Your pages don’t have to be boring. Add some smooth loop animations to your page backgrounds or banners to grab the attention of your site visitors and keep them interested. Loop Animations Demo

6. Use tooltips to create more informative yet less crowded pages. Perfect for eCommerce and product landing pages. Tooltips Demo

Easy Customisation

Working with visual effects in JetTricks is as easy as using Elementor editor! Every change you make is instantly available for preview and deeply customizable. There are also limitless possibilities and combinations you can try when you add amazing visual effects to your content with Jupiter X.

Add Amazing Visual Effects to Your Content with Jupiter X 2
You can use any JSON code to create particles with unlimited characteristics.

How it works

Jupiter X comes bundled with the JetTricks plugin for free. It’s deactivated by default, but you can activate it via the plugin manager in your Jupiter X control panel. When activated it, adds its settings to the existing Elementor elements such as columns, heading, an image, or completely new elements such as view more element and unfolding element.

So, what are you waiting for? You can now add amazing visual effects to your content with Jupiter X, so start vamping up your site today.

Documentation

Meet Jet Engine! Your New Super Power To Create Custom Post Types With Jupiter X

One of the key factors when assessing a WordPress theme’s customizability is the number of post types it offers to its users. Post types enable you to build different types of content on your website. Literally, everything you build into your website should be hosted by a post type.

Posts, pages, and attachments are some WordPress native post types that are readily available upon WordPress installation. Based on the WordPress theme you use, you may have custom post types to create a wider range of content on your website. Some of the usual custom post types themes offer are portfolio, employees, testimonials, client, products, and sliders.

The Problem with Pre-built Custom Post Types

Custom post types are usually built into a theme’s core. It can increase the theme’s size and affect its speed and performance. You may have come across themes that offer custom post types you never use. You may have noticed that they just occupy some space in your WordPress dashboard navigation and reduce your websites admin’s speed. And this is one of the reasons the most customizable themes are the slowest ones, too!

So, is it possible to think about ultimate customizability with an infinite number of post types without affecting the theme’s speed and performance?

YES! Jupiter X, for the first time, turned many of the features that are commonly offered as post types to elements to save users a lot of time and effort. So, instead of creating posts in the WordPress dashboard, you can visually create elements such as employees, clients, and testimonials within Elementor and see the results in real-time.

Your WordPress dashboard sidebar is now free of post type items. You can activate the plugins like Raven and JetElements to access these elements only if you need them. If you don’t need them, you won’t have to import them and you can enjoy your theme at its highest performance.

Is that all?! Are we bound to elements and post types that Jupiter X offers?!

I’m happy to say ‘NO’ this time! 😀 Jupiter X recently added another member from the great Jet plugins family to the arsenal of plugins it offers to its users for free: JetEngine!

What is JetEngine?

JetEngine enables you to create new post types, taxonomies, and custom fields without any programming experience. You are no longer limited to post types built into your theme. You can simply build your own post type, add custom meta fields, customize its appearance and layout, and use them wherever you want.

Imagine: You don’t like the Team Member element in Jupiter X elements library to showcase your team member or you have a wide range of services with special meta fields and design needs. Or let’s say you want to build a website for a client with a wide range of products and you don’t want to add all of the content by yourself. You can simply create custom post types with Jupiter X and use them in your or your client’s website.

What’s more is that there is no coding involved and you will create the custom post types using Elementor page builder, for which you formerly needed to have good PHP skills!

What does JetEngine offer?

JetEngine offers special widgets for pulling dynamic content from the posts and displaying them in your custom post types.

Dynamic field

Display the meta content from a defined source and customize its appearance however you want.

Dynamic image

Display dynamic featured images in your custom post type and customize its appearance.

Dynamic repeater

Display dynamic repeaters in your custom post types using a defined source and enjoy infinite customizability.

Dynamic link

Add dynamic links to any custom post type.

Dynamic terms

The best way for showcasing dynamic taxonomies added to any posts or pages when creating a template with Elementor is using Dynamic Terms widget, that’s specifically cut for these purposes.

Dynamic meta

Display the publication date, information about the author, and/or the number of comments by adding Dynamic Meta widget to the template.

Listing grid

Use eye-catching Grid, Masonry and Justify layouts to display custom posts types and customize its appearance the way you want.

How to create custom post types with Jupiter X?

Let me quickly summarize how to create custom post types with Jupiter X. For a custom post type you need to create:

Post type

From the WordPress navigation bar, try:

JetEngine > Post Types > Add New

In the upcoming page, set the general settings about the custom post type first. For example, if you want to set this post type to public or private, change its appearance in WordPress navigation, or choose the sections you want to be available in the single page, and so on.

Then, you should define the meta fields you want in your custom post type. This can be a custom text, date, time, media, selector, or many other things.

A listing that uses that post type

Second, you need to create a listing in which your post type will be used. For that, try:

JetEngine > Listings > Add New

You can choose the post type you just created and then give its listing a name. Then, click on ‘Create Listing Item’

You will then be taken to the Elementor editor mode where you can create the layout of the listing for your post type however you want, just like your usual building experience with Elementor.

And that’s it! You just created a custom post type with the meta options you wanted and then created a listing where that custom post type can be used. You can now call your custom post inside your page using Listing Grid element:

You can define up to 6 columns for your listing grid within the Listing Grid element.

How to create custom post types with Jupiter X?

In this short post, we introduced the JetEngine plugin and showed you how to create custom post types with Jupiter X. If you want a more thorough explanation of the plugin, you can check the official documentation as well as the video tutorial below. Have fun and let me know if you have any questions regarding this new Jupiter X power ball!

Meet JetTabs! The Best Way to Organize Your Content

Jupiter X comes with a great page builder named Elementor and it has powerful features that let you create advanced layouts and designs. But unfortunately, it lacks one hell of a feature: Nested elements inside the tabs and accordions.

If you’re not using Jupiter X, you will have to design the complex layouts inside your tabs and accordions using HTML and CSS, and put the code directly inside the tab or accordion content.

Fortunately, we came up with the best way to organize content with Jupiter X. You can now benefit from a bundled plugin called Jet Tabs, which adds the following features to your website — totally free of charge!

  • Accordion ( Advanced Accordion lets you add complex layouts inside its content)
  • Image Accordion
  • Switcher (Toggle between two complex contents)
  • Tabs

All of these elements are capable of showing and/or hiding part of your content. Indeed, it’s the best way to organize content for seamless user experience. Now, let’s take a closer look.

JetTabs is a premium plugin that’s free to use for Jupiter X users. It’s good to know that all of the elements added to your website when you install this plugin (except the Image Accordion) will use the Elementor Block Templates, which is also free in the standard version. You don’t need to pay for the Elementor Pro to benefit from it.

Accordion

Not to be confused with Elementor’s Accordion, this element is Classic Accordion. Classic Accordion widget is the perfect tool for adding content templates built with Elementor or adding your text to every accordion item. You can use this widget in your FAQ page or show the long text content in a more appropriate way.

After adding the classic Accordion element, you can add your items, titles, and icons then set the active element.
For adding the accordion items content, you can add simple text or tabs. It’s also possible to set a section template as accordion content.

In General, the process involves creating your complex content in a block template using Elementor, then assigning the template to the accordion items in the Classic Accordion Settings.

Check out the JetTabs documentation to get more information about the best way to organize content with Jupiter X.

Image Accordion

Image Accordion is a fancy element that lets you showcase your content or categories in a stylish way. You can also use this element to highlight your gallery categories, and so on.

You just need to add the Image Accordion element your page. After that, you can simply add your images with title and description. And in case you would like to add a call-to-action button, it’s possible as well.

There’s a cool option that allows you to change the open and close animation:

Content tab >  Settings > Show Effects

You can see more examples in the JetTabs documentation.

Switcher

Switcher can be considered as a Toggle element, too. The Switcher widget is the perfect asset for you if you need to display two different content blocks and show them under different circumstances. It’s quite practical to use, and it helps you show your site content in a creative way.

Now, there are two items that you can assign your section templates to and set the switch items effect as well.

Check this page out for more information about the Switcher element.

Tabs

And finally, the Tabs! It’s a very useful element, indeed. Tabs is a powerful element that allows you to add your section templates to each tab section. It’s customizable and very easy to use.

First, define your tab contents as a section template in Elementor Templates.

After adding your sections and content, you can assign them into your Tabs element.

Also, in case you would like to add simple text as your tab content, you can change the “content-type” drop-down field to “Editor”.

Feel free to play with the style and design options to get your awesome tab to work exactly the way you imagined.

Now that you and Jet Tabs introduced to each other, it’s time to install it for free on your website, so you can take advantage of the best way to organize content with Jupiter X.

Just follow up these steps:

  1. From WordPress left menu, go to Jupiter X.
  2. From the control panel left menu, go to Plugins.
  3. Next to JetTabs, click on Activate button.
  4. A new pop-up window will appear. click on the Continue button.
  5. After a couple of seconds, a new pop-up window will appear. Click on OK button.
  6. JetTabs plugin is now installed and activated on your website. It will be displayed above in the Active Plugins section.

In case you’re concerned about the compatibility of this plugin with your website features, you should know that:

JetTabs is Multilingual-ready.

Like any other Elementor plugins, you can freely use it on your multi-language website.

Easy-to-use, No Coding Skills Needed.

You can personalize everything without adding any codes. It’s fully customizable.

Compatible with RTL websites

It’s optimized for right-to-left websites.

Responsive layout

You can create vertical and horizontal layouts without having to worry about responsive challenges.

You can also check out our official bundled plugin overview page to access the plugin author website and community, in case you experience any issues with it.

Watch this video to learn how you can easily organize your content using Jupiter X and JetTabs:

Meet JetWooBuilder! The Ultimate Tool to Create Unique Product Page Templates With Jupiter X

JetWooBuilder is a great new feature in Jupiter X that allows you to create WooCommerce Single Product page templates and WooCommerce Product Archive templates with Elementor live page builder’s multiple dynamic content widgets.

You can create unique product page templates with Jupiter X using lots of special widgets and assign it to any product you need. JetWooBuilder is very simple to use. Anyone, from beginners to expert developers, can create attractive and professional-looking WooCommerce Single Product pages without ever touching a single line of code.

Like many other amazing features in Jupiter X, JetWooBuilder is a plugin that can easily be activated through Jupiter X plugin manager.

Customizability

With JetWooBuilder, you can create any layout and design using Elementor page builder and assign it to a product or create an archive template for Shop in your website. So, the options are limitless.

JetWooBuilder Overview – 

Check out samples here.

Powerful Global Widgets For WooCommerce Online Store

Some global widgets in JetWooBuilder can be used for showcasing products and their taxonomies on a custom page.

This widget displays the WooCommerce Product Categories in a Grid layout on the pages built with Elementor.

With this widget, you’ll display the products in a beautiful grid layout. Note that products should be created with featured images, descriptions, and prices in place, so you can set up the widget in the most fitting form.

Using this widget, you’ll showcase the WooCommerce products into stylish list layouts.

This widget allows you to display the taxonomy categories or tags for the WooCommerce products in the form of attractive tile layouts.

Creating a Single Product Page Template

With JetWooBuilder you can create a new or use a pre-designed single product template using dynamic WooCommerce widgets and set it for WooCommerce products.

The layouts that can be used are:

Left-side Product Image 1

Left-side Product Image 2

Right-side Product Image

Centered Product Image

The JetWooBuilder documentation will give you more information on how to create unique product page templates with Jupiter X.

Creating Product Archive Template

Another great feature is creating the Product Archive template to use for the Shop page or any other product layouts displaying related products, cross-sells or products in the shortcode.

Using special, easy-to-use WooCommerce widgets, you can build such archive layouts:

Products Grid with Left Sidebar

Products List with Left Sidebar 1

Products List with Left Sidebar 2

Products List with Right Sidebar

Find more details about creating archive templates in the JetWooBuilder documentation.

Other Features

There are numerous options you’ll discover once you start experimenting with this amazing Shop builder. Aside from that, you can create Categories Loop template, set advanced appearance settings of the widgets, define widget margins and padding, use entrance animation, change the background for the whole widget, and so much more.

When users search for a specific product, you can use the Archive template to show the relevant items they’re looking for. The Archive template will also allow you to display items using shortcode, or with Upsells or Cross-sells widgets in Elementor-built single product templates.

How to Create Unique Product Page Templates With Jupiter X

Watch this video to learn how you can easily create templates for your online store using Jupiter X and JetWooBuilder: