Theme Documentation

Created: March 01, 2013. Last updated: Jan 01, 2019. Version: 3.3.1. Author: SaurabhSharma. email: xconsau@gmail.com

Introduction

First of all, let me thank you for showing your trust in NewsPlus theme and purchasing it. I have handcrafted this document to lessen your efforts in configuring and using this theme seamlessly. If you find any bug or issue which is beyond the scope of this documentation file, feel free to contact me at xconsau@gmail.com. Thanks so much!

Important: When you install and activate the theme, it doesn't automatically load the content as shown on live demo. It will be required to import/create content, add images, configure settings and widgets so that they appear like live demo. Below is a step by step guide on configuring theme content.

Table of Contents

• Install WordPress
• Install NewsPlus Theme
• Install Child Theme
• Install Required Plugins
• Import Dummy Data
• Create Category and Posts
• Create Home Page
• Create Blog/Archive Page
• Create Contact Page
• Create Recipe Post
• Create Navigation Menus
• Using Post Formats
• Using Widget Areas
• Custom Widgets
• NewsPlus Theme Options
• Shortcode Elements for King Composer
• Translating the theme
• HTML structure
• CSS files and structure
• Javascript files
• php files and their role
• Frequently Asked Questions
• Shortcode Reference
• Sources and Credits

Install WordPress

If you have not set up your WordPress installation yet, you can grab a copy of latest WordPress archive here. Next, go through the installation instructions inside readme.html file and set up your WordPress installation. A detailed installation guide can be found on official WordPress Site.

Install NewsPlus Theme

In order to install NewsPlus Theme, follow these steps:

1. Log in to your themeforest.net account and navigate to the "Downloads" section. Then click on the "Download" link of NewsPlus theme and choose "All files and documentation". Save this archive on your local machine.

2. Unzip/extract the download and look for the folder named 'newsplus.zip'. This is actual installable theme which you can upload to WordPress in next steps.

3. Log in to your WordPress site and navigate to Appearance > Themes. Click on the "Add New" button.

Add new theme

4. On the "Add Themes" page, click on the "Upload Theme" button. Next, click on "Choose file" and locate the newsplus.zip file for installation.

Upload Theme

Install Theme

Important: Do not activate the theme now. We will install child theme and will activate it.

Install NewsPlus Child theme

In order to install child theme, follow same procedure as shown above for the main theme. Instead of newsplus.zip, use newsplus-child.zip file. Once the child theme is installed, activate it from Appearance > Themes, as shown below:

Activate Chid Theme

Upon theme activation you will see a dashboard notice, prompting to install required and recommended plugins.

Install Required Plugins

Install Required Plugins

1. Click on the "Begin installing plugins" link inside the dashboard notice. You will see a plugin installer sceen, as shown below:

Required and recommended plugins

These plugins are required/recommended for proper functioning of features as shown on live demo of theme. Below is a quick detail about each plugin:

Plugin Name	Description
NewsPlus Shortcodes	This plugin is required for functioning of shortcodes and widgets in NewsPlus theme.
King Composer	This is a page builder plugin used for creating page layouts. All Home page demos shown on live demo are created using this plugin. The plugin is light weight, fast and very useful in creating multi columnar layouts. It also comes with lots of interface elements to be used in site pages.
Recommended Plugins (Optional)
Contact Form 7	This plugin is used on live demo for creating contact forms.
Post Views Counter	This plugin is used to show post views count on live demo.
WP Review	This plugin can be used to show user reviews about a post.

2. Click on the "Install" link of each plugin, or select all and choose "Install" option.

3. Once the plugins are installed, navigate to Plugins > Installed Plugins. Make sure the above mentioned plugins are activated. If not, click on "Activate" links for each plugin. Alternatively, you can activate these plugins by navigating to the plugins installer screen via dashboard notice.

At this stage, the theme is installed and the required plugins are installed as well. If you check the front end of site, you may see some unwanted widgets inside top header section of site. Nothing to worry. You can remove these widgets by navigating to WordPress Appearance > Widgets > Top widget area. Delete or pull out any unwanted widgets from this section. You can of-course place appropriate widgets in this section later on.

Import Dummy Data

If your site already contains enough posts and categories, you need not import dummy data. But if you wish to import all posts, categories and pages like live demo, you can import the XML file as described in the following steps:

Import dummy XML data

1. Navigate to WordPress admin's Tools > Import. If the importer is not yet installed, click on the "Install now" button, as shown below:

Install WordPress importer

2. Once the importer is installed, click on the "Run importer" link.

Note: The demo import files are located inside your main download archive's dummy_data folder

3. From the "Choose file" link, browse the /food/all_data.xml or /default/all_data.xml file as located inside your main download/dummy_data/ folder. If you wish to import only pages, then import pages.xml file from the respective folders.

4. Assign import data to existing user or you can create a new user.

5. Choose to import file attachments and import all data.

6. Upon successful import, your site will be populated by posts, categories, pages and other data similar to live demo. You just need to re configure some settings to show this data correctly.

If you do not wish to import dummy data, you can manually create posts and pages as described in next section of this documentation.

Import demo specific settings

The live demo shows different concepts of the theme in multiple demos like "Food", "Travel", etc. Each of these demos have some specific theme options settings for colors, layout and fonts. These settings are located inside your download archive's dummy_data folder. In order to import these settings, kindly follow these steps:

1. Log in to WordPress admin and navigate to Appearance > Theme Options

2. Click on the "Import/Export" tab.

Settings importer

3. Open settings import file from your main download/dummy_data/default/settings.txt. As an example, if you wish to import settings of "Food" demo, then open download/dummy_data/food/settings.txt file and copy all it's contents. Next, paste these contents inside the "Import new settings" field.

Paste settings data

4. After pasting the settings data, click on "Save Settings" button.

5. Finally, click on the "Update imported settings" button. This will import and update your new settings.

Update imported settings

Exporting current theme settings

In order to export current theme settings, navigate to Appearance > Theme Options > Import/Export. Then from the "Your current settings" field, copy all current settings and save them in a text file as backup. This content can be used later for imorting settings.

Create Category and Posts

Important: Skip this section if your site already contains posts and categories

This section describes how to create categories and posts for your WordPress site. But before that, a quick note about image preparation for featured images.

Image Preparation

Since the theme is responsive, images will be shown in fluid width. For best results, you can prepare images of around 800px to 1000px width and auto height. You can save these images in web optimized .jpg or .png format, and keep on your hard drive. These can be uploaded to the posts when required. Recommended size is 900 x 600px. Keeping images at slight 1.3x resolution in web optimized format will still keep your site fast, and the display will be good on retina devices.

Create a Category

Navigate to Posts > Categories. Next, create a new category (say, Featured) and click on "Add Category".

A newly created category will appear.

Finding a Category ID: Hover your mouse pointer on the category name and watch it's link in the status bar of your browser. You shall see a link as taxonomy=category&tag_ID=xx. This xx is the category ID. This category ID may be required in page templates and widgets where you need to show posts by category IDs. In Home pages, categories can be selected from the category dropdowns.

You can also find category IDs by installing this useful plugin Reveal IDs. You can follow same procedure for creating more categories like News, Photography, Designing, Blog etc. Let's create some posts for our "Featured" category.

Create a Post with Featured Image

1. Navigate to Posts > Add New. Next, enter a Post Title and Post Content.

2. Scroll down to the bottom right side of page. You will see a panel for "Featured Image". Click on the "Set featured image" link.

