CyberX - CyberX is a powerful WordPress theme for Cyber-Security companies and startups.
Thank you for purchasing our theme. We have dedicated (and still do!) plenty of hard work in it, and hope you like it. If you have any questions or issues that are beyond the scope of this documentation, please contact us for support.
This documentation covers everything you need to know in order to get started and use this theme. It also provide some answers to frequently asked questions. We strongly recommend that you read the entire documentation if you are experiencing issues with the theme.
General WordPress Info
If it's your first time using WordPress, take a moment to get a quick understanding of this new environment. Luckily, WordPress is one of the best CMS options out there (as a matter of fact, it runs on more than 32% of the entire internet!) If you already know how your way around WordPress, feel free to skip to the next section. Otherwise, please go over the following links and info to make sure you know everything needed in order to start.
Below are several useful links for general WordPress information:
- Installing WordPress - This should cover multiple ways of installing WordPress on your server.
- The Official WordPress Codex – The official Codex includes tons of info on WordPress, it's the best place to start from!
- FAQ: New To WordPress – the most popular FAQ’s regarding WordPress.
- WordPress Installation Tutorial
Once you've downloaded the installation files, extract it and locate a file called
CyberX-Theme.zip. You can install the theme by using one of two installation methods:
- Login to your WordPress admin panel.
- Go to Admin panel > Appearance > Themes > Add New > Upload Theme.
Click on Choose File and select
- Click on Install Now.
- When your theme is successfully installed, click Activate to activate the newly installed theme.
- Using an FTP client, login to the server in which your WordPress website is hosted.
Using the FTP client, navigate to the
/wp-content/themes/directory under your WordPress website's root directory.
- Upload the entire theme folder (Un-Zipped!) into the themes folder on your server.
- Once uploaded, navigate to Dashboard > Appearance > Themes in the WordPress Dashboard and click on Activate right below your newly uploaded theme.
With either of the above two options, make sure you are uploading the
CyberX-Theme.zip file and not a larger .zip file that contains the entire theme package along with this documentation and other files. If you upload the wrong file you will most likely get an error such as: “Error: missing style.css stylesheet.”
Note - If you receive any kind of error message after installing the theme or a plugin, please contact your hosting provider and ask them to upgrade the PHP version installed on your server to either 5.4, 5.6, or even better, version 7+.
Theme License - The ThemeForest regular license allows you to use the CyberX theme to create one, single, End Product. For more info about the license, please visit Themeforest.
Theme Installation Wizard
When you activate the theme for the very first time, you will be redirected to an installation wizard upon the initial theme activation -
This wizard allows you to get started in just a few clicks with everything you need to start working with our theme. (Theme wizard is fully optional and you can skip any step during the process, it's up to you!)
The Theme Installation Wizard would guide you during the process. Follow the wizard's instructions to install all the recommended plugins, create a child theme, and import the demo data. For more info look at the sections below.
Child Theme Setup
The first step of the Wizard is to install a Child Theme. A child theme allows changing aspects of the theme without compromising future updates. You can make as many changes as you wish to the Child Theme, and then simply update the Parent Theme if needed. It's a good practice to use a Child Theme if you plan to edit the core theme file.
Further Reading: For more info on Child Themes, please visit the WordPress Developer Handbook.
Installing the Recommended Plugins
The next step in the Theme Setup Wizard is the recommended plugins. We included a bunch of recommended plugins and also a custom plugin we created into the theme. You can see all the recommended plugins by expanding the view within the Wizard, and also choose which plugins you wish to skip.
Note: We strongly recommend installing all plugins upon the initial installation. Once you are start working with the theme and plugins, feel free to deactivate and remove any plugins you don't need. Some plugins are important in terms of functionality (although none is really mandatory, you may only lose a couple of features without some plugins) so make sure to install all of them and only remove the ones you really don't need.
If you decide to skip the Theme Installation Wizard, you can always access the available recommended plugins via the "Appearance > Install Plugins" screen.
Importing Demo Data
The last step of the Theme Setup Wizard is the demo import. You can select to import the default content, widgets, options etc. and then run the importer. The import process should take about a minute or two, so wait until the importer notifies you the import process is successful.
Note: The import process would only work if your server is good enough to support it. The recommended server settings are:
- PHP Version: 5.6+
- PHP Memory Limit: 128M+
- PHP Max Post Size: 64M+
- PHP Max Upload Filesize: 32M+
- PHP Max Input Variables: 2000+
- PHP Max Execution Time: 300+
- WordPress Memory Limit: 128M+
(Optional) Manually Importing The XML File
If you've tried to import via the Theme Setup Wizard and got an error or couldn't import the files, you can try to run the import with the default WordPress Importer plugin. To do so, simply go into "Tools > Import" and click on the WordPress importer. Next, upload the content.xml file that is located in the theme folder you have downloaded (in the "Demo Content" folder).
The last step would be to save the homepage in the "Settings > Reading" panel, and also resave the navigation menus within the "Appearance > Menus" section.
Setting Up The Homepage
If you don't plan to import the Demo Data, you should notice that the homepage initially display an index of your latest posts (And the page would be labeled "Latest News").
Obviously, if you want to enjoy the full features of this theme and the flexibility of fully editing the homepage, you would need to set the front page as a static page.
In order to do so, you'll need to create a blank page, and name it as you wish. We have used "Home", for our example below. Then, navigate into the "Settings > Reading" part of your Admin Panel, and make sure to select a static page to show on the homepage and save the new settings:
You can easily customize the theme options under Appearance > Customize. This includes theme colors, images, fonts and typography, and many general settings.
Changing the Logo
You can easily adjust the logo in the Theme Customizer ( Appearance > Customize ) under the section "Header" and sub-section "Logo".
To change your logo, click on "Change Image" and choose your new logo. Make sure to adjust the "Logo Width" to match your new logo.
Changing the copyright text / link
You can easily adjust the copyright text and link under Appearance > Customize > Footer > Copyright Text.
Elementor Page Builder
This theme is powered by the page builder "Elementor". Check out the full Elementor documentation here: https://docs.elementor.com
Using the Page Builder
You can edit any page with the page builder by clicking the "Edit with Elementor" button.
From there you can add new Elements or editing elements by clicking on them. Just select an element and then the panel on the left will display options:
Changing Background Colors and Images
To change a background color or image, you will generally need to change the "Section" or "Column" settings. These options would appear under the "Design" tab one the left side.
You can add new elements by clicking the tabs icon on the top right of the Elementor sidebar. From there you get a list of elements. Choose any element and drag it onto your page where you want it
Adding Pre-Saved Templates
We have saved custom built-in templates in the Elmentor template manager. Once you import the demo data, you should find the custom templates in your Elementor Library. In addition there are many other free templates available that can be be used to re-create various pages or sections of the site. Click on the templates library button to open the layout options:
Templates can be used to re-create various pages or sections of the site. Click "Add Template" button:
Then click on the "My Templates" tab on the top right side in order to see all the built-in templates.:
(!) Important Note: It is very important that you edit the pages via the default WordPress "Pages" section and not through the "My Library" section within the admin panel. Editing the "My Library" templates would only change the templates themselves and not the actual pages, so you won't see any difference on your live site unless you modify the actual pages.
You have additional page options at the bottom of each page and post which can be used to adjust the sidebar display and header display.
Note: You can also choose to use Elementor to edit the regular posts as well. To do so, simply enable this option in the Elementor plugin settings and start editing your single posts with the plugin.
More Info On Elementor
Luckily, Elementor offers a large knowledgebase with tons of into. We highly recommend you check out their documentation here: https://docs.elementor.com.
Here's a quick video from the Elementor docs homepage:
Setting up the Blog
The "Blog" (or "News") section is based on the default WordPress "Posts" functionality. To create a new post, simply go into the "Posts -> Add New" screen, and start editing your content. You can choose whether to use the default WordPress editor or the Elementor editor on the blog section.
If you want to add a custom Excerpt (a shorter intro to your article that would display on the archives or post grids), you can do so via the sidebar options:
Below the post content area, you'll find the post settings panel where you can modify multiple options including the background image:
Setting a Featured Image
The posts "Featured Image" will be displayed on archive pages and on the post lists you create. You can also display the featured image on the singular post page, or set up a background image to display in the title area instead. To add a Featured Image, simply add a new image here:
Modifying the Title Area
The Page Title area appears on all posts and pages by default. You can disable it via the page/post settings if needed, but otherwise many customization options are available via the "Appearance -> Customize" section. You can control the height of the page title (via the "Padding" setting), the location of the title or meta byline, typography settings, and so on.
Setting up the Shop & Products
The "Shop" section is powered by WooCommerce, the most popular WordPress plugin for eCommerce. WooCommerce allows you to sell physical or virtual products, and handles shipping, stock, payment and many more aspects of your eCommerce business. For more info on WooCommerce, please visit the official documentation here: https://docs.woocommerce.com/documentation/plugins/woocommerce/.
Creating new Products
You can create new shop products via the "Products > Add New" screen. Each new product would appear on the main Shop page (which should also be set via the WooCommerce settings under "WooCommerce Settings > Products > Shop Page").
More info on adding and managing products available here - https://docs.woocommerce.com/document/managing-products/
Customizing Store Options
WooCommerce adds by default multiple settings and options that are available via "Appearance > Customize > WooCommerce". The theme also includes some additional options that are available in the same section and extend the default WooCommerce settings.
Adding Product Variations and Bookable Products
You can add Variations and Attributes to your product with WooCommerce. This would allow you to add different variations and pricing options per product (e.g. T-Shirt sizes (S/M/L/XL), colors, fabric and so on). More info on product variations is available here: https://docs.woocommerce.com/document/variable-product/
To enable bookable products (Hotel Rooms, Rentals, Per-Hour Services etc.) you can use the WooCommerce Easy Bookings System plugin which should work perfectly with this theme.
Creating New Events
If you wish to enable the "Events" section, simply install the free "Events Maker" plugin. You can easily add events via the "Events > Add New" screen, and add events to any page by using our custom Elementor "Events" addon. For more info on the Events section, please visit the Events Maker Official Documentation
Portfolio / Custom Post Type
The theme comes with a customizable custom post type which defaults to "Portfolio". You can change the name of this custom post type to anything you have in mind (Gallery/News/Designs/Music and so on). You can control all the available custom post type options via the "Appearance > Customzie" section. You will need to enable the custom post type first if you plan on using it:
Note - If you change the custom post type name or the category name, you will have to re-save your permalinks under "Settings > Permalinks".
Displaying the Custom Post Type
If you want to show a list of those "Portfolio" posts on a certain page, simply edit the page with the Elementor page builder, and add the "Portfolio List" addon. This will display your custom post type even if you use a name other than "Portfolio".
This theme is ready to be translated to any language. The easiest way to translate is via a Translation WordPress Plugin. Check out wordpress.org for a list of translation plugins. Our current recommendation is the plugin Loco Translate. Read more about Loco Translate Here.
If you want to translate the files yourself, you can do so with the POEdit software which is available for Windows/Mac/Linux. This program helps you translating the files locally and add multiple language POT files into your WordPress website.
If you prefer to locally translate your theme, please find the language .POT file in languages folder
You can learn more about translating WordPress via the Translating WordPress Documentation.
Need a Multilingual Website?
To create a multilingual WordPress website that allows you to create the same content in multiple languages and display your site in more than just one language, you will need a multilingual plugin. The following plugins are the most popular ones in that aspect:
- WPML - The WordPress Multilingual plugin. WPML is the most popular option to run a multilingual website. Other options are Polylang, Bogo or qTranslate.
- Other options can consist of: Transposh, Global Translator, Google AJAX Translation, Multisite Language Switcher, Multilingual Press, and Zanto can also help, depending on your project.
Missing Font Characters
If you notice any font characters missing, you will need to select additional Font Subsets. You can manage this under Appearance > Customize under the Typography tab.
Note: Some fonts do not support all font sub-sets. If your font does not support your language, you will need to choose another font that supports your font characters.
Any questions regarding major customizations of themes are not included in the scope of the support services we offer with each purchase. In case you wish to customize your site further and need professional help, contact one of our Recommended Developers and you will get a quote shortly through one of the most professional platforms available to find reliable WordPress experts.
If you have questions that are beyond the scope of this help file, contacct us for additional support.
Want to make some customizations yourself?
It's fairly easy to customize any colors/fonts without lots of prior knowledge. If the customization you want to change isn't listed in the Theme Customizer, check the style.css file. We have a table of contents at the top that points out all of the sections within theme. You can also look-up styles using the "Inspect Element" tool in FireFox, Safari, Chrome, Edge etc. This will allow you to edit additional places within the theme.
You can use the "Web Inspector" tool available in all modern browsers: https://www.youtube.com/watch?v=nOEw9iiopwI
Frequently Asked Questions
If you've just installed the theme, but want your new site to look exactly like our Live Demo - you should import the demo data via the "Appearance > Import Demo Data" section. Once imported, your site should look exactly like our demo and have the same content. You can then start removing unwanted posts or content and add your own.Theme Setup Wizard Doesn't Work or Disappears?
If you've tried to import the demo data with the Theme Setup Wizard, and received an error during the process, or it simply disappeared, it means that your server isn't fully compatible with the importer.
At times, if the hosting server is using an old PHP version, the process can be incomplete. We require PHP version of at least 5.4, but we recommend version 5.6.x or even 7.x+. You can contact your hosting provider and ask to upgrade the PHP version for your site. Most hosts can provide PHP 7.x+ these days, and it increases overall performance as well.How to edit the homepage?
If your homepage is simply a list of posts and cannot be edited, simply create a blank page and set it as the static front page via the "Settings > Reading" panel. This should allow you to have more control on the layout and content of the homepage and will allow to edit it with Elementor.Where can I change the "Latest News" title on the Homepage?
If you display a dynamic index page instead of a "Static Front Page", you would have a "Latest News" heading within the header. If you want to change it, check out the question above and set a new static front page.What are the recommended image sizes and how do I change these?
The recommended image sizes are defined within the functions.php file and are:
- 1. Blog Featured Images - 900x500 px
- 2. Full Width Background Images - 1920x1000 px
- 3. Shop Images - 600x650 px
If you want to change one of those, make sure to apply the change of dimensions within the functions.php file of your theme (or Child Theme) and then run at least once the "Force Regenerate Thumbnails" plugin to update all images.
Note - In addition to the image sizes noted above, we also use a more flexible size for the "Title Area" background image. This can be 1920px wide (to fit a wide range of screen sizes) and anywhere between 500px to 1200px tall. The height of those images is basically fluid and is defined by the top/bottom padding you are using on your "Title Area".
Still have more questions? Please visit our Support Center, and contact us!
Thanks again for purchasing our theme. Feel free to contact us with any questions, suggestions and issues!Follow Us Subscribe to our Newsletter Support