Trend / News - Amazing Magazine Theme

Welcome to the "Trend News" Wordpress Theme by Xspire. We are very pleased that you have chosen "Trend News" for your website, you will not be disappointed! In this documentation you’ll find almost everything related to this theme. If you find something that we missed to explain or have any questions, please contact us on email or create a ticket on Support.

Documentation info:

version: 1.2
created: 27.11.2016
latest update: 06.12.2016

WordPress Codex information

  • Installation – WordPress is easy to install
  • Pages vs. posts – Understand the differences between posts and pages
  • Posts – The articles/posts represent the content
  • Manage categories – Structure your content using categories
  • Tags – Group posts which have similar content
  • Pages – They have multiple usage from homepage to contact, from blog page to presentation pages, etc.

1. Installation

1.1 Download Package

At first, after purchasing this theme please download the package from Themeforest. All you need to do is move your mouse over your login name in the right top corner and then click Download. Here you will find all the items that you have purchased.

At the next step click the Download > All files & documentation button next to Trend News theme and save package to your computer.

1.2 Installing & Activation

You can find things like: documentation, license, zipped file with theme files and сhild-theme zip archive in the package. Extract the package to a folder on your local computer.

You can complete installation in two different ways:

  • WordPress Theme Manager - please go to Appearance > Themes > Add new > Upload Theme, select zipped theme folder called trend-news.zip and press Install Now button. The wordpress will do the rest for you.
  • FTP upload - upload non-zipped theme folder called trend-news to /wp-content/themes/ folder in your WordPress installation folder on your server. If you are not familiar with FTP or looking for any FTP software, FileZilla is easy to use.

Once installation is complete, your Trend News theme will be ready to use.

1.3 Install Plugins

In order to extend theme functionality, theme comes with several plugins. You will see a window with an offer to install required and recommended plugins after theme activation. Follow the link mentioned here.

You can also install and activate the plugins in Appearance > Install Plugins.

Required plugins:

  • ACF | Advanced Custom Fields: Is a WordPress plugin which acts as a GUI layer for custom fields. It serves as the core for our theme.
  • Trend Core: A plugin that will init all necessary for Trend News Theme

Recommended plugins:

  • Shortcodes Ultimate: This plugin adds shortcode functionality for the theme
  • Contact Form 7: This plugin can manage multiple contact forms, plus you can customize the form and the mail contents flexibly with simple markup.
  • Envato Wordpress Toolkit: This toolkit plugin establishes an Envato Marketplace API connection and recommended for update theme automatically.
  • WooCommerce: Is a free eCommerce plugin that allows you to sell anything.

1.4 Regenerate Images

If you install Trend News theme on a website that already has images uploaded, please use the Regenerate Thumbnails plugin to resize all the thumbnails. Click the link above and download the free plugin, and read through the steps it contains, it has all the information you need.

This plugin allows you to delete all old images size and regenerate the thumbnails for image attachments as Trend News theme supports.

To regenerate images, follow this steps:

  • Go to Tools > Regen. Thumbnails;
  • Click on Regenerate All Thumbnails and wait until it is finished.

2. Update Theme

It’s recommended to create a backup copy of your site before its update.
There are several variants of theme update.

2.1 Auto Update

Trend News theme recommends some plugins after installation. One of them is "Envato Wordpress Toolkit" which automatically alert you on your dashboard when a new version of the theme is available.

If you haven’t installed the plugin yet, follow these steps:

  • Go to Appearance > Install Plugins;
  • Hover over "Envato Wordpress Toolkit" and click "Install Plugin";
  • Go to Appearance > Install Plugins;
  • After you install the plugin you’ll see "Envato Toolkit" button on the left menu.

To establish an Envato Marketplace API connection navigate to the "Envato Toolkit" page and insert your Marketplace username and secret API key in the designated input fields.


