WordPress Theme Installation Instructions

Thank you for buying WordPress themes from HotThemes!

This document will guide you how to install the theme onto your server. It will also describe some of the theme's features and how to edit theme parameters. However, it will not teach you WordPress or some basic web design techniques (see Assumptions part).

Don't like reading guides? Please read (at least) this:

  1. Unzip (unarchive) what you downloaded prior to using it!
  2. If you want to install the theme altogether with DEMO DATA, do not install it as you usually install themes! Make sure you follow HotStart Installation to install this theme properly!
  3. If you want to install the theme altogether with DEMO DATA, you don't need to install WordPress prior to theme installation! Original WordPress installation is included in the HotStart theme installation.


Assumptions

You know WordPress

This document will not teach you how to use WordPress and it's assumed that you have a fair knowledge of this matter. You may read official WordPress documentation here: http://codex.wordpress.org/Main_Page or find some nice books about WordPress here: http://wordpress.org/about/books/.

You know how to unpack (unzip) the archive

It's assumed that you know what's ZIP and how to unzip the archive you downloaded.

You know how to use a FTP program

It's assumed that you know what's FTP and how to use it. You can use any FTP program to upload files onto the server, however, we strongly recommend FileZilla. We found it as a stable and reliable software. It can be downloaded for all platforms for free here: http://filezilla-project.org/

Use only plain text editors

If you need to edit a file that's a part of our themes or plugins, please use only plain type text editors. On Windows, you can use Notepad (and you must not use WordPad or MS Word). On Mac, you can use TextEdit, but make sure it works in Plain Text Mode (TextEdit > Preferences > New Document > Plain Text).

You have a WordPress compatible hosting account

It's assumed that you have a hosting account that's compatible with WordPress. Check technical requirements of WordPress and make sure your host meets them: http://wordpress.org/about/requirements/. If you don't have a hosting account yet, we recommend you to find a cPanel based hosting.


I installed theme in my WordPress, but it doesn't look as on your site

This is the most common error! You should not install theme through WordPress, if you want to copy DEMO DATA!

Please read HotStart Installation section of this document to install the theme properly!

You should not install WordPress prior to theme installation! If you want to copy demo data that comes with the theme, please follow HotStart Installation instructions instead. This method contains a new WordPress installation. This is the only way to copy the demo data!

If you have a live site that already contains data, you may insist not to install a new WordPress. But you can't copy demo data in this case (it would overwrite your site's data) and you must setup everything manually. There will be a lot of work (depending of the size of your site), so we recommend you to install our theme with demo data (HotStart) separately and to check how the things are set up. Then, you can copy settings, pages, posts, menus, etc. on your site.


HotStart Installation

You have purchased this product (most likely) because you were impressed with our demo! Now, you expect to see that same on your server. This is possible if you install theme using the HotStart installation method.

Once you finish this installation method, you should get exactly the same copy of the theme demo site on your server. Let's start!

Step 1 - Unpacking (unzip)

Download the archive hot_themename_wp_unzip_first.zip. Unzip it on your computer. It contains several files. One of the files is wp_hot_themename_hotstart.zip.

If your hosting account includes some kind of file manager, you can upload the archive hot_themename_hotstart.zip and then to unzip it directly to the server using server's tool for unpacking archives. For detailed instructions how to use online file manager and unpackager, please consult your hosting provider's instructions.

(If you are unable to upload archive and unpack it directly to the server) You create a separate folder on your computer and unzip hot_themename_hotstart.zip there. The unpacking may take several minutes. If you did it well, you would see several folders and files (see image).

All these files and folders actually represent a WordPress installation package. It's modified to copy our demo data instead of default WordPress demo data.

Step 2 - Uploading files

