ThemeShock Premium Wordpress Themes, Freebies and Plugins




Template Options Tutorial

Video Tutorials

Tutorials

What is Wordpress?

WordPress is a free open source blogging tool and publishing platform powered by PHP and MySQL. It's often customized into a content management system (CMS).

It has many features including a plug-in architecture and template system. WordPress is currently the most popular CMS in use on the internet.

This tutorial contains information about how you can install WordPress and add a template for it.:

1. Install WordPress using the Cpanel (Fantastico Deluxe tool). very easy.

2. Install WordPress with a FTP Client and MySQL database.

3. Install a template on your WordPress CMS.

1.Install WordPress using the Cpanel (Fantastico Deluxe tool). very easy

First of all, get into your domain admin panel, I'm using Cpanel for this tutorial. You can access your Cpanel trough a browser of your preference.

Access the Cpanel typing on your browser http://www.yourdomainname.com/cpanel

Then type your account information

Once inside of Cpanel we need to find the Fantastico Deluxe Tool to install WordPress in just a few clics.

Clic on it.

Now that you are in the Fantastico interface, in the sidebar Blogs clic in Wordpress link.

Now in the right of the page will be appear an information about WordPress and WordPress support forum & New Installation  (3.2.1).

Clic on New Installation  (3.2.1)

The next step is to configure your site, according to your needs:

Select the domain where you are going to install WordPress, Select the install directory, Admin Acces data to acces to wordPress admin area after the installation, remeber these configurations; set your nickname, email address, site name and description. Then clic Install WordPress.

After you clic Install WordPress this will provide us an automatic configuration about the name of the database where wordpress will be installed

You can save ths information in the next step. Then clic Finish Installation.

Type the e-mail address that you wish that Fantastico send the details of the installation and we're done.

Clic on the URL that appears above for admin your site.

2. Intall WordPress whit a FTP Client and MySQL database.

This part requires the use of FTP Client to install WordPress on your server and access to the Cpanel of your site to create a MySQL database.

- FTP Client "Filezilla" (download); and install Filezilla on your PC.

- Wordpress download 3.2.1; once you have this, create a new folder call it however you want, then uncompress the WordPress files inside of this folder.

Set up an FTP connection using Filezilla

You need:

Host name: yourdomain.com

Username: username

Password: yourpassword

Your host provider must give you this information

Now that we have access to the server, lets search for the /www/ folder, in this example I create a new folder inside and named /WordPressTutorial/, we're gonna select all the WordPress files located on our PC and drag and drop all the files into the server folder we just create.

Lets pass to the MySQL part.

In this part we need to create a MySQL database, assign to the database a Username and password, and set with this information a configuration file for WordPress. then WordPress can access and setup the database and put their install information there. Is very important to save this information we're gonna set, for the next steps comming.

Go to the Cpanel and find Databases, then clic on MySQL Databases

Lets create a new database for WordPress. you can give it the name you want, then clic Create Database.

Lets add a new user to use later to admin the database we've just created above.

copy the information to be used afterwards

Now assign this user to the Database we just created above. clic Add.

lets give to the user all privileges to magage the database, this for WordPress functionality.

Ok we are done with this part.

Now go to your browser and type the address where you put the WordPress files.

In this part of the tutorial we are going to put the information from the MySQL database that was created above.

Clic on Create a Configuration File to continue..

Now its telling us: Hey you need some info to install WordPress, and we got it!

Let's go!

Fill the information that you have from the above configuration of MySQL Database part. then clic Submit.

We are ready tu RUN THE INSTALL

Fill the form with information you consider is the best to your need.

we are done! In the next steps you can access to your admin area and enyoy Wordpress.... Lets post!

Log In into WordPress admin panel

Our site is now looking a little boring, lets install a template and configure it.

3.Install a template on your WordPress site.

Due to some templates are complicated in their installation, an effective way to install a template is using a FTP software.

To set up an FTP connection using Filezilla you need:

Host name: yourdomain.com

Username: username

Password: yourpassword

Your host provider must give you this information

Once in the server, proceed to find the folder /www/ and open it, in this folder you can find the distribution of the files stored on your website, depending on the distribution of this files. If you have WordPress installed on the root folder, you will see three folders /wp-admin/, /wp-content/ and /wp-includes/, otherwise locate the folder where WordPress was installed.

