Xenon (WordPress Theme) v1.0 Documentation by “Daison”

“Xenon (WordPress Theme)”

Updated: August 2024
By: Daison

Thank you for purchasing my theme. If you have any questions that are beyond the scope of this help file, please feel free to contact me here. Thanks so much!

Table of Contents

  1. How to Install
  2. Required Plugins
  3. Home Page Setup
  4. Customizer (Editing Theme)
  5. Featured Images
  6. Widgets
  7. Sources and Credits
  8. Elements Not Included In Download

A) How to Install - top

  1. Log in to the WordPress Administration Panel.
  2. Select the Appearance panel, then Themes.
  3. Click Add New button
  4. Click Upload Theme.
  5. Locate xenon.zip on your machine using the "Choose File" button.
  6. Click "Install Now"

B) Required Plugin - top

This theme requires one plugin namely Xenon Theme Plugin for theme specific features.

You will be prompted to install this plugin.






Using Contact Form 7 (Recommended Plugin)

  1. After installing Contact Form 7 go to Contact > Add New. Give your form a title, go to the mail tab to see if you are using the right email address and then click the save button. More information about the plugin can be found here: Docs

  2. Copy the generated shortcode, Paste it in your contact page.

MailChimp for WordPress (Recommended Plugin)

More information about the plugin can be found here: MailChimp for WordPress

Making your form like the demo:

1. Copy the code below:

			<h1>Subscribe To Our Weekly Newsletter</h1>

			<p>Get the latest posts from our blog straight to your inbox!</p>
			
			<div class="xenon-email-wrap">
			
			<p>
				<input type="text" name="NAME" placeholder="Your name" required />
			</p>
			
			<p>
				<input type="email" name="EMAIL" placeholder="Your email address" required />
			</p>
			
			</div>
			
			<p>
				<input type="submit" value="Subscribe" />
			</p>
			
			<span class="no-spam">We hate spam!</span>

2. In the admin go to MC4WP > Form and paste the above code in the Form code field.



C) Home Page Setup - top

First you have to create the homepage.

  1. Add New Page: Go to pages and select "Add New".
  2. Give It A Title: Give the new page a title, Something like "Homepage".
  3. Template: From the Template drop down list select "Home Page".
  4. Publish: You are almost there, Now click the "Publish" button.


The last few steps.

  1. Settings: Go to "Reading".
  2. Static Page: Select the option illustrated in the image below.
  3. Front Page: Select the page you created above, I called my page "Homepage" (This is the title of the page you created above)
  4. Save Changes: Click the "Save Changes" button.


D) Customizer (Editing Theme) - top

After activating the theme go to Appearance > Customize or click the "Customize" button highlighted below, to start customizing the theme.





The Site Identity panel is first. All settings are explained below.





  1. Logo: Here you can upload your logo.
  2. Site Title: The name of your website, this will be used if no logo is uploaded. It is also used for SEO reasons, so give your site a title whether you have a logo or not.
  3. Tagline: Your site's tagline.
  4. Light Logo: Upload a light logo to use in the dark mode of the theme.
  5. Site Icon: Also known as a favicon, this is the small icon displayed in the browser tab.

Don't forget to save your settings by clicking on the "Publish" button.


The Menus panel is second. All settings are explained below.





  1. Menu Name: The name you gave to your menu.
  2. Menu Location: Select where you would like this menu to be displayed.

Don't forget to save your settings by clicking on the "Publish" button.


The Header panel is third. All settings are explained below.





  1. Header Select: Use a normal white header or use your chosen color from "Basics" as the background (Homepage layout three uses the color header by default).
  2. Header Search Form: Use this setting to show or hide the search form displayed in the header.
  3. Dark/Light Icons: Show or hide the dark & light mode icon.
  4. Sticky Header: This is for sticking the header to the top of the page while scrolling.

Don't forget to save your settings by clicking on the "Publish" button.


The Basics panel is fourth.

In the Basics panel you'll find the Design section. All settings are explained below.





  1. Homepage: Select a layout for the homepage.
  2. Post Page: You can choose the post page layout here.
  3. Linear Gradient Colors: Select two colors used by gradient buttons and Icons. The first color will also be used by links.


In the Basics panel you'll also find the Featured Categories section. All settings are explained below.





  1. Select a category: Select a category for the featured area on the homepage.


In the Basics panel you'll also find the Recent Posts section. All settings are explained below.





  1. Recent Posts Number: Enter the number of recent posts you would like to display on the homepage.


In the Basics panel you'll also find the Related Posts section. All settings are explained below.





  1. Related Posts Section Heading: A heading for the related posts displayed on the single post page.

Don't forget to save your settings by clicking on the "Publish" button.


The Footer panel.

In the Footer panel you'll find the Social Media & Footer Logo section. All settings are explained below.





  1. Social Media: Paste links to your social media profiles. These links will be used by the icons in the footer. Icons will not be displayed if no link is provided.


In the Footer panel you'll also find the Copyrights Text section. All settings are explained below.





  1. Copyrights Text: Enter your copyrights text here. Leave empty for theme to generate the text for you.

Don't forget to save your settings by clicking on the "Publish" button.


The Widgets Panel panel. All settings are explained below.





  1. Shop Widgets: Widgets displayed in the shop sidebar.
  2. Sidebar Widgets: Widgets displayed in the sidebar of all pages that have a sidebar.
  3. Hidden Sidebar Widgets: This is for widgets in the hidden sidebar, displayed when the burger menu icon in the header is clicked. The burger menu icon will not be displayed if no widgets are added to this section.

Don't forget to save your settings by clicking on the "Publish" button.


The Homepage Settings panel. All settings are explained below.





  1. Your homepage displays: Select a static page here if you want your homepage to look like the demo.
  2. Homepage: Select the homepage you created here if it's not selected already.
  3. Posts page: Select a page to display your posts (This is optional)

Don't forget to save your settings by clicking on the "Publish" button.


The Homepage Settings panel. All settings are explained below.





Additional CSS: You can add your own CSS code here.


Don't forget to save your settings by clicking on the "Publish" button.


E Featured Images - top

Featured Images

If you installed Xenon on a website that already has content, your thumbnails will probably not look good. This is how you fix them.

The above steps should make your thumbnails work with the theme.


F) Widgets - top

This theme comes with three widgets and two widgetized areas.

These are the widgets:

  1. Promola Popular Posts:

    This is for displaying popular posts with thumbnails.

  2. Promola Recent Posts:

    This is for displaying recent posts with thumbnails.


G) Sources and Credits - top

I've used the following resources.

H) Elements Not Included In Download - top

Once again, thank you so much for purchasing this theme. As I said at the beginning, I'd be glad to help you if you have any questions relating to this theme. If you have a more general question relating to the themes on ThemeForest, you might consider visiting the forums and asking your question in the "Item Discussion" section.

Daison

Go To Table of Contents