How To Generate Your API Key From ThemeForest?

  • Step 1 – Log into your ThemeForest account and click your username in the top right corner to access the dropdown. Select the "Settings" link.
  • Step 2 – The "My Account" page will load. Click the "API Keys" tab on the left side.
  • Step 3 – Enter a name in the Label field, and click the Generate API Key button. Your new API Key will now appear above.

2.2 Update Manually

This method requires more steps and manual work. We advise to make a backup of your site before theme update.

For manual update you need to download a new theme version from your account to Themeforest (there is an instruction above in the paragraph “Installation”). Once you have the new theme package, you can choose to upload the theme via WordPress or via FTP.

How To Update Your Theme Via WordPress?

  • Step 1 – You need to deactivate the current Trend News theme located in the Appearance > Themes section (Simply activate another theme). Once you activate a different theme, you can delete the Trend News theme (If you are using child theme, keep it as is, delete parent theme only). Dont worry, your content will not be lost.
  • Step 2 – You need to unzip the downloaded archive file you received to get the TrendNews.zip file inside.
  • Step 3 – Upload the TrendNews.zip file to the Appearance > Themes section by clicking on the "Install Themes" tab at the top and then choosing to upload the zip file.
  • Step 4 – Once it finishes uploading, choose to activate the theme.
  • Step 5 – Lastly, update the included plugins. You will see a notification message letting you know a new version of the plugins are available and need to be updated.

How To Update Your Theme Via FTP?

  • Step 1 – Go to wp-content > themes folder location and backup your "trend-news" theme folder by saving it to your computer, or you can choose to simply delete it. Your content will not be lost.
  • Step 2 – You need to unzip the downloaded archive file you received to get the "trend-news" folder inside.
  • Step 3 – Simply drag and drop the new "trend-news" theme folder into wp-content > themes folder location. Choose to Replace the current one if you did not delete the old "trend-news" theme folder.
  • Step 4 – Lastly, update the included plugins. You will see a notification message letting you know a new version of the plugins is available and needs to be updated.

2.3 Plugins Update

Update "ACF | Advanced Custom Fields" plugin: firstly you need to remove ACF plugin and then install again by Appearance → Install Plugin

3. Demo Content

Demo Content is recommended to be established at the clean Wordpress version. The installation doesn’t replace or delete added already posts, pages, products, sliders.

In the Trend / News theme disabled images import. You can enable "No Photos" in the Theme Options.

How to install Demo Content?

  • Step 1 – Install and activate required plugins and if necessary recommended ones.(Appearance > Install Plugins)
  • Step 2 – Go to the page Appearance > Demo Content. Choose content that you want to import. If necessary change import settings.
  • Step 3 – Before installation you can look the content through clicking a button Live preview or press Install Demo for import.

6. Theme Options

You need to install the "ACF | Advanced Custom Fields" plugin before using "Theme Options" functionality. To do this go to the "Appearance - Install Plugins" in the Admin Panel.

Theme options panel has been especially created to make your work faster and easier. Using it is very easy and in just a few minutes you can change a lot of things on your page. Navigate to Apparance > Theme Options to make changes.

These options are all global options which means any option set in Theme Options will affect your entire website. If you want to set more specific options for a particular page or post, you can set them in Post Options, which is located in every page or post.

Please always remember to click Save Changes button. Without that you will lose all your changes.

6.1 General

In this section you can set up some general options for your site.

Site width

Choose a site layout from 3 variants and set it up. For example, if you want to install a custom background for the site, then you should choose a variant Boxed and full-function settings of the background will appear below. We’ve done it for you to do everything you want as simple as possible.

Home

In this tab you can customize the appearance of the home page in case if you have chosen option in admin page Setting > Reading > Front page displays > Your latest posts.

Logo

In this section you can set up some options related with logo. Choose a logo type: none, icon or image. According to the type you’ve chosen the settings will differ. If Image Type chosen "none", you will see a text editor and you can type any text to it (font family and font size you can change in the Styling tab). In the case with an image except normal picture you can download logo for the Retina devices. It should be 2x the size of main logo.