------------------

Open the folder /wp-content/, then /themes/ and copy the template folder you want to install here.

Once uploaded the template go to the WordPress admin area to access to your website trough http://www.yourwebsitename.com/wp-admin, once in the administration panel, clic Appearance->themes and select the theme that you are going to use.

After the installation of our template, several iterations appear in the sidebar as Galleries, portfolios, products, services, testimonials and the theme administrator.

How to create a page

It is recommended that you create a blog page if you want to use a different home page and one for the blog. To do this go to Settings-> Reading and " A static page (select below) " "Front Page" select Home and "Post page" select blog.

Name it as Blog and then Publish

How to Use the template Options

The template has several customizable items, which allow you to easily manage the components that it has. In this section you'll learn how to use some basic functions of Wordpress combined with the template functionality.

Menus

Wordpress initialy created by default a menu using as items the number of pages that your site has. however, you can create menus with items you want to place and use it as the main menu of your site. this can be done in the menu Appearance->Menus->

Now use your new menu, this can be done in the Theme location, after creating the menu you can select the menu you need.

Now lets fill our new menu with some links, you can add external links to your menu, and more!

And you have now your customized menu.

Widgets

The template has by default 9 areas of sidebars to place the widgets you want, this in order to build pages in different ways and multiple options using the template generator, which will be explained later. The only area that is always visible in all the site is the sidebar footer, the remaining 8 can be added or removed using the layout generator. Within the social widgets that the template includes are Facebook and Twitter.

The process to use your company logo is the same that was used to upload the template, using the FTP Client Filezilla, but this time you have to go a little further into the template. When installing the template we reach to the folder /themes/ in the /wp-content/ (Intall WordPress whit a FTP Client and MySQL database), inside the folder /themes/ locate the folder with the name of the template, then go to the folder /img/ and copy the logo here. Remember that the name of the image should be "logo.png" and recommend a size of no more than 300px wide by 90px high.

Sliders

The template handles 4 types of slider, 3 of them use images and 1 for highlighted posts:

The first slider uses effects of transitions for the presentation of the images.

The second slider is an accordion that shows all images in a reduced presentation

The third is a slider made ​​in flash

The fourth slider can be used for blog entries you want to highlight, to display the posts remember to check the box featured on "more post options"

Keep in mind that the selected slider, is the one that shows it in all the site.

The images used in the sliders, must be uploaded in the same way as the logo and should place it in the slider folder that is inside of the image folder.

Layouts

One of the most prominent options of the template is the creation of custom layouts to boost your blog. You can choose between 9 elements that are 8 areas for widgets which are already named and 1 slider area.

You can select a page from the dropdown menu and then clic Open layout Creator which displays a window. here you can drag and drop the elements that you want to use. Notes that the only page that you can't personalize individually is the page that you choose as a blog, this specifically depends of the blog and single settings in the layout creator.

Unlike other pages, selecting blog and single shows a slider selector and check it if you want to turn it on the homepage of the blog, in the entries, in the search results, in the archives and categories.

When you make clic on Open Layout Creator a window appears showing you the items that you can use on the page that you've selected to personalize, this distribution allows you to put the widgets that you want to show on those areas, very easy when you finish don't forget to save changes.

 

Create a home page with the Layouts Creator

 

Custom Home Page

If you want to change the home page that comes by default with the template, you can do it creating a new page. Place the title you want ( home, Start, etc.). Then go to the admin area of the template, in the layout section, select the page that you're gonna use like init, of the dropdown menu. Open the layout generator then drag and drop the elements to use.

Then go to settings-> Reading-> "A static Page"->Front Page, replace the home with the page you just create.

Taxonomies

Taxonomies are special entries which allow you to create content that otherwise would be complicated to do with a normal entry. Each item that is created in the taxonomies can be used to represent outstanding images. Some of the taxonomies which the template includes are:

 

Galleries:

You can create galleries as well how you create a category doing clic on Gallery Items->Add New. To assign items to each gallery clic Add New. A gallery item is like a post, the difference is that among its options are the type of frame to use to display the images, outstanding image, and accompanying text the picture.

Clic on Gallery Items->Add New

1. Put a title for the gallery post

