Viral Documentation

Theme Installation

Installation via FTP/Cpanel

To Install the theme via FTP/Cpanel follow these steps:

• Download a Copy of Viral Theme zip file from WordPress.
• Save the downloaded theme zip file in your hard drive.
• Extract the downloaded zip file you will find a folder with style and other theme files inside it.
• Now Connect the ftp server using the FTP details and copy the extracted folder to ‘site-name/wp-content/themes/’ path.
• Now go to the Dashboard > Appearance > Themes.
• You’ll see the Viral theme in the theme dashboard.
• Activate the theme.

Install via WordPress Dashboard

To install the theme via WordPress Dashboard follow these steps:

• Login into WordPress Dashboard.
• Go to Dashboard > Appearance > Themes.
• Click on Add New button then search for the Viral keyword in search field.
• Hover over the Viral theme from the search result and click on Install button.
• Once installed Activate the theme.

Import Demo Content

Viral theme comes with a one-click demo import feature. It will allow you to install the demo data in a single click and save your time as you won’t have to build your website from scratch.

To install the demo data on the website:

• Go to Appearance > Viral Settings.
• On the right side of the page, you will see a Demo Importer Section. Click on the “Install Demo Importer Plugin” button.

• After the plugin is installed and activated, click on the “Go to Demo Importer Page”
• You will land to the HashThemes OneClick Demo Importer Page where you will see a list of free and premium demos.

• You can directly install the free demos. While for the premium demos, you need to purchase the pro version of the theme – Viral Pro.
• Click on the “Preview” button to get a quick view of the demo and the “Install” button to install the demo.
• On clicking the “Install Button” a popup will appear that will show the list of required plugins for demo import and to reset your website. If you do not have important content then it is recommended to reset the website so that demo import works flawlessly. Resetting websites will delete all your content.

• If you have no problem resetting your website then check the “Reset Website” option and click on the “Import Demo” button.
• The demo installation window will appear that will install all the required contents like XML content, customizer settings, widgets, and other required contents.
• Congratulation, the demo data is successfully installed on your website. Now you can view your imported website.

You can also check out our video tutorial for a better understanding of how to import demo content on your website using HashThemes Demo Importer Plugin:

Home Page Setup

Configure Front Page to Display Featured Home Page

Featured Home Page refers to the home page with various section such as About Us section, Featured Block Section, Portfolio Section and more.

To display a static front page follow these steps:

• Go to Appearance > Customizer > Homepage Settings.
• Set your homepage displays option to Your latest posts.
• Then, set the Enable FrontPage option to “Yes“

• Once done, click on the “Publish” button to save changes.

Now, you can go to the Homepage Section/Settings to customize your homepage.

Note: Enabling FrontPage option while setting your homepage displays as your latest posts will entirely overwrite your post page.

Setting Up Featured Homepage Along With Post Page

In the above step, the post page will be entirely overwritten by the featured homepage of the theme. So, if you want to a post page on your featured homepage, follow these steps:

• Go to Appearance > Customizer > Homepage Settings.
• Set your homepage displays option to A static page.
• Then, select any page you want for your homepage dropdown.
• Also, select the page where you want to locate all your posts.
• Set the Enable FrontPage option to “Yes“.
• Now the homepage will display the Featured Homepage section and the page that you have chosen for the Posts page will display all your blog posts.

• Click on “Publish” to save changes.

Configure Front Page to Display Static Page

With the Static Frontpage,  you can display a simple page content on the Home Page. Or you can even use the page builder to create various designed layouts.

To display a static front page follow these steps:

Create a page

• Go to Pages > Add New.
• Enter the title for the page.
• Enter the contents of the page in the content area.
• Click on Publish/Update button.

Configure to display a static front page

• Go to Appearance > Customizer > Homepage Settings.
• Set the option to A static page and choose the page you created from the Front Page drop-down list.

• Click on the “Publish” button to save changes.

Note: To display a Static Page as a homepage, you must disable the “Enable FrontPage” option.

Configure Front Page to Display Blog Posts

If you want to display a list of your latest posts (Blog) on the Home Page then follow these steps:

• Go to Appearance > Customizer > Homepage Settings.
• Set the option to Your latest posts.
• Click on the “Publish” button to save changes.

Note: To display the latest posts on the homepage, you must disable the “Enable FrontPage” option.

Configuring Homepage Using Elementor

Alternatively, you can configure the homepage of your website by using the Elementor Page Builder plugin. It will let you create your own custom static homepage via Elementor.

To set up the homepage using Elementor Page Builder, follow these step:

• Go to Page > Add New to create a new page.
• Give Title for your new page and choose the page template “Blank Template (For Page Builder)” from Page Attribute Section.
• Once done, click on the Publish button to save changes.

• Now, go to Appearance > Customize > Homepage Settings to set your newly created page as your homepage.

Important: Keep the Enable FrontPage setting turned off as turning on this setting will overwrite your homepage with the one created from the customizer.

• Once done, click on the “Publish” button to save changes.
• Now go to Appearance > Viral Settings > Recommended Plugin to install Elementor and Hash Elements plugin.

• Then, edit your newly created page and click on “Edit with Elementor” to create your homepage from Elementor.

• Drag and Drop different elements that you want to add on your homepage.
• Once done, click on the “Update” button to save changes.

Configure Web Layout

The theme provides you the option to set wide flat layout or boxed layout for your site. To Set the Layout for your website follow these steps:

• Login to you Dashboard.
• Go to Dashboard > Appearance > Customize.
• Go to General Settings > Website Layout.
• Now Choose either Full Width layout or Boxed layout as per your requirement.
• Once done, Click on Save & Publish button.