(If you are unable to upload archive and unpack it directly to the server) You can use the FTP program (such as free FileZilla - http://filezilla-project.org/) to upload all files and folders (that you unpacked in the previous step) to your hosting space. There are many files (several thousands), so it may take some time, depending of your upload connection speed.

The left pane of your FTP program represents the folder on your computer where you unpacked hot_themename_hotstart.zip archive. The right pane represents a folder on your web hosting space. If you'd like to install theme in the root site folder (to see it when you go to www.yoursite.com), make sure you're uploading files into site's root folder. To find out what's site's root folder of your hosting space, consult your hosting provider.

At the end of uploading process, your left and right pane must contains the same files and folders. Make sure there are no files in the "Failed Transfers" pane (bottom). If there are some files, upload them again.

Step 3 - Checking permissions

This is very important, especially if you uploaded and unpacked files through the hosting's control panel.

Make sure the folder where you uploaded files is readable by the server (all folders should have permissions set to 755, and all files should have permissions set to 644). You can check this in the "Permissions" column (the right pane) in FileZilla.

If the permissions are not correct, you must change them! Select all the files and folders (in the right pane), right-click and select File permissions...

Enter 755 in the field "Numeric value". Select "Recurse into subdirectories" option and select "Apply to directories only". Click OK and FileZilla will change permissions of all folders. It may take several minutes.

Now, repeat the procedure for the files. Select all the files and folders (in the right pane) again, right-click and select File permissions... Enter 644 in the field "Numeric value". Select "Recurse into subdirectories" option and select "Apply to files only". Click OK and FileZilla will change permissions of all files. It may take several minutes.

Make sure once again that all files and folders have correct permissions. Look at the permissions column. Browse the folders (such as "wp-admin", "wp-content"...) and make sure that files and folders inside them also have the correct permissions set (755 for folders, 644 for files).

If you can't change the permissions, maybe it's not allowed by your hosting provider. Ask your hosting provider to change permissions of the uploaded files and folders for you.

Step 4 - Prepare MySQL database

Your hosting account must have at least one MySQL database included. You should know connection parameters of the database. The connection parameters are:

  1. Database Host (usually it's "localhost" or IP address or address)
  2. Database Name (this is the name of your database)
  3. Database User Name (this is the name of user that connects to the database)
  4. Database Password (this is the password of user that connects to the database)
You most likely received these when your hosting account has been activated. If you don't have those 4 MySQL connection parameters, please contact your hosting provider.

Step 5 - Starting WordPress installation

In case that you uploaded the HotStart files in the root folder of your hosting space, in browser go to http://www.your_site_address.com/index.php (change your_site_address.com with your real site address).

If you uploaded the HotStart files into a subfolder of your hosting space, you should go to http://www.your_site_address.com/subfolder/index.php (change "subfolder" with folder name where you uploaded files.

If you got 404 error (page not found), you probably missed the root folder. Root folder of your web hosting space are usually named as "public_html" or "html" or something like that. Contact your hosting provider and ask where is your site's root folder, if you are unsure.

If you see this screen on your browser, you're doing good so far!

You should click "Create a Configuration File" button and WordPress installer will create the configuration file.

Step 6 - Checking your server

On the next screen, WordPress installer asks you to have database connection parameters ready. We already explained that.

You can click Let's go! button on this screen.

Step 7 - MySQL Connection

You should enter MySQL database connection parameters (that you prepared in Step 4) now. Enter your Database's Name, Username, Password and Database Host into the fields.

You must leave the Table Prefix field unchanged.

Click SUBMIT.

If you got an error message, please check database parameters. It's important to enter them correctly. Hostname is address of your MySQL server (can be localhost, IP address...). Database Name is the name of your database. Username is the name of the user that connects to the database (don't mix it with database name). Password is a secret word that User uses to connect to the database. If you don't know correct parameters, please contact your hosting provider.

Step 8 - Running the Installation

If you see this screen, your database parameters are OK and you are on the good way to accomplish this process. Click Run the install button on this screen to proceed.

Step 9 - Site Information

On the next page, everything is pre-entered and you can't change anything. The installer will give dummy name for your site. It will also create administrator's account with a dummy email address. Both username and password for the administrator's account will be "admin".

Don't worry! You can easily change everything later through WordPress, when the HotStart installation is done. For now, just click Install WordPress button.

Step 10 - Finishing the Installation

The last screen of the HotStart installation gives you information that you successfully accomplished the procedure.

Under the WordPress logo, between the brackets [ and ], you can see the link of your new site. We hope you already know that ;). This is just one more confirmation that installation is done!