Header

In this section you can choose a heading style and configure elements inside.

Breaking News

These are settings for news line below header.

Social Networks

In this section you can add your URLs for each social network or create a custom URL with custom icon.

Sidebars

These are some general settings for all sidebars on the site.

Post Thumnails

In this section you can change some general options for all post thumbnails on the site.

Footer

These settings give a possibility to set up a quantity of widget areas, copyright text and other settings.

Site Preloader

You can enable/disable preloader globally for all pages on the site.

6.2 Styling

This tab gives a unique possibility to set up fonts and colors of the site to your taste.

Colors

In this tab you can transform your site beyond recognition. Set up main colors, heading colors, footer colors and menu colors as you want.

Fonts

Set up fonts of the site. We offer a choice of hundreds of fonts that connect with the help of Google Fonts. And we’ve done a preview area of the text with selected options for you to choose a suitable font comfortably.

6.3 Archive Types

Trend News has an opportunity to create individual settings for different archives of posts.

6.4 Single Types

In this tab there are settings of layout/appearance of single pages for each post type that is included in the theme. By means of it you have a possibility to set up single pages in detail in different parts of the site.

6.5 WooCommerce

This tab has some options for WooCommerce plugin.

6.6 Advanced

Additional (expanded) settings of the site are located in this tab.

SEO

We implemented SEO option in our theme. We hope this will be very helpful for all of you.

You can set up here things like Meta Description or Meta Keywords for homepage and other pages/archives (this is also default option for each new page).

If you are using external SEO plugin you can easily turn it off.

Ads

In this section you can insert advert codes or shortcodes in different places on the site.

Custom CSS

Advanced users can enter custom CSS here. Make sure css is out of any errors/mistakes.

Custom JS

Advanced users can enter custom JS here. Entered code will be executed on domready. Make sure javascript is out of any errors/mistakes.

Hooks

It’s a section where you can put some code (especially html) that allow you to show different things and elements in places that are not available from other tools. For example if you want to put some code above header (banner or information about cookies), then put code in Top field.

Troubleshooting

This subtab provides with an information useful to diagnose some of the possible reasons to malfunctions, performance issues or any errors.

6.7 Import / Export

This section is especially for all those who want to move settings from theme options panel between themes or when you move your options from test server to live.

Caution. Before import (download files) make export of current settings. Later you can use this file for options recovery.

7. Blog

7.1 Category Options

To create categories navigate to Posts > Categories. You will see a form for creation of a new category from the left side and a form for editing of earlier created categories from the right side.

Trend News theme allows you to manage your categories more customizable than default wordpress category functionality.

You can change many options for each category, such as sidebar settings, posts layout & pagination, site layout and other. Check category add/edit screen to manage these options.

7.2 Post Setup

To create a new blog post, follow these steps:

  • Step 1 – Navigate to Posts in your WordPress admin sidebar. Click on the Add New option to make a new post. Create a title.
  • Step 2 - Insert your post content in the editing field. You can use any of our shortcode builder elements inside the post.
  • Step 3 – If you want to add a special post format, at the right side of your screen, in the section called Format, choose a format for your blog post. Audio, link, quote and video post formats have additional settings. These settings will appear below the input box of a title after format seletion.
  • Step 4 – Add Categories from the right side. To assign it to the post, check the box next to the Category name.
  • Step 5 – Add Tags from the right side. Type the name of the tag in the field, separate multiple tags with commas.
  • Step 6 – Upload Featured Image from the right side. Featured Image is not displayed if you’ve chosen post format that has additional setup fields.

You can customize any post spesifically from the meta box named Post Options right under text editor in post edit or new post screen. To accomplish it you should choose – Show options and a full list of options will be opened below. It’s convenient, for example, in the case if you want to add a special advertisement for this post only or hide/show author’s box.

