After downloading you should have the magazine-news-byte.zip(free) or magazine-news-byte-premium.zip(premium) file depending upon your version. This is your main theme file which contains all of the required templates and images required for the theme to function properly.

Premium users: Click here to download your premium theme zip file.

Upload the theme

1. Go to Appearance > Themes in the WordPress Dashboard
2. Click on the Add New button
3. Click on the Upload Theme button at top
4. Select the magazine-news-byte.zip or magazine-news-byte-premium.zip file you downloaded above
5. Click Install Now

Activate the theme

1. Go to Appearance > Themes in the WordPress menu
2. Hover over the Magazine NewsByte thumbnail and press the Activate button

Troubleshooting:
If you are getting a 'Broken Theme' or 'Stylesheet Missing' error, this simply means that you haven't uploaded the correct zip files. Double check and make sure you upload the exact files as mentioned above.

Troubleshooting:
If you are getting a 'Exceeds the maximum upload size' error, this means that your hosting company has a restriction on size of uploaded files (sometimes this limit can be as set as small as 2MB). Open a support ticket with your hosting company asking them to increase the PHP upload size to atleast 8MB. Most hostings will do it for you within a couple of minutes.
Alternately you can upload the theme using your hostng cpanel or using FTP.

Additional information: WordPress Codex – Adding New Themes

Alternative Method - Using FTP

Some servers place a restriction on the file size you can upload via web interface. If you are getting a 'exceeds the maximum upload size' error uploading the theme via WordPress Admin, you can upload it using a FTP program like Filezilla.

1. Unzip magazine-news-byte.zip or magazine-news-byte-premium.zip on your computer.
2. Start FileZilla and login to your server using FTP details provided by your Hosting Company (hostname, FTP Username, FTP Password).
3. In left panel, browse to your computer folder where you have the unzipped theme folder from Step 1 above
4. In right panel, browse to your wp-content/themes folder. Most servers have it in the www folder
5. Right click your local folder and click upload. It will take a few minutes to upload the theme.Screenshot showing how to upload 'Chromatic' Theme
6. Once upload finishes activate your theme following the steps mentioned above

Magazine NewsByte works best with its companion plugin HootKit

HootKit is a wpHoot plugin which adds various functionalities to Magazine NewsByte theme such as widgets and sliders.
It is highly recommended to install HootKit plugin to maximize Magazine NewsByte's potential.

Lightweight & Fast
HootKit sliders and widgets were developed and styled specifically for Magazine NewsByte theme, so they fit Magazine NewsByte perfectly.
This keeps your site lightweight and fast without adding any bloated code.

1. In your wp-admin, go to Appearance > Install plugins
2. Click the Install link below HootKit.
3. Once HootKit is installed, Activate it.

Alternate Method: You can also install HootKit by going to Plugins > Add New in your wp-admin. Search for 'Hootkit' in the search box on top right. Once HootKit is shown in results, click Install Now

1. In your wp-admin, go to Appearance > Customizer.
2. Click on the Setup & Layout section.
3. Select Boxed or Stretched layout for your site.
4. Tip: You can also select Sidebar Layout for various sections of your site here.

1. In your wp-admin, go to Appearance > Customizer.
2. Click on the Colors section (for Free version) or Backgrounds section (for Premium version)
3. Set your Site Background and Content Box Backgrounds here.

   Site background is more prominently visible when Site Layout option is set to Boxed layout in the steps above.

When you install Magazine NewsByte, you may not see any menu depending on your WordPress settings. Displaying a Custom menu is very simple with WordPress and Magazine NewsByte

Setup Custom Menu

1. In your wp-admin, go to Appearance > Menus
2. Click on the create a new menu link.
   (If you already have an existing menu from a previous installation, jump to Step No. 6)
3. Give a name to your menu in Menu Name and click Create Menu button
4. Now add the pages, categories, custom links you want from the leftside of your screen to this menu.
5. Click Save Menu
6. Click Manage Locations tab at the top
7. Select the menu you just created in the Primary Menu dropdown.
8. Click Save Changes

1. In your wp-admin, go to Appearance > Customizer.
2. Click on the Header section.
3. In Menu Location setting, select where you want the menu to be displayed.

Display Menu Item Descriptions

Magazine NewsByte can display small descriptions below each menu item label. To enter menu item descriptions, make sure Descriptions checkbox is checked in Screen Options dropdown at the top.

991 Menu Icons Premium Version

Premium version comes with the ability to add menu icons. In the Appearance > Menu screen, simply select the icon from dropdown in each menu item.