From here, you can see your new site (enter site link in your browser) or you can click the Log In button to enter WordPress Dashboard. Please click the Log In button and enter admin for both username and password. Click Log In button.

The first thing to do is to change the unsafe username and password. In WordPress Dashboard, in the left column, click Settings > General. Change e-mail address, site name and slogan (if you need to). Click Save Changes.

Finally, in the left column of WordPress Dashboard, click Users > Your Profile. On this page, you should change your password (enter it twice). Also, you should change email address and enter the real one. The rest information can be entered, but they are not mandatory. Finally, click Update Profile.

Keep your password safe and don't forget it. If you forget it, your WordPress can send you the reset password link, but only if you entered your real e-mail address.

Open the front-end of your site now. You should see the home page that's exactly the same as our demo. If you get 404 Not Found errors when you click any link, then you should set Permalinks. To do this, go to Settings > Permalinks. The Postname option should be selected. Click the Save Changes button. This will create an invisible .htaccess file on your site root. This file is needed for permalinks. Your site links should be working fine now.

The theme installation altogether with all demo data (plugins, pages, posts, categories, tags, menus, menu items, etc...) is done! You can start modifying your new site and change our dummy demo data with your real data.


Basic Theme Installation (no demo data)

If you are about to start a new website, it's strongly recommended to use HotStart method! Otherwise, a lot of work is ahead of you to create a website that looks like our demo site!

The Basic Installation method should be used only if you don't need our demo data. Keep in mind, after this installation, your site will not look the same as our demo server! The only reason to install theme using this method, and not the HotStart method, is to keep data that you already have in the site. Howerver, in this case, after the theme installation, you must setup many things manually.

Our proposal in this case is to install the template using HotStart Installation in a subfolder and then check how WordPress things are set there. You can copy all the settings and content (posts, pages, menus...) from there to your live site.

Step 1 - Download and Unzip The Theme Archive

You should download archive hot_themename_wp_unzip_first.zip from our download section.

Don't try to install this file! As its name suggests, you should unzip it first!

When you unzip this archive, you will have several files. The file you should use for the Basic Theme Installation is named as wp_hot_themename.zip.

Step 2 - Uploading The Theme Through WordPress

From WordPress Dashboard, go to Appearance > Themes. Click the Add New button. Click Upload Theme button. Click Choose File button. Choose the file from the Step 1. The file name should be wp_hot_themename.zip ("themename" should be the real name of your theme). Click Install Now button. After few moments, you will receive message "Theme installed successfully". Click "Activate" link now to activate the theme.

The result is different than what you've seen on our Demo?

Yes, this is true! Since you installed theme only, the demo data have not been installed. Most likely, your site looks messy now. You need less or more work to make it look properly.

So, if you need this theme with Demo data, please complete the HotStart Installation.


Theme Settings

Our themes are highly customizable. It's possible to change layout, colors, font, dimensions, and so on.

To reach the Theme Parameters , from your WordPress Dashboard, go to Appearance > Hot Theme-name Options to open the Theme Settings page where you can set various parameters of the theme. This page contains varous settings depending of the theme's elements. Each parameter is given with description. You can pick colors easily using the color picker.

When you make any changes in the Theme Options page, you should click the Save Changes button. This will save your parameters and site front-end will be changed according to your settings.


Widget Positions

Widget positions are the placeholders for your WordPress widgets. If you install theme using HotStart method, all plugins will be pre-installed and the widgets will be placed in the appropriate widget positions. If you didn't use the HotStart installation, then you must install all the plugins yourself and select appropriate widget position for each plugin.