Configure Header

Configure Top Header

Configure Top Left Header Part

• Go to Dashboard > Appearance > Customize.
• Go to Header Settings > Header Settings.
• Checkmark on Show Date in Header option if you wish to show date in top left side of the header else leave this option unchecked.
• Set the text on the top left header part by adding the text in Header Left Text textfield.

You can configure the menu on the top left part of the header by:

• Going to Dashboard > Appearance >  Menus.
• Now, Create a new menu or select the existing menu and set its Theme locations as Top Header Menu.
• Once done Save the options.

Configure Top Right Header Part (Social Links)

• Go to Dashboard > Appearance > Customize.
• Go to Header Settings > Header Social Icons.
• Set the social links for social media like Facebook, Twitter, Pinterest, Youtube, Linkedin, Instagram etc.
• Once done Save & Publish the changes.

Configure Site Logo

• Go to Dashboard > Appearance > Customize.
• Go to General Settings > Site/Title/Logo/Favicon.
• Click on Select Logo button and choose the logo from the media library.
• Once done, Save & Publish the changes.

Menu Setup

– Creating General Menu

1) Defining a Menu

You must define a menu before you can add items to it.

• Login to the WordPress Dashboard.
• From the Appearance menu on the left-hand side of the Dashboard, select the Menus option to bring up the Menu Editor.
• Select Create a new menu at the top of the page
• Enter a name for your new menu in the Menu Name box
• Click the Create Menu button.

Your new custom menu has now been defined.

2) Adding Items to a Menu

You can add different link types into your menu, these are split between panes left of the menu you’re currently editing.

• Locate the pane entitled Pages.
• Within this pane, select the View All link to bring up a list of all the currently published Pages on your site.
• Select the Pages that you want to add by clicking the checkbox next to each Page’s title.
• Click the Add to Menu button located at the bottom of this pane to add your selection(s) to the menu that you created in the previous step.
• Click the Save Menu button once you’ve added all the menu items you want.

Configure Header Ads

• Go to Dashboard > Appearance > Customize > Widgets.
• Add Viral: Advertisement widget to Header Ads widget area.
• Now configure the header ad widget by setting ad title, image and link.
• Once done, click “Publish” button.

Setup Home Page Section

The theme allows you to configure total 4 sections to display the magazine blocks in the Home Page.

1. Home Top Section.
2. Home Middle Section – Left Content.
3. Home Middle Section – Right Sidebar.
4. Home Bottom Section

Configure Home Top Section

The home top section contains a news ticker section and the option to display different news categories in the grid block layout.

1) Configuring News Ticker Section

• Go to Appearance > Customize > Front Page Sections > Home Top Section.
• Give the Ticker Title.
• Choose the Category to the News that you want to display on the News Ticker.
• Click on the “Publish” button to save changes.

2) Configuring Home Top Section using Grid Block Layout

• Go to Appearance > Customize > Front Page Sections > Home Top Section.
• Click on Add Section to add a new section.
• Give the title to your new section.
• Then select the category of the news that you want to add on the Top Home Section of your website.
• Now choose any of the grid block layouts as per your preference.
• Click on Publish button to save.

You can add and place unlimited number of sections and simply enable/disable any of them as per your requirement.

The 4 different block layouts available on the Home Top Section are:

Configure Home Middle Section – Left Content

Home Middle Section (Left Content) provides you an option to add unlimited news sections choosing any 4 beautifully designed grid block layouts. One may create a beautiful magazine website in no time.

Configuring Home Middle Section – Left Content using Block Layout

• Go to Appearance > Customize > Front Page Sections > Home Middle Section – Left Content.
• Click on Add Section to add a new section.
• Give the title to your new section.
• Then select the category of the news that you want to add on the Home Middle Section – Left Content of your website.
• Now choose any of the grid block layouts as per your preference.
• Click on the Publish button to save.

Similar to the Home Top Section, you can add and place unlimited number of sections and simply enable/disable any of them as per your requirement.

The 4 different block layouts available on the Home Middle Section – Left Content are:

Configure Home Middle Section – Right Sidebar

HOME MIDDLE SECTION – RIGHT SIDEBAR

Right Middle Section (Right Sidebar) is mainly composed to place different types of widgets like audio, video, advertisements, timeline, etc. The theme comes with 5 different inbuilt widgets that are:

• Viral News: Advertisement
• Viral News: Category Block
• Viral News: Contact Info
• Viral News: Personal Info
• Viral News: Timeline

You can add these widgets plus inbuilt WordPress widgets on the right sidebar by following steps:

• Go to Appearance > Customize > Front Page Sections > Home Middle Section – Right Sidebar.
• Click on Add a Widget to place a widget.
• Place as many widgets as you need. You can also reorder them by clicking on the reorder link or simply using the drag and drop process.

Configure Home Bottom Section

Home Bottom Section provides you with 2 beautiful block layout to places your news articles. Here is a step by step guide to configure section:

• Go to Appearance > Customize > Front Page Sections > Home Bottom Section.
• Click on Add Section button. A new News Section will be added.
• Open the newly added News Section.
• Now choose 3 different categories of which you want to display the news.
• Then select any of the block grid layouts of your preference.
• Once done, click on the Publish button to save.

The 2 different block layouts available on the Home Bottom Section are:

Footer Setup

The template allows you to add up to 4 widgets on the footer. To configure the footer widgets, you can follow these steps:

• Go to Appearance > Customize > Widgets.
• Now choose the footers where you want to add the widgets.
• Once done, click on the Publish button to save.

— THE END —