This is a super quick overview of Jupiter X to help you easily get onboarded. Jupiter X consists of three main areas:
- WordPress Customizer: Contains all your visual theme settings and global options such as typography, site, blog settings, etc.
- Elementor: This is where you actually create content using a drag and drop builder. You create your pages and post content, custom header and footer, etc here.
- Control Panel: This is where you register Jupiter X, install a template or plugin and manage some advanced settings.
Jupiter X is bundled with a handful of premium and free plugins. You don’t need to pay for any of those premium plugins as long as you own legit Jupiter X license.
To install plugins, Go to Jupiter X > Control Panel > Plugins. There, you can also activate, deactivate and delete plugins. Make sure to install and activate the required plugins. Required plugins are marked as “required” with a red badge on top.
Jupiter X uses WordPress Customizer to let you customize your website globally. This means any change made through customizer applies to the whole website, not individual pages. With Customizer, you can customize things like the logo, site width, favicon, typography, header, footer, sidebar, comments, search result, shop pages, 404 page, maintenance page and more. There are more than 800 customization options available in Customizer.
To start the customizer, simply click on Jupiter X > Customize from the WordPress Dashboard.
Almost all of the global customization you make via Customizer can be overridden in the individual pages. It means that you can set the unique header, footer, sidebar and content options for every page. You can find the page settings below each post as Post Options.
Navigate to Customize > Site Identity and choose Logo.
You can set different types of logos for different devices and conditions. Learn more about logo settings. Also, you can assign a favicon to your website by clicking on the Select site icon button. To edit the logo size and position, go to Customizer > Header > Styles > Logo.
You can change your website and content width from Customize > Site Settings. Learn more about changing container width.
In order to create a full page width and full width content that stretches to the borders of the browser and has no extra space below the header and above the footer, set the page template attribute to Full Width.
To change typography settings such as font family, font size, etc. go to Customize > Fonts & Typography menu. Here you can add new fonts from either Adobe fonts or Google fonts. You can also assign them to different parts of your website such as Body, Headings (H1, H2 …), etc.
Please note that Elementor allows you to set a different typography setting for each of your elements, and it will override the Jupiter X settings. More information here.
There are two types of headers in Jupiter X: Default and custom headers.
A simple header, which is quite easy to edit. Go to Customize > Header. Choose the type as Default. You can customize the style of the header from the Styles tab on the top.
Learn more about default header
A custom header is a more advanced header with more options and deep customization. Go to Customize > Header. Choose the type as Custom and then click on New. This will open a new Elementor window where you can either build a header from scratch or use a premade template to start from.
To use a premade header template, click on the Add Template button and choose a header template from the list. Learn more about custom headers
Regardless of your header type (default or custom), you can add more functionalities to your header such as making it sticky or transparent. All these header settings are available from Customizer > Header > Settings. Here is how to create a Sticky Header and Transparent Header.
Just like the header, there are two footer types in Jupiter X.
This is a simple and classic WordPress footer. Go to Customize > Footer. Choose the type as Default. You can customize the style of footer from the Styles tab on the top.
The default footer is comprised of two sections: Sub footer (enabled by default) and widget area (disabled by default).
Once you enable the widget area, you can use WordPress widgets in your footer.
go to Customizer > Widgets to add, remove and edit widgets. Learn mroe about default footers.
For a more customizable footer, you can use custom footers. Go to Customize > Footer, choose the type as Custom and then click on New. This will open a new Elementor window where you can either build a footer from scratch or use a premade template to start from.
To use a premade footer template, click on the Add Template button. Learn more about custom footers.
To manage your page layout and sidebars, go to Customize > Sidebar and choose a sidebar layout. Learn more about sidebars
As soon as you choose a sidebar layout, the widget positions will be available in Customize > Widgets. After adding the proper widgets to your sidebar, you can style them via the options available in the Layout > Styles tab. Learn more about working with widgets.
Note that the sidebar options can be overridden inside individual pages. Learn more about page-specific sidebars.
In Jupiter X, you can have unique sidebar layouts for every post type. For example, you can set a condition to have a right sidebar on blog pages, and no sidebar at all on portfolio pages. Learn more about sidebar conditions.
To create your own sidebar, go to Appearance > Widgets, and click on Add Custom Sidebar.
The recommended page builder for Jupiter X is Elementor. Make sure that Elementor is installed and activated by going to Jupiter X > Control Panel > Plugins.
Create a new page or post and click on Edit With Elementor button.
To save time, you can use a premade page/block template to start from. Simply, click on the folder icon.
Then choose a template and click on the Insert button. Once the content is inserted in your page, you can edit and customize it using options available on Elementor’s left sidebar.
You can drag and drop elements to reorder them. However, if you want a more accurate tool, try Elementor Navigator.
There are two types of blog single pages in Jupiter X: default and custom.
This is the quickest way of customizing your blog single page. It offers 3 single blog post templates and allows you to customize each template. From Customize > Blog > Blog Single, choose Default as the type and select your desired page template, choose what blog element you want to display on the page and finally style it under the Styles tab. Learn more about the default blog post.
If you want to create a completely custom blog single page, you can use the custom blog single type. From Customize > Blog > Blog Single, choose Custom and then click on New.
To customize blog archive pages (author, tag, category, date pages) go to Customize > Blog > Blog Archive. Then assign a template that is built with Elementor. Make sure to use the blog element inside that page.
Just like blog posts, there are two portfolio single types: default and custom.
This makes it quick and easy to edit a portfolio single page. Just go to Customize > Portfolio > Portfolio Single, choose Default as the type. You can decide what elements to be displayed. Customize the elements under the Styles tab.
As the name suggests, a custom portfolio is for those who want even more customization. Go to Customize > Portfolio > Portfolio Single, choose Custom as the type. Click on new and customize it using Elementor. Learn more about custom portfolio.
WooCommerce is the most popular shopping cart plugin for WordPress. Jupiter X offers 8 premade single shop page templates and many other options that let you customize every bit of your e-commerce website. Learn more about customizing shop pages.
If you want even more customization, you can create your custom shop page using the bundled plugin, Jet Woo Builder. Learn more about creating custom shop pages.
Jupiter X provides an easy way to design your 404 not found page template. Just create a page and assign it as a template via Customize > Pages > 404.
You can customize your search results page in Customize > Pages > Search. Learn more about customizing search result page.
You can also create your own custom page and assign it via Customize > Pages > Maintenance to show when your site is in maintenance mode. Learn more about maintenance mode.
You can organize your content in different post types other than default ones (page, post and portfolio) such as employees, hotel rooms, schools, etc. and customize their designs easily using Jupiter X. First, you need to enable custom post types from Jupiter X > Control Panel > Settings. After that, a new additional item called Post Types will be added to the customizer.
It will also add the Jupiter X post options below your custom posts.
Now back to the Customizer > Post types > [your post type], you can decide which elements will be displayed. You can also create a completely custom single page and archive page for your new custom pages.
To create a single custom post type template, from the Customize > Post Types > [your post type] > Single and then click on New.
Then find the Raven elements (with the blue X badge) and use them as you want.
Now choose the source option to be Dynamic and then select the Post Title.
Then update the template and close the modal. You can style the elements as you wish while editing the template in the Elementor editor.
As for the Archive page, you can use Posts Widget from Elementor. Just remember to enable Is Archive toggle if you are going to use it on an archive page template.
The page content is stored in the database and can be exported from Tools > Export.
You can also import the backup from Tools > Import > WordPress Importer.
If you want to export Customizer settings, you can use the Customizer Export/Import plugin which is bundled with Jupiter X. So first, navigate to Jupiter > Control Panel > Plugins, install the Customizer Export/Import Plugin and then activate it.
Now back in Customizer, you’ll see the Export/Import option at the bottom of the list.
Advanced customizations may sometimes require additional CSS or Javascript snippets. Jupiter X allows you to add your custom CSS and JS snippets both globally and individually on each page.
Remember that this will apply to all of your pages. Simply navigate to Customizer > Additional CSS and add your CSS snippet, then publish the changes.
If you wish to add a Custom CSS to one of your pages, please first activate the Raven plugin (if it is not yet activated) and then navigate to your page while editing in Elementor. Then click on the Settings button.
In the Advanced Tab, you can find the Custom CSS/JS section. Add your code snippet here and update the page.
To add a Javascript snippet globally
Go to Jupiter X > Control Panel > Settings > Tracking code area.
<script type=”text/javascript” >
//your code here
</script>
Now, save the settings and flush the theme assets on top. 