Each theme demo contains dozens of Widget Positions. We prepared a graphically presented "map" of all available widget positions for each theme. To find this "map" for your theme, please go to this link http://demo.hot-themes.com/wordpress/widget_positions/, and select the "map" by selecting the theme name. The image with widget positions map for this theme will be loaded.

Widget Control Integrated

When you install a WordPress plugin and create a widget, it would be published on all pages of your website. Have you ever wondered how to publish some WordPress widgets on certain pages only? WordPress core does not allow users to select pages where a widget would be published. Instead, it publishes it on all the pages. If we had a big image or news rotator widget on the home page that occupies a lot of space (which is OK for the home page), it would be odd to have the same widget on all the pages throughout the site.

How to publish the widget only on certain pages? First of all, we should select pages where to publish (or hide) the widget (they are published on all pages by default). The first criterion for pages selection is by page type (front page, blog index, single post, single page, attachment, search, all archives, category archive, tag archive, author archive or 404 error). All those page types are presented as checkboxes. Another criterion is by number of words on page. In gives you ability to select pages that have less or more words than the number you entered. There's also a text box where you can select pages by URL (one rule per line). Simply enter page URL, in example */test and to select page yoursite.com/test. In this text box you can use wildcards, in example category/news/* to target all news category posts, or 2011/* to match articles written in year 2011.

After you finished the pages selection, you should determine whether to show or hide the widget on the selected pages. Make your selection in the Widget visibility selector.


Shortcodes

Typography determines what fonts are used on your site and how they are styled. Themes come with different typography aspects, depending of the overall theme style. You would need to use different font styles for headings, subheadings, paragraphs, lists, quotes and so on. However, all those font styles should be in a harmonic relations. The art of typography starts there!

Our themes come with pre-defined font styles for most commonly used elements of text. Furthermore, there are some additional font styles that you may find useful for your site. To see how all text styles available in a specific theme, please visit our demo server (http://demo.hot-themes.com/wordpress) and select your theme. Then select the Typography link from the menu. The Typography page will show you all text styles available in this theme as well as how to implement them on your text.

You can use various typographic elements with shortcodes.

Text hightlighted with marker

Use shortcode [highlight style='yellow']your text here[/highlight]. Available colors are yellow, green, purple, blue, pink and orange.

Text Blocks

Use short code [box style='error']Your text here.[/box] Available styles are error, info, warning, typewriter and quote.

Paragraphs Marked with big Number/Letter

Use this shortcode [dropcap style='square']1[/dropcap]Your text here. You can put any number or letter instead of 1. Available styles are default, circle, square and round.

Unordered Lists

Use this shortcode:

[list style='unordered']
[list_item]List element one[/list_item]
[list_item]List element two[/list_item]
[list_item]List element three[/list_item]
[/list]

Available styles are unordered, arrow, arrowleft, calendar, checklist, delete, email, file, heart, information, lock, pencil, person, rss, shop, song, star, star2, trash, tweak, unlock and warn.

Buttons

Use short code [button url='#' size='small' style='blue-light'] Button text [/button]. URL can be any link. Size parameter can be small, medium or large. Available styles are blue-light, blue, blue-dark, cyan, green-light, green, green-dark, orange, purple, red-light, red, red-dark, grey-light, grey-dark and black.

Social Buttons

You can use the following shortcodes to add social buttons to your posts: [twitter], [facebook], [gplus], [digg], [stumbleupon], [linkedin].

Video from Youtube or Vimeo

You can use the following shortcode to add Youtube videos to your posts: [video type="youtube" height="315" width="420" align="aligncenter" id="n99XBFmH6Zc"]. In this shortcode, you can change parameters for height, width, alignment and video ID (it's in Youtube video link).

You can use the following shortcode to add Vimeo videos to your posts: [video type="vimeo" height="315" width="420" align="aligncenter" id="98119397"]. In this shortcode, you can change parameters for height, width, alignment and video ID (it's in Vimeo video link).