1. Go to Appearance > Widgets in your wp-admin
2. Add Widgets to Topbar Left and Topbar Right Widget Areas.
3. Once you Save Widgets, Topbar will be displayed automatically on the website.

Topbar will be automatically hidden if both Left and Right areas are empty.
If only one of these areas has content, then the Topbar content will be centrally aligned.

Magazine NewsByte theme comes with a Frontpage which is made up of several widget areas and sliders. You can easily arrange them in any order, and apply backgrounds/parallax effects to them.

Please install the HootKit plugin to activate various widgets that come with Magazine NewsByte theme.
(Ref: How to install HootKit plugin)

We will use the demo homepage as an example for this tutorial. Take a look at the image below to understand how the frontpage layout has been set up. Click on the image below to open a bigger view.

Click here to see a screenshot of individual widget settings used in the above image. (Ref: Demo Content)

1. Setting Up The Layout

1. In your wp-admin, go to Appearance > Customizer.
2. In the Frontpage - Modules section, you will find the options to manage the layout.
3. You will notice that for the demo blog, we have not used all the modules. (You can disable modules by clicking the eye icon.)
4. Click the dropdown icon next to each module for more options.
5. You can also add Module Backgrounds and apply Parallax effect to the background image.
6. Within Module Backgrounds, if you are selecting a background and want to modify font color to complement the new background color, you can try the Custom Font Color options. This will try to change the font color for the module.
   (Note: Some plugins/widgets may have css which may not be compatible with this option. In such cases, please contact wphoot support).
7. Save the Changes.

2. Adding a Full-Width Stretched Slider

1. In your wp-admin, go to Appearance > Customizer.
2. Go to Frontpage Modules section.
3. Click the dropdown of an area for example: Widget area A
4. Set it to 'full-width' layout.
5. In your wp-admin, go to Appearance > Widgets.
6. Add Hootkit > Slider Images widget to Widget Area A.
   If you do not see the HootKit > Slider Images widget, then please install the HootKit plugin first.
   (Ref: How to install HootKit plugin)

3. Widget Area Content

1. In your wp-admin, go to Appearance > Widgets.
2. Add Widgets to the Frontpage Widget Areas (A-L)
   Note that the only the Active widget areas will be displayed. You can activate/deactivate a widget area by clicking the 'eye' icon as shown in the section above.

4. Frontpage Content Module

The Frontpage Content module will either display your Blog or the Static Page Content based on your selection in wp-admin > Settings > Reading .

For more details, see the next section.

Setup Separate Homepage

1. In your wp-admin area, click Pages > Add New to create a new page.
2. Give this page a Title. (Lets call it "My Home Page")

   You can enter page content as well. This will be displayed as the FrontPage Content module (see Frontpage Content Module above).

3. Publish the page.
4. In your wp-admin area, go to Settings > Reading.
5. Select the Static Page option.
6. Select the page you just created in Step 2 above in the Front Page drop-down.
7. Save the Changes.

Setup Separate Blogpage

1. In your wp-admin area, click Pages > Add New to create a new page.
2. Give this page a Title. (Lets call it "My Blog")

   You can enter page content as well. This will be displayed as description in the header on the Blog Page. (click here to see screenshot)

3. Publish the page.
4. In your wp-admin area, go to Settings > Reading.
5. We have already selected the Static Page option in "Setup Separate Homepage" section above.
6. Select the page you just created in Step 2 above in the Posts Page drop-down.
7. Save the Changes.

Magazine NewsByte displays archive descriptions (optional) in the header while viewing the archive index

Category / Tag Description

1. In your wp-admin area, click Posts > Categories.
2. Click the Category name to edit the category.
3. Enter the description in the Description textbox.
4. Save the Changes.

Category Image

You can dsplay a parallax image behind the category Header area (Title/Description) by assigning a Featured Image to the Category.

1. In your wp-admin area, click Posts > Categories.
2. Click the Category name to edit the category.
3. Click the Upload/Add Image button in the Featured Image field.
4. Save the Changes.

Blogpage Description

For entering Blog descripion, please refer to the Setup Blog Page section above.

Installing demo content is the easiest way to setup your theme and make it look exactly like the Demo Site.
New users often find it more helpful to quickly edit content instead of creating site from scratch.

The demo content includes widgets which are a part of the HootKit plugin
Hence, it is highly recommended to install and activate the HootKit plugin before running the demo import to make sure all the widgets are properly imported.
(Ref: How to install HootKit plugin)