2. Add some content to your post, remember that you can only put one image on the post because the other aren't displayed on the gallery, that means that you have to create a new gallery post per image, but you can put all this post in the same category.

3.Add an excerpt description, this may be helpful, it can work like a tag or a small description of the post in rss.

4. It's important to check the box Featured Gallery, if you don't check this box, this Gallery post can't be used later as a Featured Carousel.

5.Set a featured image, so this can be used in a Featuerd Carousel and allows you to identify the post in the carousel,

6. Add a new gallery category and put the post where you want to classify the post, an example is to put the post in the category of Illustrations. You can create all the gallery clasifications you want.

7.Check the category where the post is gonna be displayed

8.Publish the post.

 

Portfolios

Works like the galleries, and one of the differences is that instead of a text accompanying the image, you can write the link to the location of that item.

Products

The products are grouped in catalogs, that is why you should create the catalogue first and then the product. The options of the products are, payment link, price, currency, frame style and outstanding product.

1.Clic on Catalogs to display the form to add a new catalog

2. Type a name for the catalog

3.Put a slug, or leave it empty and WordPress automatically generates a slug for your catalog, usually the same name in lowercase.

4.Type a description for the catalogue you're creating.

5. Clic on Add Catalog.

1. Add a new product.

2. Add title.

3. Add a content for your product.

4. Add an excerpt text.

5. Set the link to make the payment of your product.

6. Add a featured image.

7. Add a new catalogue to classify your product.

8. Publish.

Services

The services are grouped in brochures and work like the above. The options of the services are, frame styles and Featured Service.

1.Clic on Services ad then in brochures to create a new one.

2.Add a title

3. Add a slug

4.Describe the brochure

5.Add the new brochure.

1.Select Services and then clic on Add New Service

2.Set the title of your service

3.Post the content you wish to describe your service

4.Type excero text

5.If you want to use this service later with the Shortcode, Add Feature Carousel, check the box Featured Service. set the box style

6.Add a featured image for your service post

7.Set to which brochure your service belongs

8. and publish

Testimonials

As the name says, this will be to recieve the testimonys or comments about the site, their performance and attention to people who vist it. You can have a page with all the testimonys you want, or simply create a slider with outstanding testimonials.

1. Clic on Add New

2. Give it a title

3. Paste the text of the testimonial of your client

4.Mark as a Featured testimonial if you want to Add Featured Testimonial shortcode for the testimonials later.

5. Publish

Example of the Featured Testimonial

 

Shortcodes

Shortcodes are default styles which can be used to create a visual style to the content of the post. This can be found in the edition bar of the post, a lot of the shortcodes can detect the text or the image selected for more facility at the time to apply a special style. Its recommended that the shortcodes are always separeted by spaces.

 

Lightbox

Create a presentation from a group of images in your post. Insert the images, select an image and clic Add to Lightbox and a window will open with a view of the image, then clic Insert. Repeat this process for the rest of images. To add an external image clic Add to Lightbox a window will open, insert the url of the image and then clic Insert and then publish.

Quotes

Asign stylized quotes to your texts. Select the text and clic Add Quote pick a color and insert it on the post.

Buttons

Create nice buttons. Clic on Add Button to selet the style, size, color, content and the link button and then clic Insert.

Boxes

Frame text using boxes. Clic on Add Box, select the style, color and add the desire text in the box to be insert in the post. If you select Image Box, you should select the type and size of the image preset that is going to accompany the text.

It should look like this.

Frames for Images

Frame your images inside the post. Select the image, then clic on Add Frame for Image, select the style and Insert.

The result.

Content in tabs

Sometimes, its necesary to insert a lot of content inside of the post but is to dificult browse inside of it. With the tabs, you can place all the content you need in a maximun of 6 bullets with a great variety of styles.

Copy and paste text inside of the tabs...

after you complete the publication this will be the result:

Tooltip

Place brief information on an item, which will appear everytime you hover your mouse over it. Select the item, clic on Add Tooltip, select the style, type what you desire to display and insert into the post.

After you create the publication of this testimonial, this will be the result:

Higlight

Highlight important text with this tool. Select the text and then clic on Add Highlight, select the color for text and background and insert it.

After the previous step this will be the result:

Lines

