Firstly we would love to send our great thanks to you for purchasing HTmagazine theme. This documentation covers almost everything to guide you step by step from the start to have your site on air. We encourage you to read thoroughly all section before you go on.
Thanks again and enjoy building your website with HTmagazine theme.
Before installing this theme, please make sure you have a working WordPress version already installed. Before we jump to the theme presentation we would like to provide some resources intended for users who are new to WordPress but it may also be useful for the more experienced users.
You can install the theme in two different ways: through WordPress or via FTP.
The theme requires the following plugin: Htmag Shortcodes,Htmag Theme Core,Meta Box,WPBakery Visual Composer and recommends the following plugins: Regenerate Thumbnails and Contact Forms 7.
Step 1 – After activating the theme, you will be asked to install the required and recommended plugins, you can proceed by clicking on Begin installing plugins.
Install and activate each plugin or not all of the theme features will be available.
Step 2 – In the next page, check all the plugins that you want to install then on the drop down Bulk Actions, choose Install then click Apply, the plugin installation process will start. Wait until all plugins activated then start customizing your website as you wish.
Htmag Equipped with a feature Which provides you with the fastest and easiest way to import all the sample content (pages and posts, sliders, widgets, theme options) from our demo sites into your theme with a single click.
This is recommended to do on fresh installs.To import our demo content, please see the steps below.
If it fails, you will have to request your webhost to increase your PHP max_execution_time (or any other webserver timeout to at least 300 secs) and memory_limit (to at least 196M) temporarily.
This theme includes support for the Visual Composer plugin . The Visual Composer plugin add a ton of drag and drop modules to your dashboard for quickly and easily building your site.
The Visual Composer is very easy and doesn’t really need much explanation, have a look at the screenshots below for a quick guide (you can also view this more comprehensive Visual Composer guide).
Step 1 – Create a new page, go to Pages -> Add New
Step 2 – Set the page title
Step 3 – Click Backend Editor button above the post editor.
Step 4 – Under Page Attributes, select Magazine as Template.
Step 5 – Click the + button or add element and create a row. Rows and columns are the first things you have to create. And then within these rows, you can click the "+" button to add the other elements.
Once you have created a page that you would like to use as your homepage, follow these steps:
Step 1 – Go to Settings > Reading.
Step 2 – Choose "A static page" option for Front page displays.
Step 3 – Next to Front Page, select the page you created to be used as the homepage.
Step 4 – Save Changes.
We integrate 7 models of boxes. It is the most used in the construction of news sites and magazines ,News Box,News in Picture,Scroller ,Recent Posts,Video box ,ADS boxe and Feature Slider.
HTmag supports custom WordPress menus, with multiple levels of dropdown support for the main menu. There are 2 areas of the theme where you can assign a menu; the main menu, the top menu.
Go to to Appearance > Menus.
In the "Manage Locations" area, under Main Navigation, select Main Menu and Top Menu. Click Save.
To setup a new menu, please follow the steps below.
The category mega menu is a 2 column mega menu that shows sub-categories in first column and 4 recent posts in the second.
The category mega menu is a 2 column mega menu that shows sub-categories in first column and 4 recent posts in the second.
The first one is used to create an organized multi-column list of links. We call it the "Links Mega Menu".
HTmag Is equipped with a great feature,Which enables you to customize your categories as you want with custom Category Listing Style,background, color, logo, sidebar or slider . To get a different category from other categories.
From this section you Control and Manage all Article features ,Display style ,social buttons,posts meta and more...
Add Post in Ward Press is very easy and does not require an in-depth explanation, For this we confine ourselves to explain the most important things and features only.
you can create one of 10 different post formats. Standard,Aside, Video, Audio, Gallery ,image,Quote,Status and Link. Each of these formats structures you post differently, putting more focus on the type of content that the format represents.
When you write a blog post, you will notice a box to the right of your text editor called "Format." Within this box are the 9 format options. Choosing "Standard" will result in a normally-formatted blog post, while each other options has a unique design associated with the format type.
Selecting the Video post format will place a video at the top of your post. It will also replace the standard Thumbnail image on post pages with a video embed. After you have selected the "Video" post format from within the Format options box, the next thing you need to do is add a video to your post.
To add a video to your post, simply input the youtube our vimeo URL within the post editor, or use the "Add Media " button to upload and embed your own video file.
Selecting the Audio post format will display an audio player on your post.It will be put down the standard Thumbnail image. After you have selected the "Audio" post format from within the Format options box, the next thing you need to do is add a Audio to your post.
To add an audio file to your post, use the "Add Media" button to upload your audio file., Or simply input the SoundCloud url , or use the embed code.
The gallery post format will display a gallery of images at the top of your post. It will also replace the standard Thumbnail image on post page with an image slider. Once selected, the Gallery post format will use the first gallery that you added to your post.
Galleries can be added to your post using the WordPress Media Editor. Simply click the "Add Media" button to create a gallery and add it to your post.
The Quote post format will display a stylized quote at the top of your post. The quote will also replaced the standard Thumbnail image on post page. Once selected, the Quote post format will use the first Blockquote in your post as the quote content.
Block quotes can be added easily ,Copy the text to be quoting then paste it In the field , You can also put the author's name.
The Google Map post format will display a Map at the top of your post. It will also replaced the standard Thumbnail image on post page.
Google Map can be added easily ,input the Google Map url
Htmag Includes with a large number of options that allow you to control the properties of the Post page. You can change the color, background and place of the sidebar and enable or disable all options related to the page.
Htmag includes a built-in Review System which allows you to add amazing ratings and reviews to your posts and pages with 3 different style Stars,percent and points..
This element displays posts related to current article, based on Category ,Tag or Author relation.
From this section you Control and Manage all Article features ,meta information,image,author box ,share buttons ,Relted posts and more ...
You can create an unlimited number of pages. HTmag includes several page templates to choose from, and you will need to choose the page template that suits your needs. All of this is done in the pages section of your wordpress admin.
Setting up a contact page requires that you install the "Contact Form 7" (go to Appearance > Install Plugins if you have not already installed it).
<div class="row-fluid"> <p class="span4 field"> [text* name placeholder "Name :"]</p> <p class="span4 field"> [email* Email placeholder "Email :"]</p> <p class="span4 field"> [text* Subject placeholder "Subject:"]</p> </div> <p class="span4 field"> [textarea Message placeholder "Message :"]</p> <p class="submit-wrap"> [submit "Send"]<input class="wpcf7-clear" type="reset" value="Clear"></p>
For more information, refer to Contact Form 7's FAQ and Docs.
Theme Options > Contact . The Contact tab also holds various options to customize the map and its various elements.
Htmag allows you to show the Title site as a logo or select Custom Image Logo . We recommend that you use this option.. Go to Appearance > Theme Options > Header Options.
From this section you Control and Manage all header features ,logo,Top menu,Date,Social icon,Search box and Breaking news.
Turn On this button to enable fixed navigation menu when scrolling.
Enable or disable the news ticker, you can place a custom address , set the number of lines that appear and select news sourcer.
The Htmag theme comes with 8 footer styles. It consists of three parts ,The head area the widget area and the copyright area. can be configured in Theme Options on the Footer tab.You can now customize the footer by adding text, widgets,logo,menu or social icons .
The widget area consists of 4 total columns, and each column can have its own set of widgets. You can select to show 1, 2, 3 or 4 columns in the footer widget section, whichever column width you choose will allow the widget area to stretch the full width of the column. Footer widgets are added in the widget section of your admin. The following sections will cover each of these aspects of the footer that are listed below.
You have the ability to change the the default sidebar position. Choose which side of the page your sidebar will be on.
if you want use a Custom Sidebar Position for your pages or posts ,Choose the “Sidebar Position” From post edit page.
if you want use a Custom Sidebar Position for your Categorys,Choose the “Sidebar Position” From Category edit page.
Htmag allows you to create an unlimited number of sidebars on the fly.Any sidebar can easily be applied to a page,post,home or Category . It’s a great way to customize each page with a unique sidebar. Please see the steps below to understand how you create a sidebar.
After you are done adding new Sidebar, you can assign your Custom sidebar to Home , posts , pages or archives .
if you want use a Custom Sidebar for your pages or posts ,Select your custom sidebar from the Sidebar Options box in post edit page.
if you want use a Custom Sidebar for your Categorys,Select your custom sidebar from the Sidebar Options box inCategory edit page.
HTmag includes several custom widgets. All widgets are accessed in the Widgets section of the WordPress admin. Widgets can be added to any sidebar, footer column.There are various fields and settings to choose for each individual widget; all are self explanatory. You can put as many widgets as you want inside of a sidebar or footer/sliding bar column. Please read below for information on how to add widgets.
Htmagazine Theme has a fully customizable Theme Typography options where you can set custom, Google and standard fonts, font sizes and font line heights. Everything you need to adjust your website fonts you will find under the Theme options > Typography tab!
Htmagazine have a huge bunch of options to change and customize typography in easy way.
Navigate to WP Dashboard > Theme Options > Typography : If you want to change the Main Font , Heading Font etc. choose the font the font weight, font size , line-height,Color etc. and Save Settings.
Allows you to use the methods of multi ads, image ads , custom advertising and Responsive Google Adsense.This latter enables you to maximum benefit of Google ads where you will be able to show several sizes to advertise By using a Responsive technique
From this section you Control and Manage your banner ,for more information See the detailed explanation.
If you want to use other advertising code, Flash Advertisement or any a custom Ads use this option.
This article will cover translating the Htmagazine theme into any language apart from the default (en_US). if you’d like to learn about translating plugins, here are some great articles you can check out.
Htmagazine Comes with advanced and useful panel that help you to translate theme only in minuets without using any extra tools and technical requirement! Just go to theme options → Translation and translate the strings to your language.
The final step is to tell WordPress which translation file to use for your website.
For languages that read from right-to-left unlike English which is left-to-right, will automatically switch to an RTL style, as long as you it's in your language and uses the correct locale...... check this page for more informations .
Htmag came with advanced Theme Options panel that is loaded with options. We have the options organized into logical tabbed sections, and each option has a description of what it will do on the front end. There are too many options to go over in these docs but please take some time and navigate through each tab to see what we offer. Go to Appearance > Theme Options in your WordPress admin to access the theme options panel. You can also backup your theme options by clicking on the backup tab. That is a great way to move your custom options from site to site. See below for screenshots of our theme options panel. Please note: we are always adding new options so these screenshots may not reflect the most up to date options.
htmagazine is fully compatible with latest version of Woocommerce Plugin. We added required stylings to fit the design, and all required confiq codes to make it seamless with htmagazine. If you dont need Woocommerce simply dont install it and all the features, codes and anything required for woocommerce will not be loaded and interfered. Vice versa, if you need to set up woocommerce just install woocommerce like you do for other plugins and thats all about it. you dont need to do anything else.
Htmag includes useful built-in Shortcodes ,Which allows you to add a lot of amazing additions To your Post or Page.
Shortcodes are added to any post, page or widget by simply adding the shortcode as shown in the examples below. Some shortcodes also have optional parameters so you can customize it even more.
When you go to edit a post or a page, you’ll find a Shortcode Generator button in the post editor window. This button allows you to insert any shortcode into your post or page.
[dropcap ] A [/dropcap]
[dropcap style="style-1" ] A [/dropcap] [dropcap style="style-2" ] A [/dropcap] [dropcap style="style-3" ] A [/dropcap]
[dropcap style="style-1" color="#F600FC" ] A [/dropcap]
[dropcap color="#FCDE00" style="style-3" background="#FC0000" ] A [/dropcap]
[list ] [list_item]ADD_LIST_CONTENT[/list_item] [list_item]ADD_LIST_CONTENT[/list_item] [/list]
[list type="line" ] [list_item]ADD_LIST_CONTENT[/list_item] [list_item]ADD_LIST_CONTENT[/list_item] [/list] [list type="star" ] [list_item]ADD_LIST_CONTENT[/list_item] [list_item]ADD_LIST_CONTENT[/list_item] [/list] [list type="yes" ] [list_item]ADD_LIST_CONTENT[/list_item] [list_item]ADD_LIST_CONTENT[/list_item] [/list] [list type="no" ] [list_item]ADD_LIST_CONTENT[/list_item] [list_item]ADD_LIST_CONTENT[/list_item] [/list] [list type="bullet" ] [list_item]ADD_LIST_CONTENT[/list_item] [list_item]ADD_LIST_CONTENT[/list_item] [/list]
[table] Header 1 Header 2 Division 1 Division 2 [/table]
[one_half][/one_half] [one_half_last][/one_half_last] [one_third][/one_third] [one_half_last][/one_half_last] [two_third][/two_third] [two_third_last][/two_third_last] [one_fourth][/one_fourth] [one_fourth_last][/one_fourth_last] [three_fourth][/three_fourth] [three_fourth_last][/three_fourth_last]
[box type="secondary" ] Content [/box] [box type="info" ] Content [/box] [box type="success" ] Content [/box] [box type="warning" ] Content [/box] [box type="error" ] Content [/box] [box type="download" ] Content [/box] [box type="note" ] Content [/box]
[button color="red" size="small" link="http://" ]Button Text[/button] [button color="red" size="medium" link="http://" ] Button Text [/button] [button color="red" size="big" link="http://" ] Button Text [/button]
[tooltip text="Insert the text " gravity="nw"]Insert the text that will activate the tooltip hover[/tooltip]
[divider ] [/divider] [divider style="double" ] [/divider] [divider style="dashed" ] [/divider] [divider style="dotted" ] [/divider] [divider style="sep-stripe" ] [/divider]
[toggle_box] [toggle_item icon='user' title='ITEM_TITLE']ADD CONTENT HERE[/toggle_item] [toggle_item icon='heart' title='ITEM_TITLE' active='yes|no']ADD CONTENT HERE[/toggle_item] [/toggle_box]
[tabs type="horizontal" Style="red" ] [tab_item title='Tab1']ADD CONTENT HERE[/tab_item] [tab_item title='Tab2']ADD CONTENT HERE[/tab_item] [tab_item title='Tab3']ADD CONTENT HERE[/tab_item] [/tabs]
[tabs type="vertical" Style="red" ] [tab_item title='Tab1']ADD CONTENT HERE[/tab_item] [tab_item title='Tab2']ADD CONTENT HERE[/tab_item] [tab_item title='Tab3']ADD CONTENT HERE[/tab_item] [/tabs]
[audio mp3="your url Here" ] [audio m4a="your url Here" ] [audio ogg="your url Here" ]
[accordion] [acc_item title='ITEM_TITLE']ADD CONTENT HERE[/acc_item] [acc_item title='ITEM_TITLE']ADD CONTENT HERE[/acc_item] [acc_item title='ITEM_TITLE']ADD CONTENT HERE[/acc_item] [/accordion]
[googlemap src="Insert Map Url " ]
[facebook][tweet][digg][stumble][Google][feedburner name="Feed Name"][pinterest][follow id="Username" size="large" count="true" ]
[embed]your url here[/embed]
[soundcloud soundcloudurl="http://" ]your url here[/soundcloud]
[lightbox full="Full Image Url" title="Lightbox Description" width="250" height="250" smal="Thumbnail Image url" align="right" ][/lightbox]