A media uploader will appear. You can either Upload new image files by dragging them in the upload box, or set already uploaded images from the 'Media Library' section. After choosing an image, click on the 'Set featured image' button.

The newly set featured image will appear inside the "Featured Image" panel.

3. Finally, assign the post to an appropriate category (in our case, Featured) and click on "Publish" button.

You can repeat same procedure for creating more posts in different categories. i.e. Create a post, set featured image, and publish it in appropriate category. Once you have enough posts and categories, they can be displayed in various sections of the site.

Create Home Page

Right now, your site will be showing default posts on Home page. This is because we haven't created a Home page yet. It will be required to create a Home page and set it as front page. Before creating Home page, make sure you have installed and activated the King Composer Plugin. This plugin is used to create Home pages as shown on live demo.

1. Navigate to Pages > Add New

2. Enter a title for your home page. Say, "Home".

3. Click on the "Edit with KingComposer" button to switch to the Page Builder mode.

Switch to page builder mode

4. Click on the "Sections/Templates Library" button at the bottom of page builder screen.

Open Templates Library

5. A Templates Library panel will open from which you can load templates. Select the "Page" content type from the "Content Type" drop down, as shown below:

Choose Content Type

6. If you have imported dummy data XML, all live demo pages and posts will be available inside "Page" and "Post" content type (depending upon whether you have imported pages or all data XML.

7. In order to insert your desired layout as shown on live demo, type the page name in search field.

For example, you like the Home 2 layout and want to use it as Home page. Then inside search field, type "Home 2" and hit enter key.

Choose your Home page

8. From the results you can choose the page with correct name, Home 2. The pages with "- sb" name indicates that the page uses a sidebar, whereas normal page name means it is a full width page with no sidebar. i.e. "Home 2" is a full width page, and "Home 2 - sb" is a page with sidebar. In order to use the page, hover your mouse on page thumbnail and click on the "Clone" button.

Use a page template

9. The page will be loaded, as shown below.

Page template loaded

10. Since this template is for a full width layout, it will be required to assign proper setting for a full width page. For that, navigate to the "Page Attributes" panel and choose the "Page - full width" template from the "Templates" drop down menu.

Assign full width page template

11. With rest of the settings as default, publish the page by clicking on the "Publish" button. Your page will be published.

Important: The page may still not show proper posts because we have not yet edited the content. For that, follow these next steps.

Editing contents of Home page

1. Return back to the page editing screen and click on the edit link of any element.

Edit an element

2. The element's individual settings panel will open. This is a visual interface for the shortcode element which is inserted in the page. You can choose and assign parameters via this Visual interface for the shortcode element.

Visual interface for the shortcode element

3. While most settings shall remain default, you will mainly need to change categories (or the criteria on which posts are fetched). For that, scroll down inside the "Query" tab and choose categories for your posts.

Edit shortcode element settings

4. After choosing appropriate categories or tags, save the panel and return to main page screen.

5. Follow same procedure for other post elements like "Posts Slider", "Posts Module", "Posts Tile Grid". These all have a "Query" tab in which you can build your own criteria or query for showing posts.

6. In order to edit a title of post section, click on the edit link of "Title" element and change the heading name as desired.

Click on edit link of Title element

Edit a title element

7. After editing all elements of the page, hit "Ctrl + S" so that page builder saves these settings. You can directly update the page too but it is recommended to save them using "Ctrl + S" first. This forces page builder to detect any changes and save them in cache.

You can remove elements if not required, and you can also rearrange the rows up or down as desired. New sections can also be added if you wish to combine two three styles in a single row. For in depth documentation on using the King Composer page builder, please check the official documentation.

At this stage, the Home page is created and published. But your site still shows posts on Home page and not this page. This is because we have not set this page as front page.

Set Home pages as front page

1. Navigate to Settings > Reading > Front page displays > A static page.

2. Set Front page as "Home", and leave Posts page to blank.

Set front page

3. Save these settings and check the site. Now your site shall show the newly created Home page.

Create Blog/Archive page

A blog or archive page can be created using built in page templates and providing category IDs inside page options panel. Below are some basic steps for creating a blog or archive page:

1. Navigate to Pages > Add New.

2. Enter a title for blog page. Say, "Blog".

3. Leave content section empty, and scroll down to Page Options > Archive and Blog Options panel.

Page options for blog

4. Inside "Category IDs to fetch Archive or Blog Posts", enter numeric category IDs for Blog posts. (E.g. 3, 4, 7). You can use -1 or leave blank to show posts from all categories.

5. Inside "Posts per page", enter a number of posts to show. E.g. 10.

6. From the Page Attributes panel > Template, select a Blog or Archive template and publish the page.

Assign a page template for blog

7. After publishing the page, view it in browser. It will show posts from the Categories as provided inside the Page Options Panel.

Create Contact page

NewsPlus comes with a built-in ajax/php contact page template. In order to use this template, follow these steps:

1. Navigate to Pages > Add New. Next, enter a title for contact page. Say, "Contact us".

2. Inside content editor, you can place any custom markup or text that shall appear just above the contact form.

3. From the Page Attributes > Template, select a template called "Page - Contact", and publish the page.

This will create a contact form with ajax/php form validation.

Setting your email address and custom mail sent message

In order to configure your email address, navigate to Appearance > Theme Options > Contact. Here you can provide email address, Google Map location code, and mail sent message.

Contact page settings

4. Finally, scroll down and click on "Save Settings" to save these settings

Create Recipe Post

One of the live demos of NewsPlus theme is based on Food/Recipe blog. The recipe posts on this demo are created using King Composer and the Recipe Generator add on. In order to create such recipe post, kindly follow these steps:

1. Log in to WordPress admin and navigate to KingComposer > General Settings. Then enable the "Post" option for Supported Content Types, and save settings. This will enable King Composer for the posts.

2. Navigate to Posts > Add New. Next, enter a title for the post.

3. Click on the "Edit with King Composer" button and switch to the page builder mode.

4. Click on the "Elements" button for adding an element.

Add new element

5. Click on the the "NewsPlus" tab and insert the "Recipe Generator" element.

Add recipe generator

6. The Recipe Generator element will be added to the page. Next, hover the mouse pointer on arrow icon and click on edit button of the recipe generator.

Edit recipe generator

7. A recipe generator settings panel will open. Click on each tab of this panel and configure your recipe settings and data as required. For example, click on the "Recipe Meta" tab and add the cuisine, category, cooking method, cooking time, etc. as required.

Edit recipe data

8. After adding necessary recipe data, save the panel and return to the post edit screen.

9. Now we need to add recipe method or instructions. For that, click on the "Add recipe method" button.

Add recipe method

10. A new recipe method block will be added. Click on the "Add Element" link for adding a new element in recipe method.

Add recipe method element

11. A library panel will open from which you need to add a new element. Inside search box, type "Text" so that a text block element appears. Click on that element for inserting it into the recipe method.

Add text block

12. Inside the text block, add content for your recipe method. You can add images, text, or any media as required.

Add recipe method content

13. After adding text content, save the panel and return to the post edit screen.

14. You can duplicate same block by clicking on the "Double this section" icon, and edit them later.

Duplicate a section

15. If you wish to organize recipe methods into sub groups, click on the "Open Settings" icon and provide a recipe method title.

Add recipe method title

Add recipe method title

16. After making necessary changes, publish the post and check on site.

The recipe method section is not just limited to a text block. You can add many other elements like a slider, video, tabs, accordion, twitter feed, etc. If you find any difficulty in creating a recipe post, simply import dummy data of food blog and start by loading a post template from the "Templates" section of page builder.

Create Navigation Menus

NewsPlus support WordPress menus in two locations. Primary menu in header section, and Secondary menu inside top utility section. Let's see how to create and use them.

1. Navigate to Appearance > Menus.

2. On the right side, you shall see a form for adding new menu. Enter a menu name; say "menu-1" and click on "Create Menu" button.

Create new menu

3. Next, assign this menu to any of the available theme locations. i.e. Primary menu or secondary menu.

Assign menu location

4. After assigning a theme location, save the menu. Next, add pages or custom links to the menu as required.

Tip: You can drag menu items up-down to manage order of appearance. You can drag them left-right to set as sub-page.

After adding menu items, save the menu.

Creating a Mega Menu

The theme supports mega menu with the help of CSS classes. In order to create a mega menu, follow these steps:

1. Navigate to Appearance > Menus

2. Click on the "Screen Options" tab on top right corner. From this panel, enable the "CSS Classes" checkbox. Next, close the panel.

Enable CSS Classes

3. Create a new menu (using steps as shown above), or edit an existing one.

4. Expand the main menu item under which you wish to set a mega sub-menu. Inside "CSS Classes" field, provide a class name as mega-menu. Additionally, provide a column class as mega-5col, as shown below:

Add CSS Classes

The mega-menu is a required class name, whereas mega-5col can be changed to mega-2col, mega-3col or mega-4col. i.e. Up to 6 columns are supported in mega menu. You can add a full-width class name for showing a 100% width menu. For example mega-menu mega-5col full-width will show a 5 columnar menu in full width. In this documentation we will take example of 5 columnar mega menu.

5. After adding the class, close the menu item.

6. Next, add a menu item as sub-menu, just under this mega menu item. Say "Column 1 parent". This will be the parent link of first column.

Add child menu items

7. Under "Column parent 1", set more sub-menu items. These will appear as list under the first column.

Set child items of first column

8. Following the same procedure, make 4 more columns by adding a parent item and child items under it.

Add up to 5 mega menu columns

9. After adding menu items, Save the menu. You shall now see the mega menu on front end.

Using Post Formats

Post formats are used to style and display a post according to a specific content. NewsPlus supports 2 Custom Post Formats other than the "Standard" post format. These post formats can be set from the "Format" panel of your post editor. Let's see how to use post formats.

1. Video Post Format

Video post format can be used to display a self hosted Video using oEmbed feature. WordPress supports video embedding using oEmbed. In order to create a Video post, follow these steps:

a. Create a new post and assign a post title. Say, "My Video Post".

b. Next, scroll down to the "Post Options > Post Content Options" panel.

c. Inside "Video URL", provide a full URL of the hosted Video. For example, http://vimeo.com/41369274

Video URL option

d. From the "Format" panel on right side, choose "Video", and Publish the post.

Publish Video Post

Your post will show a standalone video player as provided by their respective video sites. The theme supports all major video formats that are supported by WordPress Embeds.

Using Widget Areas

Widget area is a section where you can use widgets for the theme. NewsPlus supports 15 widget areas in different locations. Additionally, we have an option for creating Exclusive Widget Areas for header and sidebar section that can be used on different pages and posts.

In order to access widget areas, navigate to Appearance > Widgets. You shall see available widget areas, as shown below:

These are the default widget areas. The theme will use these default widget areas when no exclusive widget area is defined for a page or post.

Important: Please be aware that blog related pages like author, archives, date, category etc. will use these default widget areas. Exclusive widget areas are only for Pages and Single Posts.

Let’s have a quick look on each widget area:

Widget Area	Description
Top widget area	The top most widget area above site body. Can be used for wide advertisement banners.
Fixed widget area left	The fixed widget area on left side of browser. This is located outside site container, and can be used for floating vertical ads.
Fixed widget area right	The fixed widget area on right side of browser. This is located outside site container, and can be used for floating vertical ads.
Default Header Bar	The default header widget area. (When two columnar header type is used)
Default Header Column 1	First widget area in header section
Default Header Column 2	Second widget area in header section
Default Header Column 3	Third widget area in header section
Widget area before content	Widget area appearing before main content and sidebar
Widget area after content	Widget area appearing after main content and sidebar
Default Sidebar A	The default Sidebar A widget area.
Default Sidebar B	The default Sidebar B widget area
Default Secondary Column 1	First widget area of the footer section.
Default Secondary Column 2	Second widget area of the footer section.
Default Secondary Column 3	Third widget area of the footer section.
Default Secondary Column 4	Fourth widget area of the footer section.

Exclusive Widget Areas

As mentioned earlier, NewsPlus supports Exclusive Widget Areas for header and sidebar section. As an example, let’s create an exclusive widget area for "About Us" page.

1. Navigate to Pages > Add New. Next create a new page called "About Us".

2. Scroll down to the Page Options > Sidebar Options panel, and enable the "Create an exclusive sidebar for this page" option, as shown below:

Finally, Publish the page.. This will register one exclusive widget area with the name "About Us".

The newly registered sidebar will now appear inside the dropdown menu for "Available widget areas for Sidebar". It will be required to select this new sidebar and update the page one more time.

In order to use widgets on these sidebars, navigate to Appearance > Widgets. You shall now see one more sidebar widget area added to the theme.

Now you can drag and use appropriate widgets into this sidebar. Following the same procedure, you can register more sidebars from different pages. All these sidebars will get added to the dropdown menu for Page and Post options.

How to use an exclusive sidebar on a Post?

When a new sidebar is registered from Page Options, it will automatically get added to the "Available widget areas for Sidebar" dropdown list inside Page Options and Post options. Sidebars can be registered only from Page Options panel, whereas they can be used on pages or posts.

For example, edit any of the available posts and scroll down to the Post Options panel. Inside "Available widget areas for Sidebar" section, you shall see the available sidebars:

You can select available sidebars and update the post. Same procedure can be followed for header widget area as well. The secondary widget areas are NOT exclusive. They will be used globally throughout the site.

At this stage, we have seen widget areas and their usage. You can start adding widgets to your site. For that, drag widgets into appropriate widget areas, follow the options and save them. There is no particular format for adding widgets. You can add them according to the content and requirement.

Limitations on exclusive sidebar

The exclusive sidebar option works only for pages and posts. It will not work on archives or any other post types. For example, if you try to create an exclusive sidebar for the WooCommerce Shop page, it will not work. That's because the WooCommerce "Shop" page is an archive of product post types, and not a page.

Using Content Aware Sidebars Plugin

To overcome the limitation, use this handy plugin Content Aware Sidebars. After plugin installation, you can create exclusive sidebars and assign them to any group of pages, posts or archives. In case of WooCommerce shop, you will need to assign the sidebar to "Product Categories".

Custom Widgets

WordPress comes with built-in default widgets for your themes. Apart from these default widgets, NewsPlus comes with 6 custom widgets via NewsPlus Shortcodes Plugin. In order to use these widgets, navigate to Appearance > Widgets. You will see custom widgets with the name "NewsPlus". Let’s have a quick look on each widget.

Important: These widgets will appear only if the NewsPlus Shortcodes plugin is installed. You can find the plugin ZIP archive in newsplus/plugins/ folder.

NewsPlus Categories: This widget can be used to display a list of particular categories. For example, on home page, you may wish to show selective categories such as "products", "news", "awards" etc. In such case, you can use this widget. Drag the widget into appropriate widget area and enter the category IDs separated by commas. These cat IDs will be excluded from the list, and rest of the available categories will be shown.

NewsPlus Flickr: This widget can be used to display a Flickr photo-stream on your website. You can display Flickr photos from a user, userTag, userSet, group, all or allTag. Drag this widget into your widget area and play with the available options.

NewsPlus Popular Posts: Use this widget to display popular posts with thumbnails. The popular posts are chosen from most commented posts. You can also opt to hide thumbnails for popular posts.

NewsPlus Recent Posts: Use this widget if you wish to show your latest posts from a particular list of categories. For example, on a "News" page you may wish to show latest posts only from "News" category. Similarly, you may wish to show "Latest works" only from "Portfolio" category. At such stage, this widget comes in use. You can either include or exclude category IDs. Both options are available. For example, category IDs to include will be 3,4,6,8. And category IDs to exclude will be -3.-4,-6,-8.

NewsPlus Mini Folio: Use this widget to display a mini gallery of post featured images on sidebar. This widget generates a grid of thumbnails from posts images of particular category.

NewsPlus Social Icons: A social networking icons widget. You can configure your social networking links, RSS etc. using this widget.

NewsPlus Theme Options

NewsPlus comes with a theme options panel for basic settings and configuration of the theme.

In order to configure theme options, navigate to Appearance > Theme Options. You shall see different sections in form of tabs. Let’s cover a brief introduction about each of these sections:

General	This section contains general settings for your theme. For example: Layout style, global sidebar placement, CSS disable/enable options, etc.
Header	This section contains settings for header section. You can manage settings for logo, header type, top utility bar, etc.
Archives	This section covers settings for blog related pages like archives, single post settings, related posts, author bio, social sharing buttons, etc.
Single Post	This section covers settings for single posts. You can show/hide elements, enable or disable related posts, social sharing, etc.
Contact	This section covers basic settings for Contact page template. You can configure email address and other information for contact page template here.
Footer	This section provides settings for secondary area and footer section.
Custom Font	This section can be used to include custom Google Fonts for your theme. After including a font, it is required to add CSS rules inside additional CSS option field.
Image Sizes	This section can be used for changing image sizes of various sections of theme. For example, archives, single posts, related posts, etc.
Custom Menus	This section is used to copy and paste a custom HTML menu for the theme. This menu will replace the WordPress menu at front end. The benefit of this option is to reduce page load time.
Import/Export	This section can be used to import or save existing settings to a text file.

Short Code Elements for King Composer

As of NewsPlus v3.0, main shortcodes like post modules, sliders, news ticker, etc. are converted into King Composer Addon. Using these shortcodes as add-on, you can easily configure various parameters and shortcode settings in a visual interface. In order to insert any shortcode, follow these steps:

1. Create a new page or edit existing one. Next, switch to the King Composer page builder mode.

2. Click on the "Elements" button.

Add new element

3. A library panel will open which contains all available elements which can be used in King Composer.

NewsPlus shortcode elements

3. Click on the "NewsPlus" tab. The elements shown in this tab are all NewsPlus theme specific. It contains the posts module, posts slider, news ticker, and the newly created Recipe Generator add on. You can click on of the element for inserting it into the page. Let's say, you click on the "Posts Module" element.

Posts Module element added

4. The "Posts Module" element will be added into the page, as shown above. Next, click on "edit" icon of this module to confgure shortcode parameters and settings.

Edit a shortcode element

5. The settings panel is organized into various tabs like Query, Display, Content, Meta, etc. You need to click on each tab and configure parameters and settings as required.

Similar to the "Posts Module" element, other shortcodes like Posts Slider, Posts Ticker, Recipe Generator, etc. have their individual settings panel. You can edit each element and configure settings as required.

Translating the theme

The theme is translation ready and supports localization. If you are using WordPress in native language, you can use newsplus.pot template POT file for translating strings into your own language. The file is located inside newsplus/languages/ folder. In order to create a translation file, follow these steps:

1. Download poEdit software from the official site. (The software is free).

2. Install the poEdit software on your computer.

3. Open poEdit and click on File > Open from POT/PO file.

4. Locate and choose newsplus/languages/newsplus.pot file.

5. A pop-up will appear for the Translation Language. Choose your appropriate language and click "Ok".

6. Save this file by clicking File > Save. The file shall be saved in language_country.po format. For example, fr_FR.po

7. After saving the file, navigate to Catalog > Properties.

8. Inside "Translation Properties", you can change project name, language, etc. After making the changes, click "Ok".

9. Navigate to Catalog > Update from sources. The software will scan all files and will update from source php files.

10. Click on any message string and type it's translation inside the "Translation" field.

Translation in poEdit Software

11. After making translations, save the file via File > Save. A .mo file will be generated inside the newsplus/languages/ folder. This file can be now used for translation.

12. Inside WordPress admin, navigate to Settings > General > Site Langage, and choose the language which you have set in poEdit. Save these settings as well.

Now your site shall show translations as done in poEdit. Alternatively, you can use language localization plugins like WPML or any free plugin from the wordpress.org/plugins/ repository.

HTML structure

The output of any WordPress theme is pure HTML in browser. The HTML output of NewsPlus theme, in most general case, can be divided into the following sections:

• Page
  • Utility Top
  • Header
  • Main Navigation
  • Main Content
    • Primary
    • Sidebar
  • Secondary
  • Footer

These sections can be seen in HTML markup as:

For quick reference, you can see this diagram and switch to appropriate class/ ID for modifying the appearance or content.

CSS files and structure

The CSS files used by NewsPlus theme are as follows:

• style.css
• editor-style.css
• responsive.css
• user.css
• rtl.css
• rtl-responsive
• css/admin.css
• css/ie.css
• css/schemes/*.css

1. style.css

This is the main stylesheet for NewsPlus theme. The general structure is divided into 9 different sections, each with a label, as shown below:

If you want to change any CSS style, you need to copy the styles in child theme's style.css file and then override them with new rules. It is not recommended to modify original style.css file as it may get erased when you update the theme.

2. editor-style.css

This file is used to style the TinyMCE editor. These styles will not have any effect on the front end of theme, and are only used to style the contents inside TinyMCE editor.

3. responsive.css

This file is used to make the theme responsive on various mobile devices. The styles for various devices are included using media queries. This file can be disabled inside Appearance > Theme Options > General > Disable responsive.css file.

4. user.css

This file can be used to add custom CSS to the theme. But it is recommended to use child theme's style.css file or use Appearance > Customize > Additional CSS

5. rtl.css

This file is used to style theme layout and elements for languages with right-to-left direction. If you are using WordPress in RTL language, this file will be loaded automatically. You can also load this file force-fully by enabling an option inside Appearance > Theme Options > General > Enable rtl.css file.

6. rtl-responsive.css

This file is used for including responsive styles on RTL version.

7. css/admin.css

This file is used to style the the admin interface of Theme Options panel.

8. css/ie.css

This file is used to include Internet Explorer spcific styles and hacks. If you have any IE specific hack, it shall be included inside ie.css file.

9. css/schemes/*.css

These are color scheme specific CSS files. You can modify color schemes by copying these styles into the child theme and change all colors as required.

Javascript files

NewsPlus uses different javascript files for content enhancement and theme features. These files are:

1. Jquery Library (As shipped with WordPress)
2. Jquery Plugins
   1. jquery.marquee.min.js
   2. jquery.prettyPhoto.js
   3. owl.carousel.min.js
   4. jquery.easing.min.js
   5. jquery.validate.min.js
3. Miscellaneous
   1. custom.js
   2. contact-form.js
   3. admin.js
   4. theme-customizer.js

Let’s have a quick look on these files one by one:

1. Jquery library for entire site
jQuery is a javascript library that reduces the amount of code we must write. The file jquery.js is included with WordPress 4.7+. This library is loaded in no-conflict mode, so that your custom plugins and JS code work seamlessly.

2. Jquery Plugins
These are open source Jquery plugin files created by various developers worldwide. Although, you need not modify or edit these files, I shall mention the role of these files one by one:

• owl.carousel.min.js: This file is used for the Slider and Carousel.
• jquery.marquee.min.js: This file is used to show marquee or News Ticker.
• jquery.validate.pack.js: This file is used for client side form validation on contact page.
• jquery.easing.min.js: This file is used for easing enhancements on various jQuery animations.
• jquery.prettyPhoto.js: This file is used for prettyPhoto lightbox support on theme.

3. Miscellaneous
These are custom JavaScript files used for initializing plugins and creating theme JS effects..

• custom.js: This file contains custom functions and JS effects for the theme..
• contact-form.js: This file is used to initialize form validation plugin on contact page.
• admin.js: This file is used for custom effects inside Theme Options panel.
• theme-customizer.js: This file is used for live rendering of colors and data inside Theme Customizer panel.

php files and their role

NewsPlus uses various php files for entire functioning of the site. Let’s have a quick look on the role of these files:

php File	Role
404.php	Default 404 Error Template.
archive.php	Default Archive template for posts.
comments.php	Default comments template.
content *.php	All the php files starting with "content-" name are used as different style WordPress loop. (Grid, list, classic).
footer.php	Default footer template.
functions.php	Theme functions and definitions.
header.php	Default header template.
index.php	Default template for showing posts and pages.
page.php	Default page template.
search.php	Default search template.
sidebar.php	Default sidebar template.
single.php	Default single posts template.
includes/breadcrumbs.php	Template part for breadcrumbs.
includes/class-tgm-plugin-activation.php	Used for installation and activation notice of NewsPlus Shortcodes Plugin
includes/header-default.php	The default header type with two columns
includes/header-three-col.php	Three columnar header type
includes/header-slim.php	Slim header style
includes/header-full-width.php	Full width header type
includes/page-options.php	The page options panel.
includes/post-options.php	The post options panel.
includes/theme-admin-options.php	NewsPlus Theme options.
includes/theme-customizer.php	Theme customizer support for navigation background and footer color schemes
formats/ *.php	All the files inside formats/ folder are for different style post formats.
templates/*.php	All the files inside templates/ folder are custom templates for page, archive, blog, contact, etc.
plugins/newsplus-shortcodes.zip	The NewsPlus Shortcodes plugin archive prepacked for installation via TGM plugin activation

Frequently Asked Questions

Below are some Frequently Asked Questions that may help you in finding a solution to your specific issue.

1. I have just uploaded the download zip file to WordPress, and it is showing stylesheet missing error. Why?

Your download zip file is not the theme itself. It is a collection of theme, documentation and dummu data. It will be required to unzip this folder first. Next look for the archive named "newsplus.zip". Use this file for uploading to WordPress via Themes > Add new > Upload from computer. Or you can unzip and drop this folder to the wp-content/themes/ directory via FTP.

2. What are recommended image sizes for this theme?

Since the theme is responsive, images are of fluid width. You can upload images from 800px to around 1200px in web optimized format for better results. The height of images are set to auto. You can also specify custom image sizes inside Appearance > Theme Options > Image Sizes.

3. How to show site title in red and black color as shown on live demo

The theme supports custom site title with HTML. For that, navigate to Appearance > Theme Options > Header > Site Name/Logo Settings. Inside "Custom Site Title" field, add the following markup:

<span>News</span>Plus

Next, scroll down and save settings.

4. How to show logo image instead of text site title

In order to show a logo image, navigate to Appearance > Theme Options > Header > Site Name/Logo Settings. Enable the "Site logo" checkbox. Next, inside "Custom logo URL" field, browse your logo from media library and add the file. Finally, save settings.

5. How to use Theme Customizer

NewsPlus supports WordPress Theme Customizer for basic color schemes on main Navigation menu, secondary area and footer. In order to use Theme Customizer, navigate to WordPress Appearance > Customize. Then click on the "Colors" tab and change colors as required.

While most of the color changes will be LIVE, only the link hover states will need a page refresh on the preview window on right side. After changing link hover states, click inside the preview window. It will get refreshed and you will be able to see link colors too.

After changing colors, click on "Save and Publish" button on the top of panel. This will load your new color settings on front-end of the site.

6. How to use PrettyPhoto lightbox

NewsPlus comes with built in Support for PrettyPhoto lightbox. In order to use lightbox, you can add data-rel attribute to images as shown below:

<a data-rel="prettyPhoto[group1]" href="http://url_of_big_image/image1.jpg"><img src="http://url_of_thumbnail_image/image1.jpg" title="Image title" /></a>
<a data-rel="prettyPhoto[group1]" href="http://url_of_big_image/image2.jpg"><img src="http://url_of_thumbnail_image/image2.jpg" title="Image title" /></a>

By adding data-rel attribute, these images will be available for display in lightbox. You can also use data-rel attribute as "prettyPhoto" or "prettyPhoto[group2]". If you wish to disable prettyPhoto support, you can do so inside Appearance > Theme Options > General > Disable PrettyPhoto

7. How to change Image Sizes of theme

Theme's image sizes can be changed inside Appearance > Theme Options > Image Sizes. Inside this section, provide image widths and height for different elements like slider, post lists, widgets, etc. After changing dimensions, click on "Save Settings".

8. How to use WooCommerce with this theme

Note: If you have installed WooCommerce for the first time, it will be required to run the WooCommerce Setup wizard.

Follow on screen setup wizard instructions as they appear. This wizard will set up basic shop pages, shipping, payment options etc. You can configure these settings later too inside WooCommerce > Settings, but I would recommend setting up pages and basic things.

You can skip these steps if you are on an existing WooCommerce site. For more details on WooCommerce setup, please check the official WooCommerce Documentation.

Create WooCommerce Products

Once all the required and recommended plugin are installed, we need to create some content. This content includes creating products, posts and pages. In this section we will see how to create a shop product.

1. Navigate to Products > Add Product.

2. Provide a product name inside the "product name" field.

3. Inside content editor area, provide a product description. This description will be shown inside the "Product Description" tab on product pages.

4. Inside "Product Data" panel, choose a product type. It can be a simple, variable, or grouped product, depending upon your product type and requirements. For example, a pair of jeans with different sizes should be a variable product, whereas a decorative show-piece can be a simple product.

5. Inside "Product Short Description" panel, provide a short description for the product. The title of this panel can be mis leading, but this is the main description which is shown on right side of the product image, just below the product title. You can keep it descriptive.

For complete details and in-dept guide on WooCommerce product handling, please refer to the official WooCommerce Documentation.

9. How to show address list in footer as shown on live demo?

Navigate to Appearance > Widgets. Then use a Text Widget in any widget area and paste the following markup in it:

<ul class="icon-list-vert">
    <li><i class="icon fa fa-map-marker"></i>TravelPlus Inc.<br>
    22 A, The Travel Street<br>
    P.O. 1150 South Mount, CA</li>
    <li><i class="icon fa fa-envelope"></i><a href="mailto:info@yoursite.com">info@yoursite.com</a><br>
    <a href="mailto:support@yoursite.com">support@yoursite.com</a></li>
    <li><i class="icon fa fa-twitter"></i><a href="https://twitter.com/xconsau">Follow on twitter</a></li>
    <li><i class="icon fa fa-pinterest"></i><a href="https://in.pinterest.com/xconsau/">Follow on Pinterest</a></li>
</ul>

10. How to use short titles and short links for archives?

Both short title and short links are added using Custom Field in single posts. In order to add these fields, follow these steps:

a. Edit a post inside Posts > All Posts. Next, click on the "Screen Options" button at top right corner of screen.
b. From the screen options panel, enable "Custom Fields" checkbox.
c. Exit from panel and scroll down to the "Custom fields" panel.
d. Click on "Enter new" of "Add custom field" section.
e. Inside Name field, type "np_short_title", and inside value field write the short title.
f. Click on "Add custom field" button.
g. Similarly, add another custom field named "np_custom_link", and inside value field write the custom link URL. Add this field as well.
h. Finally update the post.

Custom fields for short title and custom link

11. How to update the theme?

You can update the theme in two ways:

1. Automatic Update

For automatic updates of the theme, download the WP Envato Market plugin and install it using the instructions as shown on the official page. You will need to connect to the API key of your marketplace account. After that, theme will be updated automatically. In this case, it is strongly recommended to use a child theme so that your custom changes do not get erased.

2. Manual Update

Step 1: Log in to your themeforest account and download latest theme archive.
Step 2: Unzip the archive and upload the 'newsplus' parent theme folder to your_site_root/wp-content/themes/, replacing the old one. This can be done using FTP or Control Panel of your Hosting account. This will update main theme while your changes will still remain intact in child theme.

12. How to add new fonts to theme's Google font list?

Add the following code inside your child theme's functions.php file:

function my_new_google_font_list( $fonts = array() ) {
    $fonts['My Font'] = 'MyFont:regular,300,400';
    return $fonts;
}

add_filter( 'newsplus_google_font_arr', 'my_new_google_font_list', 10, 1 );

Where My Font shall be changed to the actual Google Font Family name, and the value should be it's corresponding font family value name.

Shortcode Reference

Below is a detailed reference of all available shortcodes and their parameters.

[col]

Used to show a column grid.

// Example usage

[col type="half"]
 - content here -
[/col]

[col type="half last"]
- content here -
[/col]

Parameter	Description	Required	Values	Default
type	The type of column class. E.g. full. Use a "last" class name for last column instance.	optional	full, three-fourth, two-third, half, one-third, three-eighth, one-fourth	full
xclass	Any extra class you want to add	optional	text	none

[row]

Used to wrap columns in a single row.

// Example usage
[row]
[col type="half"]
 - content here -
[/col]

[col type="half last"]
- content here -
[/col]
[/row]

Parameter	Description	Required	Values	Default
xclass	Any extra class you want to add	optional	text	none

[tabs]

Used to show tabbed content.

// Example usage

[tabs]
    [tab title="Tab1"]
        Tab1 content here
    [/tab]
    [tab title="Tab2"]
        Tab2 content here
    [/tab]
    [tab title="Tab3"]
        Tab3 content here
    [/tab]
[/tabs]

[tabs] Parameters	Description	Required	Values	Default
xclass	Any extra class you want to add	optional	text	none
[tab] Parameters
title	The title of tab button. E.g. About	Yes	text	mytab

[toggle]

Used to show a collapsible toggle content.

// Example usage

[toggle title="My Toggle"]
Insert your content here.
[/toggle]

Parameter	Description	Required	Values	Default
title	The title of toggle button. E.g. Click to toggle	Yes	text	mytoggle

[accordion]

Used to show accordion content.

// Example usage

[accordion]

    [acc_item title="Accordion item1"]
        Accordion1 content here.
    [/acc_item]
    
    [acc_item title="Accordion item2"]
        Accordion2 content here.
    [/acc_item]
    
    [acc_item title="Accordion item3"]
        Accordion3 content here. 
    [/acc_item]
    
[/accordion]

[accordion] Parameters	Description	Required	Values	Default
xclass	Any extra class you want to add	optional	text	none
[acc_item] Parameters
title	The title of accordion handle. E.g. FAQ	Yes	text	myaccordion

[box]

Used to show content boxes.

// Example usage

[box style="0"]
    Your box content here.
[/box]

Parameter	Description	Required	Values	Default
style	The style code for box. E.g. 0 0 for default (Grey) 1 for warning (Yellow) 2 for success (Green) 3 for error (Red) 4 for information (Blue)	optional	0 1 2 3 4	0
close_btn	Whether to show a close button in box. E.g. true	optional	true/false	false
xclass	Any extra class you want to add	optional	text	none

[btn]

Used to show a button.

// Example usage

[btn link="http://yoursite.com" color="pink" size="size-m" target="_blank"]Click Me[/btn]

Parameter	Description	Required	Values	Default
link	The link URL for the button. E.g. http://google.com	Yes	Valid URL	none
color	The color class name for button. E.g. pink	optional	aqua red grey pink skyBlue royalBlue orange forestGreen yellowGreen	none
size	The size class name for button. E.g. size-m	optional	size-s size-m size-l	none
target	The link target for button. E.g. _blank		_blank _parent _self	none
xclass	Any extra class you want to add	optional	text	none

[hr]

Used to show a horizontal rule.

// Example usage

[hr style="double"]

Parameter	Description	Required	Values	Default
style	The style code for HR. E.g. double	optional	single double 3d bar dashed	single
xclass	Any extra class you want to add	optional	text	none

[indicator]

Used to show progress bar indicators.

// Example usage

[indicator bg="#f90" value="66"]

Parameter	Description	Required	Values	Default
label	The label for indicatior. E.g. HTML Skills	Yes	Text	Label here
bg	The hex background value for indicator bar. E.g. #ff9900	optional	Hex color value	#ffcc00
value	Teh value of indicator bar out of 100. E.g. 75	Yes	Number between 0 to 100	75

[slider]

Used to show a content slider of images or text.

// Example usage

[slider effect="slide" easing="easeInQuad" speed="400" timeout="5000" animationloop="true" smoothheight="false" controlnav="false" directionnav="false"]
    
    [slide]
        <img title="image title" src="http://yoursite.com/wp-content/themes/newsplus/images/slide.jpg" alt="" />
        [slide_text]
            <h2>Slide Heading 1</h2>
            Optional slide content. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus leo ante, consectetur sit amet vulputate vel, dapibus sit amet lectus. Etiam varius dui eget lorem elementum eget mattis sapien interdum.
        [/slide_text]
    [/slide]
    
    [slide]
        <img title="image title" src="http://yoursite.com/wp-content/themes/newsplus/images/slide.jpg" alt="" />
        [slide_text]
            <h2>Slide Heading 2</h2>
            Optional slide content. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus leo ante, consectetur sit amet vulputate vel, dapibus sit amet lectus. Etiam varius dui eget lorem elementum eget mattis sapien interdum.
        [/slide_text]
    [/slide]
   
    [slide]
        <img title="image title" src="http://yoursite.com/wp-content/themes/newsplus/images/slide.jpg" alt="" />
        [slide_text]
            <h2>Slide Heading 3</h2>
            Optional slide content. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus leo ante, consectetur sit amet vulputate vel, dapibus sit amet lectus. Etiam varius dui eget lorem elementum eget mattis sapien interdum.
        [/slide_text]
    [/slide]    
[/slider]

Parameter	Description	Required	Values	Default
effect	The effect for slide transition. E.g. fade	optional	fade slide	fade
easing	Easing function for the animation	optional	easeInQuad easeOutQuad easeInOutQuad easeInExpo easeOutExpo easeInOutExpo	swing
speed	The speed of slide transition in miliseconds. E.g. 600	optional	Number	600
timeout	How long the slide shall stay visible (in miliseconds). E.g. 4000	optioanl	Number	4000
animationloop	Whether slider shall loop infinitely. E.g. true	optional	true/false	false
slideshow	Whether to animate slider automatically. E.g. true	optional	true/false	true
smoothheight	Allow height of the slider to animate smoothly. E.g. true	optional	true/false	true
controlnav	Create navigation for paging control of each slide. E.g. true	optional	true/false	true
directionnav	Create buttons for previous/next navigation. E.g. true	optional	true/false	true
xclass	Any extra class you want to add	optional	text	none
[slide] Parameters
xclass	Any extra class you want to add	optional	text	none

[posts_slider]

Used to show a slider from posts.

// Example usage

[posts_slider cats="3,5,8" num="4" effect="slide" easing="easeInQuad" speed="400" timeout="5000" animationloop="true" smoothheight="false" controlnav="false" directionnav="false"]

// Show posts from Custom Post Type product
[posts_slider query_type="cpt" post_type="product" taxonomy="product_cat" terms="men,women,kids" num="5"]

Parameter	Description	Required	Values	Default
query_type	The type of WordPress query for showing results. E.g. tags	optional	posts pages tags cpt	category
cats	Numeric category IDs to show posts from, separated by comma. E.g. 3,5,7	optional	Number	null
posts	Numeric post IDs to show posts from, separated by comma. E.g. 102, 354	optional	Number	null
post__in	Numeric post IDs to include posts from, separated by comma. E.g. 102, 354. Same as posts parameter above.	optional	Number	null
post__not_in	Numeric post IDs to exclude posts from, separated by comma. E.g. 10,20,34	optional	Number	null
pages	Numeric page IDs to show posts from, separated by comma. E.g. 192, 326	optional	Number	null
tags	Tag slug names to show posts from, separated by comma. E.g. men, women, spaced-tag	optional	Text	null
post_type	The post type name to show posts from. E.g. product	optional	Text	null
taxonomy	The taxonomy name from which custom post type is shown. E.g. product_cat	optional	Text	null
terms	Term names of Custom post type taxonomy, separated by comma. E.g. men, women	optional	Text	null
blog_id	Numeric blog ID to pull posts from when using multisite. E.g. 2	optional	Number	null
operator	Operator for term relationship in Custom post type. E.g. AND	optional	AND IN NOT IN	IN
order	The order of posts. E.g. ASC (for ascending)	optional	ASC DESC	DESC
orderby	The orderby value for sort order. E.g. date	optional	See reference	date
num	Number of posts to show. E.g. 5	optional	Number	2
offset	Number of initial posts to skip from the available results. E.g. 2 (will skip first 2 posts)	optional	Number	0
ignore_sticky	Whether to ignore sticky posts. E.g. 1 (for yes)	optional	0 or 1	0
excerpt_length	The excerpt length in characters or words. E.g. 120	optional	Number	140
use_word_length	Whether to use excerpt length in words. E.g. true	optional	true/false	false
hide_excerpt	Whether to hide excerpt. E.g. true	optional	true/false	false
hide_meta	Whether to hide post meta. E.g. false	optional	true/false	false
hide_image	Whether to hide image. E.g. false	optional	true/false	false
imgwidth	Width of image in px (without unit). E.g. 600	optional	Number	800
imgheight	Height of image in px (without unit). E.g. 400	optional	Number	450
imgcrop	Whether to hard crop images. E.g. true	optional	true/false	true
imgupscale	Whether to upscale images. E.g. true	optional	true/false	true
effect	The effect for slide transition. E.g. fade	optional	fade slide	fade
easing	Easing function for the animation	optional	easeInQuad easeOutQuad easeInOutQuad easeInExpo easeOutExpo easeInOutExpo	swing
speed	The speed of slide transition in miliseconds. E.g. 600	optional	Number	600
timeout	How long the slide shall stay visible (in miliseconds). E.g. 4000	optioanl	Number	4000
animationloop	Whether slider shall loop infinitely. E.g. true	optional	true/false	false
slideshow	Whether to animate slider automatically. E.g. true	optional	true/false	true
smoothheight	Allow height of the slider to animate smoothly. E.g. true	optional	true/false	true
controlnav	Create navigation for paging control of each slide. E.g. true	optional	true/false	true
directionnav	Create buttons for previous/next navigation. E.g. true	optional	true/false	true
xclass	Any extra class you want to add	optional	text	none

[posts_carousel]

Used to show a posts carousel.

// Example usage

[posts_carousel cats="3,6" easing="easeInQuad" speed="500" timeout="5000" animationloop="true" controlnav="false" directionnav="false"]

Parameter	Description	Required	Values	Default
hide_video	Whether to hide video embed in posts. E.g. true	optional	true/false	false
Other parameters same as [posts_slider] parameters.

[insert_posts]

Used to show posts loop in different display styles.

// Example usage

[insert_posts cats="3,6" num="6" display_style="three-col"]

// Show posts from custom post type product
[insert_posts query_type="cpt" post_type="product" taxonomy="product_cat" terms="men,women,kids" num="6" display_style="three-col"]

Parameter	Description	Required	Values	Default
display_style	The type of display for posts output. E.g. three-col	optional	one-col two-col three-col four-col list-big list-small lis-plain	one-col
query_type	The type of WordPress query for showing results. E.g. tags	optional	posts pages tags cpt	category
cats	Numeric category IDs to show posts from, separated by comma. E.g. 3,5,7	optional	Number	null
posts	Numeric post IDs to show posts from, separated by comma. E.g. 102, 354	optional	Number	null
post__in	Numeric post IDs to include posts from, separated by comma. E.g. 102, 354. Same as posts parameter above.	optional	Number	null
post__not_in	Numeric post IDs to exclude posts from, separated by comma. E.g. 10,20,34	optional	Number	null
pages	Numeric page IDs to show posts from, separated by comma. E.g. 192, 326	optional	Number	null
tags	Tag slug names to show posts from, separated by comma. E.g. men, women, spaced-tag	optional	Text	null
post_type	The post type name to show posts from. E.g. product	optional	Text	null
taxonomy	The taxonomy name from which custom post type is shown. E.g. product_cat	optional	Text	null
terms	Term names of Custom post type taxonomy, separated by comma. E.g. men, women	optional	Text	null
blog_id	Numeric blog ID to pull posts from when using multisite. E.g. 2	optional	Number	null
operator	Operator for term relationship in Custom post type. E.g. AND	optional	AND IN NOT IN	IN
order	The order of posts. E.g. ASC (for ascending)	optional	ASC DESC	DESC
orderby	The orderby value for sort order. E.g. date	optional	See reference	date
num	Number of posts to show. E.g. 5	optional	Number	2
offset	Number of initial posts to skip from the available results. E.g. 2 (will skip first 2 posts)	optional	Number	0
ignore_sticky	Whether to ignore sticky posts. E.g. 1 (for yes)	optional	0 or 1	0
excerpt_length	The excerpt length in characters or words. E.g. 120	optional	Number	140
use_word_length	Whether to use excerpt length in words. E.g. true	optional	true/false	false
hide_excerpt	Whether to hide excerpt. E.g. true	optional	true/false	false
hide_meta	Whether to hide post meta. E.g. false	optional	true/false	false
hide_image	Whether to hide image. E.g. false	optional	true/false	false
hide_video	Whether to hide video embed. E.g. true	optional	true/false	false
imgwidth	Width of image in px (without unit). E.g. 600	optional	Number	800
imgheight	Height of image in px (without unit). E.g. 400	optional	Number	450
imgcrop	Whether to hard crop images. E.g. true	optional	true/false	true
imgupscale	Whether to upscale images. E.g. true	optional	true/false	true
xclass	Any extra class you want to add	optional	text	none

[newsplus_sidebar]

Used to show a registered widget area (sidebar) in page.

// Example usage

[newsplus_sidebar id="my-sidebar"]

Parameter	Description	Required	Values	Default
id	The id name of registered sidebar. E.g. home-sidebar	true	Slug name of sidebar	default-sidebar
xclass	Any extra class you want to add	optional	text	none

[newsplus_grid_list]

Used to show posts grid with overlay text.

// Example usage

[newsplus_grid_list cats="6" display_style="s1" num="5" aspect_ratio=".75"]

Parameter	Description	Required	Values	Default
display_style	The type of display for posts output. E.g. s1	optional	s1 s2	s1
query_type	The type of WordPress query for showing results. E.g. tags	optional	posts pages tags cpt	category
cats	Numeric category IDs to show posts from, separated by comma. E.g. 3,5,7	optional	Number	null
posts	Numeric post IDs to show posts from, separated by comma. E.g. 102, 354	optional	Number	null
post__in	Numeric post IDs to include posts from, separated by comma. E.g. 102, 354. Same as posts parameter above.	optional	Number	null
post__not_in	Numeric post IDs to exclude posts from, separated by comma. E.g. 10,20,34	optional	Number	null
pages	Numeric page IDs to show posts from, separated by comma. E.g. 192, 326	optional	Number	null
tags	Tag slug names to show posts from, separated by comma. E.g. men, women, spaced-tag	optional	Text	null
post_type	The post type name to show posts from. E.g. product	optional	Text	null
taxonomy	The taxonomy name from which custom post type is shown. E.g. product_cat	optional	Text	null
terms	Term names of Custom post type taxonomy, separated by comma. E.g. men, women	optional	Text	null
blog_id	Numeric blog ID to pull posts from when using multisite. E.g. 2	optional	Number	null
operator	Operator for term relationship in Custom post type. E.g. AND	optional	AND IN NOT IN	IN
order	The order of posts. E.g. ASC (for ascending)	optional	ASC DESC	DESC
orderby	The orderby value for sort order. E.g. date	optional	See reference	date
num	Number of posts to show. E.g. 5	optional	Number	2
offset	Number of initial posts to skip from the available results. E.g. 2 (will skip first 2 posts)	optional	Number	0
ignore_sticky	Whether to ignore sticky posts. E.g. 1 (for yes)	optional	0 or 1	0
excerpt_length	The excerpt length in characters or words. E.g. 120	optional	Number	140
use_word_length	Whether to use excerpt length in words. E.g. true	optional	true/false	false
hide_excerpt	Whether to hide excerpt. E.g. true	optional	true/false	false
hide_meta	Whether to hide post meta. E.g. false	optional	true/false	false
hide_image	Whether to hide image. E.g. false	optional	true/false	false
hide_video	Whether to hide video embed. E.g. true	optional	true/false	false
imgwidth	Width of image in px (without unit). E.g. 600	optional	Number	800
imgheight	Height of image in px (without unit). E.g. 400	optional	Number	450
imgcrop	Whether to hard crop images. E.g. true	optional	true/false	true
imgupscale	Whether to upscale images. E.g. true	optional	true/false	true
viewport_width	The viewport width (in px widthout unit) to calculate max width of post grid. E.g. 960	optional	Number	1192
gutter	The gutter width between grids. E.g. 4 Important: Changing this value will need some CSS changes too This value is only intended for image cropping according to gutter width.	optional	Number	4
aspect_ratio	The aspect ratio of overall grid images. E.g. .75 Other standard values are .666 and .5625	optional	Number	.75
featured_label	The featured label to show on first bigger post image	optional	Text	none
xclass	Any extra class you want to add	optional	text	none

[newsplus_news_ticker]

Used to show a news ticker of posts.

// Example usage

[newsplus_news_ticker cats="6" ticker_label="Latest News"]

Parameter	Description	Required	Values	Default
query_type	The type of WordPress query for showing results. E.g. tags	optional	posts pages tags cpt	category
cats	Numeric category IDs to show posts from, separated by comma. E.g. 3,5,7	optional	Number	null
posts	Numeric post IDs to show posts from, separated by comma. E.g. 102, 354	optional	Number	null
pages	Numeric page IDs to show posts from, separated by comma. E.g. 192, 326	optional	Number	null
tags	Tag slug names to show posts from, separated by comma. E.g. men, women, spaced-tag	optional	Text	null
post_type	The post type name to show posts from. E.g. product	optional	Text	null
taxonomy	The taxonomy name from which custom post type is shown. E.g. product_cat	optional	Text	null
terms	Term names of Custom post type taxonomy, separated by comma. E.g. men, women	optional	Text	null
blog_id	Numeric blog ID to pull posts from when using multisite. E.g. 2	optional	Number	null
operator	Operator for term relationship in Custom post type. E.g. AND	optional	AND IN NOT IN	IN
order	The order of posts. E.g. ASC (for ascending)	optional	ASC DESC	DESC
orderby	The orderby value for sort order. E.g. date	optional	See reference	date
num	Number of posts to show. E.g. 5	optional	Number	2
offset	Number of initial posts to skip from the available results. E.g. 2 (will skip first 2 posts)	optional	Number	0
ignore_sticky	Whether to ignore sticky posts. E.g. 1 (for yes)	optional	0 or 1	0
title_length	The word length of title to be trimmed to. E.g. 10	optional	Number	10
ticker_label	The label of ticker. E.g. Latest News	optional	Text	Breaking News
xclass	Any extra class you want to add	optional	text	none

Sources and Credits

The theme uses following files and resources, as listed:

jQuery Library
As shipped with the WordPress installation.
http://jquery.com/
Copyright 2010, John Resig

jquery.validate.min.js
jQuery Validation Plugin - v1.10.0 - 9/7/2012
https://github.com/jzaefferer/jquery-validation
Copyright (c) 2012 Jörn Zaefferer; Licensed MIT, GPL

jquery.marquee.min.js
http://aamirafridi.com/jquery/jquery-marquee-plugin

Font Awesome (Vector font icons)
Font Awesome 4.7.0 by @davegandy - http://fontawesome.io - @fontawesome
License - http://fontawesome.io/license (Font: SIL OFL 1.1, CSS: MIT License)

prettyPhoto Lightbox
Author: Stephane Caron (http://www.no-margin-for-errors.com)

Owl Carousel
https://github.com/OwlCarousel2/OwlCarousel2

jquery.easing.min.js

Images on live preview are from pexels.com, pixabay.com, Wiki Commons and Standard License purchases from fotolia.com

WordPress for providing a platform on which we can create themes.