The lines serves to separate certain paragraphs, select Add Line, select style and coor of the line, then insert.

Expandable Content

Save space in your post placing text on expandable contents, select the text, then clic on Add Toggled Content, select the size and style and clic Insert.

Information of the Author

Place information about a particular author. Select the button Add Author Info, pick a color, type the name of the author, select the avatar, type a little description and then insert.

Featured Carousel and Testimonial (sliders)

Are sliders that can be created from entries, portfolios, galleries, products, services and testimonials, as long as these have been marked as  Featured Post in their respective fields (see taxonomy). The Carousel options are the type (posts, galleries, etc), slider style and amount of items to display. 

Let's see how this can be done in a few steps

Post something, but take a look of the next picture to got it right.

Featured image part

You can do this in all the post, portfolios, galleries and services that you want to apply this shortcode method. Now create a new post and clic on Add Featured Carousel shortcode.

Select features to display, box style and image count. Insert and Publish.

Add Testtimonial

For testimonial you have to add some new testimonials, and then this can works properly otherwise it can looks like a broken thing, create a few testimonials for this step.

Then create a new post and use the testimonial shortcode. select the box style, number of testimonials to display, type of quote and color. Insert and publish.

Template Options

Go to Test Theme menu

Footer Options

Type general information about your company.

If you're using Google Analytics you can copy and paste their code in this area.

 

General Options

Favicon: is an image that represents your site and can place the url where the file is.

Feedburner: is a subscription form to your website through which visitors, through alerts can learn the latest posts created without having to go to your blog.

Configurating the Contact Form

Enter the email address to which you want messages to be sent.

Pack of pictures highlights:

They are images that represent each of the Gallery pages, portfolio, products and services.

Socials

Amoung the social icons that you can used are Facebook, Twitter, rss, and rssmail, just enter the url of each one

This icons just appear in the header of the site if you asign them a url.

(The design of this icons depends on the design of the template)

Featured Presentation

This is a small tutorial about how you can operate the shortcodes of the sliders, galleries, portfolios, services, post and testimonials.

Testimonial quotes

Stylize the quotes in the testimonial page.

Fonts from the Headers and titles

Select the font type you want to use for the headers or titles of your entries or pages.

Plugins

Within the plug-ins that we can recommend you, the following can help you to improve the experience of the visitors of your site

There are 2 ways of install a plug-in in Wordpress. The first is using the options on the administrator of wordpress, you can type the name of the plugin and Wordpress find it. When shows the results, you can select and install the plugin.

Galleries

These plug-ins allows you to create presentations of your most outstanding images.

NEXTGEN gallery

Create galleries and add pictures quickly. In this video tutorial you will see how very easy is to use it.

WP Photo Album plus

Create photo albums to display it on your site. Import and export your albums, and generate an album with photos of the day.

Nivo Slider

One of the best sliders that exist on the web. Great functionality an just for USD $20 is a very good option.

SEO

This tools allows you to positioning your website with ease and get more visits.

WordPress's All-in-One SEO Pack
HeadSpace2 SEO

WordPress SEO by Yoast

This plug-in will help you position your website effectively. With a clean interface and with multiples options, this is a very good option to use of SEO.

Google XML Sitemaps.

what a better positioning that use a SEO from the search engine most used in the world. This tool of google will generate a map of your site to be easy identify your site in their searches.

Contact Forms

If you want to use contact forms with more options and customizable capcha you can choose one of the followings:

Contact Form 7

A good contact form with excelent documentations and very intuitive. Generate shortcodes that can be used in a widget.

ContactMe

A plugin that allow you to create contact forms from a lot of styles, besides requires of the creation of an account in contactme.com, it is free and goes beyond with the managment of contacts and calendars.

Fast Secure Contact Form

Another contact form easy to use and good documentation.

Mobile

With mobile devices and its capability to access to the internet, the web pages must adapt to their little screens, these plugins will help you to your site looks good in those devices.

Wptouch

Has formats for mobile devices that fit the site perfectly. Exist a pro version for tablets.

Mobify

Is a service whereby you can create a mobile version of your site in a simply form. It is very useful and only requires you to suscribe to the page.

Wordpress mobile pack

Is a tool that allows you to manage your site for mobile devices. Allows managment.