1. Select your theme version in the dropdown below.
   Next, right click on each of the 3 files which appear and click Save Link As to save them on your computer:
   Select your Theme Version: -- Theme Version --Magazine NewsByte (Free)Magazine NewsByte Premium

   Magazine NewsByte Import Files (Free version):
   ( right click on each of the 3 files and click 'Save Link As' to save them on your computer
   WordPress Data (.xml) (Posts, Pages, Menus, Images)
   Customizer Settings (.dat)
   Widgets (.wie)
   

   Magazine NewsByte Import Files (Premium version):
   ( right click on each of the 3 files and click 'Save Link As' to save them on your computer
   WordPress Data (.xml) (Posts, Pages, Menus, Images)
   Customizer Settings (.dat)
   Widgets (.wie)
   
   Reference Screenshots: Widgets Screenshot (Magazine NewsByte Theme)
   (You can take a look at this screenshot to understand how each widget was setup on the demo blog.)
   
2. Install the One Click Demo Import plugin
   • In your wp-admin, go to Plugins > Add New
   • Search for One Click Demo Import in the search field on top right.
   • Click Install Now next to the plugin in search results.
   • Click the Activate button which appears once the install finishes.
3. Upload files and import content
   • In your wp-admin, go to Appearance > Import Demo Data
   • Upload the 3 files you downloaded in Step 1 above.
   • Click Import Demo Data button only once.
   • This process will take some time. Please do not navigate away or close the window till the Import process finished.

Upgrading from Free to Premium version is pretty straight forward. Simply install the Premium theme like described above, and activate it.

Customizer Settings

Technically speaking, the Free and Premium versions are 2 separate themes. This is why the Customizer settings are stored separately by WordPress for Free and Premium versions.

Nav Menus

Menus are retained, but they may lose their location on switching themes (free to premium).

Widgets

Widgets are automatically transferred when you upgrade from free to premium.

In small number of cases, widgets may not transfer properly.
Please note, your widgets are not deleted. They simply do not get assigned properly to the correct widget areas. This is due to the way WordPress stores widgets in the database. If you do not see widgets on upgrading, you can do one of these 2 things:

1. In your Appearance > Widgets screen, you will see the widgets from Free theme in the Inactive Widgets area towards the bottom left of the screen. Simply drag and drop them back into the proper Widget Areas.
OR

2. If you have a lot of widgets, you can import them using the following method:

• Activate the free theme version.
• Once free theme is activated, install the Widget Importer Exporter plugin.
• Activate the plugin and go to Tools > Widget Import Export
• Click Export Widget button and save the .wie file to your computer
• Activate the Premium theme, and go back to Tools > Widget Import Export.
• Upload the .wie file you created in above step, and click the Import Widgets button.

You can update to the latest version of your Premium Theme using either of these 2 methods:

Manual Update

1. Download the latest version (.zip format) from the My Account page on wphoot.com (click the My Account link visible in top Menu when you are logged in).
2. Upload it to your site using the instructions provided above.

One Click Update (Preferred)

You can update your premium theme with the click of a button right from inside your wp-admin area (similar to the way you update free themes from wordpress.org). You will need to input the license key on your site to activate One Click updates.

» How to find your License Key

You can find your license key at any of these places

• On the landing Purchase Receipt page when you make the payment.
• In the welcome email you received when you made the purchase
• You can also find your license keys on the My Account page on wphoot.com (click the My Account link visible in top Menu when you are logged in)

» Activating One Click Update on your site

1. In your wp-admin area, go to Appearance > Hoot Theme Manager.
2. Enter your License Key and click the Save License Key button
3. You can now Activate/Deactivate the license key for this specific site by clicking the Activate License Key for this Site button

» Updating the site

You will get a notice within your wp-admin area once a new version is available. Simply click the update now link to update the theme.

How to install Child Theme

1. Download the sample Magazine NewsByte child theme from above link to your computer.
2. Upload and activate the child theme. (See Theme Installation section if you need help installing a theme.)

Switching between Parent and Child Theme

Since WordPress stores customizer settings separately for child and parent theme, you may want to port Customizer settings when you first switch from parent to child theme (or vica versa). Fortunately our premium version comes with a simple Import/Export feature.

1. Install and activate your child theme.
2. In your wp-admin area, go to Appearance > Hoot Theme Manager
3. Under Export Customizer Settings copy your parent theme's customizer settings
4. Paste this code in the Import Customizer Settings
5. Click Import Settings button.

Installing demo content is the easiest way to setup your theme and make it look exactly like the Demo Site.
New users often find it more helpful to quickly edit content instead of creating site from scratch.

The demo content includes widgets which are a part of the HootKit plugin
Hence, it is highly recommended to install and activate the HootKit plugin before running the demo import to make sure all the widgets are properly imported.
(Ref: How to install HootKit plugin)

Automatic One Click Demo Install (Recommended)

1. Install the One Click Demo Import plugin
   • In your wp-admin, go to Plugins > Add New
   • Search for One Click Demo Import in the search field on top right.
   • Click Install Now next to the plugin in search results.
   • Click the Activate button which appears once the install finishes.
2. In your wp-admin, go to Appearance > Import Demo Data
3. Click Import Demo Data button only once.
4. This process will take some time. Please do not navigate away or close the window till the Import process finished.

Manual Install - Method 1

1. Install the One Click Demo Import plugin
   • In your wp-admin, go to Plugins > Add New
   • Search for One Click Demo Import in the search field on top right.
   • Click Install Now next to the plugin in search results.
   • Click the Activate button which appears once the install finishes.
2. Upload files and import content
   • In your wp-admin, go to Appearance > Import Demo Data
   • Click the Switch to Manual import link on this screen
   • Upload the 3 files you downloaded in Step 1 above.
   • Click Import Demo Data button only once.
   • This process will take some time. Please do not navigate away or close the window till the Import process finished.

Manual Install - Method 2

If for some reason the One Click Demo Plugin does not work as expected on your site, you can install the demo content manually using these original plugins:

1. Select your theme version in the dropdown below.
   Next, right click on each of the 3 files which appear and click Save Link As to save them on your computer:
   Select your Theme Version: -- Theme Version --Magazine NewsByte (Free)Magazine NewsByte Premium

   Magazine NewsByte Import Files (Free version):
   ( right click on each of the 3 files and click 'Save Link As' to save them on your computer
   WordPress Data (.xml) (Posts, Pages, Menus, Images)
   Customizer Settings (.dat)
   Widgets (.wie)
   

   Magazine NewsByte Import Files (Premium version):
   ( right click on each of the 3 files and click 'Save Link As' to save them on your computer
   WordPress Data (.xml) (Posts, Pages, Menus, Images)
   Customizer Settings (.dat)
   Widgets (.wie)
   
   Reference Files: Widgets Screenshot (Magazine NewsByte Theme)
   (You can take a look at this screenshot to understand how each widget was setup on the demo blog.)
   Customizer Settings (.txt) (Magazine NewsByte Theme)
   (This can optionally be used to import Customizer Settings via Appearance > Hoot Theme Manager screen.)
   
2. XML File: Install the WordPress content
   • In your wp-admin, go to Tools > Import
   • Click Run Importer under WordPress option. (If instead of 'Run Importer', you see 'Install Now' option under WordPress, click it to install the plugin. Once this finishes, you will see the 'Run Importer' link)
   • Upload the .XML file you downloaded in Step 1 above. Click Upload file and Import.
   • In the next step, select the Download and import file attachments checkbox and click Submit
3. DAT File: Install and run the Customizer Export/Import plugin
   • In your wp-admin, go to Plugins > Add New
   • Search for Customizer Export/Import in the search field on top right.
   • Click Install Now next to the plugin in search results.
   • Click the Activate button which appears once the install finishes.
   • Go to Appearance > Customize > Export/Import > Export/Import
   • Upload the .DAT file you downloaded in Step 1 above. Select the Download and import image files checkbox.
   • Click Import Widgets
4. WIE File: Install and run the Widget Importer & Exporter plugin
   • In your wp-admin, go to Plugins > Add New
   • Search for One Click Demo ImportWidget Importer & Exporter in the search field on top right.
   • Click Install Now next to the plugin in search results.
   • Click the Activate button which appears once the install finishes.
   • Go to Tools > Widget Importer & Exporter
   • Upload the .WIE file you downloaded in Step 1 above.
   • Click Import Widgets

You can make One Page websites with menu items linking to different sections on the page. The page will scroll down to a section on the page when the site visitor clicks a menu item.

See the Home menu link on the demo site to see Scrollpoints in action.

This is not just limited to menu items. You can manually add links as well to different sections on a page. For example, if you have a very large article, you can add links at the top to different article sections. When a visitor clicks on any of these links, the page will automatically scroll down to the corresponding section.

Click here to know more about Scrollpoints - How to add them to menu and/or create manual links.

Images (jpg, jpeg, gif, png) in Lightbox

Lightbox gets activated automatically on installing Magazine NewsByte Premium. By default it opens all links pointing to images (.jpg .jpeg .gif and .png) in a standalone lightbox.

WordPress Gallery in Lightbox

When you create WordPress Galleries, Magazine NewsByte's Lightbox automatically converts the links to a lightbox gallery. Just make sure your gallery images link to Media File in the dropdown.

Disable Lightbox for specific images

You can disable a link pointing to an image simply by adding the no-lightbox class to the link.

Example: The original link added by WordPress (opens in lightbox)

<a href="http://my-site.com/image.jpg">Click Here to open Image</a>

Same link with the no-lightbox class added (opens normally in browser window)

<a href="http://my-site.com/image.jpg" class="no-lightbox">Click Here to open Image</a>

Disable Lightbox throughout Website

1. In your wp-admin, go to Appearance > Customizer
2. Click the Setup & Layout section. Check the Disable Lightbox checkbox.
3. Save Settings

Magazine NewsByte Premium lets you display a custom page for the default 404 Not Found page.

1. In your wp-admin area, go to Appearance > Customizer
2. Click the 404 Page section.
3. Select Custom 404 Page option.
4. In the dropdown, select the Page you want to use as your 404 page.
5. Save Settings

Once you have Saved the Settings, head over to Pages > All Pages to edit the content of this page.

1. Setup your Google Analytics account and get your tracking code.
2. In your wp-admin, click Appearance > Customizer.
3. Click the Custom Code section.
4. Copy and paste the Google Analytics tracking code to the Custom Javascript text box.
5. Check the Include Custom Javascript in Header checkbox
6. Save Settings

Logo Image

The logo image is automatically reduced to the maximum available width which is 500 pixel (40% of the 1380px grid) when it is in left. However there is no width restriction if the Primary area is set to None in Customizer > Header i.e. when the logo is center aligned.

Blog (Featured Images)

• Blog (Style 1 - Blocks 2 columns)
  • with Regular / Narrow / No Sidebar - 690 x 500 pixel
• Blog (Style 2 - Blocks 3 columns)
  • with Regular / Narrow / No Sidebar - 460 x 270 pixel
• Blog (Style 3 - Big)
  • with Regular Sidebar - 920 x 425 pixel
  • with Narrow / No Sidebar - 1035 x 425 pixel
• Blog (Style 4 - Medium) Premium Version
  • with Regular / Narrow / No Sidebar - 465 x 550 pixel (Non Cropped)
• Blog (Style 5 - Small) Premium Version
  • with Regular / Narrow / No Sidebar - 460 x 270 pixel
• Blog (Style 6 - Mosaic 2 column) Premium Version
  • with Regular / Narrow / No Sidebar - 695 x 500 pixel (Non Cropped)
• Blog (Style 7 - Mosaic 3 column) Premium Version
  • with Regular / Narrow / No Sidebar - 465 x 550 pixel (Non Cropped)
• Blog (Style 8 - Mosaic 4 column) Premium Version
  • with Regular / Narrow / No Sidebar - 465 x 550 pixel (Non Cropped)

Content Block Widget

• Style 1, 2 and 3
  • 1 Column Blocks Full Width Image
  • 2 Column Blocks 920 x 425 pixel
  • 3 Column Blocks 460 x 270 pixel
  • 4 Column Blocks 460 x 270 pixel
  • 5 Column Blocks 460 x 270 pixel
• Style 4
  • 1 Column Blocks 920 x 425 pixel
  • 2 Column Blocks 460 x 270 pixel
  • 3 Column Blocks 460 x 270 pixel
  • 4 Column Blocks 460 x 270 pixel
  • 5 Column Blocks 460 x 270 pixel

Custom code snippets to modify your theme can be added using Child Themes. Custom CSS can also be added from your wp-admin by going to Appearance > Customizer and clicking Custom Code section (for premium theme version) or Additional Custom CSS (for free theme version).

Must Read:
• How to add Custom CSS to your Theme
• How to add Custom PHP to your Theme

## Hide Title Area

Removing Title Area for specific Pages Premium Version

Sometimes you may not want to display the title area for some specific pages (for example, the checkout page of WooCommerce). In such cases you can disable the Title Area for specific pages from your wp-admin area.

Go to Pages/Posts > All and click the Page/Post you want to edit. On the Edit Page/Post screen, select the Hide Title Area for this Page option in the Page Options box.

In case you do not see Page Options box, make sure it is visible from the Screen Options dragdown button at the top right of screen.

Remove Title Area throughout the site

Add the following CSS to remove title area throughout your site.

#loop-meta {
  display: none;
}

Remove Title Area from all 'Pages' only

Add the following CSS to remove title area from all Pages on your Site.

.singular-page #loop-meta {
  display: none;
}

Remove Title Area from all 'Posts' only

Add the following CSS to remove title area from all Posts on your Site.

.singular-post #loop-meta {
  display: none;
}