In the paragraph Theme Options > Single Types you will find information how to set up standard options for all posts.

You can also add SEO settings for current post.

Paginated Post

You can split a post/page up into different web pages so that is has pagination. All you have to do is type:

<!--nextpage-->

into the text editor where you would like your page breaks to appear. You must be in Text view when you make changes.

Using Gallery Inside Post

To put a gallery inside your post:

  • In the post edit or new post screen, click Add Media button above text editor.
  • In the popup window click Create Gallery on the left.
  • Select images to compose a gallery and click Create a new gallery.
  • In the gallery edit screen manage gallery options and click Insert Gallery.

8. Pages

Pages are the backbone of your website, and most likely you will setup several of them. Pages are a blank canvas that allow you to add content with shortcodes elements or page builder. Also, there are different page templates to choose from, each serving a purpose to help you build a site.

You can create any number of pages with content.

How To Create A New Page:

  • Step 1 – Navigate to Pages in your admin sidebar and click Add New option.
  • Step 2 – Input a new name for your page, then find the Page Attributes box on right side.
  • Step 3 – Set your Parent page. It’s usually set to No Parent.
  • Step 4 – Set your page template from the Template dropdown list. See list of page templates below.
  • Step 5 – Content for your page goes in the editing field, use the Visual or Text editor. Page content is mainly built using Shortcodes. If you’ve want use page modules for content, under title field you can see button Switch to Page Builder, click it. How to use Page Builder guide is located in the Page Builder menu item.
  • Step 6 – Additionally, in the bottom section of the page you have Page & Layout options. Here you can change some options that you need. You can also fill SEO fields for current post.

Contact Page Template

If you didn’t install this plugin before:

  • Go to Appearance > Install Plugins
  • Hover over Contact Form 7 and click Install Plugin

You can create a contact page with using Contact Form 7 plugin. To do this:

  • Go to Contact on the left menu
  • There will be a default contact form created, simply copy shortcode of it.
  • Add/Create a new page. Choose Page template Contacts.
  • Settings for this template will appear on the left side. Choose an suitable Layout and paste the shortcode into the text editor. Besides you have a possibility to add a map and write additional information about your company.
  • Publish/Update Page

9. Page Builder

Page Builder is a modules system that lets you easily build and edit pages. We made the interface as intuitive as possible, so it wont take you long to get stuck in.

How to create a page using Page Builder

  • Step 1 - On every page you can see the button - "Switch to Page Builder". Clicking on this button brings up the Page Builder interface. You can change it back at any time.
  • Step 2 - You need to add a Layout. Layout is a container for modules. You can simply change layouts order by drag&drop.
  • Step 3 - Add any modules into layout.

Layout Settings

In every layout you can choose sidebar type: left, right, two sidebars or without.

In Settings window are general settings and apperance. There you can change many options: background, layout type, paddings and other.

For remove layout click button "Remove layout". Be careful, the module inside the module will be also deleted.

Module Settings

When you adding a new module, there are several types of modules that you can select. Choose the most appropriate for you.

When a new module was added you need to edit it. Click on the "Edit" Button in the right side or click on the module title.

Each module has many flexible settings.

For example, featured module has six layout styles and you can choose posts manually, or filter posts by category and tags. Also you can choose the order of posts.
All this makes it possible to configure the module as you wish.

If you need to hide a module, but you don't want to remove it - go to the "On/off" tab and change module visability.

10. Woocommerce

Trend News is fully compatible with WooCommerce plugin. We carefully created whole design so you can get very nice shop with tons of options and all looks perfect with theme design. WooCommerce is an external plugin and all info about this awesome plugin you can find on plugin's author page.

Below you have all friendly links that will be useful:

How to install WooCommerce and setup the default shop pages

  • Step 1 - At first please go to Plugins > Add new section and type "WooCommerce" into search field. Then click Search Plugins button.
  • Step 2 - After that you will see results and what you need to do is click on Install now button next to "WooCommerce" plugin.
  • Step 3 - After that plugin will be installed please click Activate plugin link.
  • Step 4 - Later you will see a WooCommerce Purple Notfication Bar at the top of the plugin page. Click the Install WooCommmerce Pages button in the purple bar to install all the default pages.

Please Note: Once you are done installing WooComerce and the default pages, you can go to the Appearance > Menu section of your admin and choose to add all the WooCommerce pages to your menu. They will be listed at the top under the most recent pages.

How to add new product

Go to Products > Add product section. After that you will see page which looks like below and all you need to do is fill those fields with own values.
All info about adding new product you can read on http://docs.woothemes.com/document/managing-products/

How to use WooCommerce shortcodes and setup pages for shop

All pages that you want to setup for WooCommerce are in WooCommerce > Settings > Catalog section. But if you want to get some shortcodes for pages like cart or checkout (most WooCommerce pages must be created manually and that`s why for each you have own shortcode) you need to go to WooCommerce > Settings > Pages section.

Whole list of shortcodes included with WooCommerce plugin you can find at http://docs.woothemes.com/document/woocommerce-shortcodes/

List of all available pages for WooCommerce plugin you can find at http://docs.woothemes.com/document/woocommerce-pages/

11. Translations

Theme Translation

Trend News allows you to translate the theme into any language. To translate the theme:

  • Download and install POEdit translation editor (https://poedit.net/)
  • Go to the theme translation folder (trend-news/languages/)
  • Make a copy of the file "trend-news.po" and rename the file to the locale of your language. For example, German would be de_DE.po. See language code list here. WordPress in Your Language
  • Open POEdit and load the file. (i.e de_DE.po)
  • Translate all the strings in the list and save changes. After you save, you will have two files. (i.e. de_DE.po and de_DE.mo)
  • Upload these files to trend-news/languages/
  • For WordPress 4.0 and above, go to Settings > General and select Site Language
  • For WordPress 3.9.2 and below, open your wp_config.php file in the root, and find this line: define('WPLANG', ''); Change it into your language code. For example, define('WPLANG', 'de_DE');

WPML Integration

Trend News was tested with WPML plugin and is fully compatible. If you want to have multilingual website, this is the best way to do it. If you want to use this plugin, you must purchase it first and then install into your wordpress installation.

Below we serve links that will be useful for WPML plugin:

12. Extras

We got some extra sections in this documentation to help you with some other things that could be also important while creating websites. We divided them into few sections and all you will find below.

12.1 SEO

In the era of what is happening in the search engines (especially Google) we implemented SEO options in our theme. We hope this will be very helpful for all of you.

To set up general options for SEO please go to Appearance > Theme Options > Advanced > SEO. You can set up here things like Meta Description or Meta Keywords for homepage and other pages/archives (this is also default option for each new page).

If you are using external SEO plugin you can easily turn it off.

Of course you can also set up options like Title, Meta Description and Meta Keywords for each page in this theme. You can do it in Pages > New page > SEO Meta Tags.

If you leave these fields empty, the page will adopt default values that are under Appearance > Theme Options > Advanced > SEO.

12.2 Retina Ready

Trend News is Retina Ready so the theme will look fantastic on High Resolution displays like the iPad or iPhone Retina devices. The most important thing to understand is that there are two different sets of images/graphics that can be Retina Ready.

  1. Theme Included Images or Icons: These are the images or icons that are included with the theme. All of the included theme images or icons are Retina Ready out of the box and do not require the user to do anything. They will look super sharp on Retina Ready screens.
  2. User Uploaded Images: The second set of images are called User Images, these are any images that the user will upload into their theme (ex: Blog Post Image). Whether or not the User Images are Retina Ready depends solely on you, the user. The general rule is that a Retina Ready image needs to be 2x the normal size. So if you have an image that is going in a space that is 100px x 100px, you would need to upload a 200px x 200px image. The easiest way to ensure that your User Images are Retina Ready is to use the WP Retina 2X Plugin created by Jordy Meow.

The WP Retina 2X Plugin For User Images

This is a fantastic plugin and is the best option for users to ensure their images are Retina Ready. It tells you if the images you are uploading are large enough to ensure Retina Resolution. And it can also convert your current media library to be Retina Ready. It will automatically create the necessary 2x images that are needed for every area of the site, and will warn you if your images are not large enough to be Retina Ready. Please watch tutorial to see how the plugin works.

Retina tutorial

Other Images Such As Logos

Some images such as the Logo need to be uploaded via Theme Options. We have created the necessary fields to ensure those images are Retina Ready. Users will need to upload the extra files that are 2x the original size. For example, you will need to upload your regular size logo file in the Logo field, then upload the 2x Logo file in the Retina Logo field. For the Retina Logo, you will also need to input the width and height of the standard logo size, not the 2x size. This is important and part of the process the browsers use to display Retina Ready images.

12.4 Maintenance Mode

Maintenance Mode allows you to set a single page for visitors to see while your site is under construction. While Maintenance Mode is enabled, they will see this page no matter what section of your site they try to access. However, note that all pages will still be visible to you while you are logged into admin.

To enable and configure Maintenance Mode you should go to the page Appearance > Maintenance Mode.

12.5 DISQUS Comments

Disqus is a networked community platform used by hundreds of thousands of sites all over the web. With Disqus, your website gains a feature-rich comment system complete with social network integration, advanced administration and moderation options _and other extensive community functions.

You can add disqus comment system to your website easily. First, you need to create a site from disqus. Follow the instructions below:

  • Click https://publishers.disqus.com/engage (If you didn't create a disqus account, signup before).
  • Click Install on Your Site on the top right.
  • Add your site name and disqus url. Then click Next.
  • Then you see platform selection window , you should choose Wordpress and follow the installation instructions.

13. FAQ

How to set a page as homepage?

  • Go to Settings > Reading or Appearance > Customize
  • Click Static Front Page
  • Select your page in the Front Page

How to install favicon?

A favicon (short for "favorites icon") is an icon associated with a website or webpage intended to be used when you bookmark the web page. Web browsers use them in the URL bar, on tabs and elsewhere to help identify a website visually.

To install a new favicon go to Apperance > Customize > Site Identity > Site Icon and upload it.

How to Paginate a Post?

In order to paginate your blog post, in the Write panel in your WordPress admin, switch to the TEXT view (if you use the Visual view) and then enter the following code to wherever you want to break the post up into a new page:

<!--nextpage-->

How to Include Google Analytics Tracking Code?

  • Copy the code given to you by Google Analytics
  • Go to Appearance > Theme Options > Advanced > Hooks
  • Paste your Google Analytics (or other) tracking code into the "Top" textfield.
  • Click Save Changes. That's it!

How To Use a Page Template?

  • Go to Pages > Add New
  • On the right-hand side, you will see the following panel titled Page Attributes with a drop-down under Template:
    If you do NOT see this panel, look to the top right of your screen for the words - Screen Options. Click that and enable the checkbox next to Page Attributes.
  • Select the Page Template you desire.

How can i change or display author/user avatar?

To change user avatar (seen on author box, comments or author page template etc.) you have two options:

  1. Wordpress fetches user avatar automatically from your Gravatar.com by default. Create a free account at gravatar.com and make sure the email of the user is the one used to create the Gravatar account.
  2. You can install some plugin which will allow you to change the user avatar instead of registering gravatar. For example, check this plugin called WP User Avatar.

14. Support

If you have any issues about installation or find any bugs related with Trend News, you can create a topic from the link below. As a first step you should create an account. You will need your envato purchase code and your envato username for registration.

http://support.xspirestudio.com/