#### Thank you for purchasing the Pixelogic theme!

This file will teach you how to set up and use the Pixelogic WordPress theme. I hope that you'll find it easy to use and customize. I really wish it will fulfil your needs. Finally, its going to be far less complicated to make your Wordpress website pages look and feel the way you want them to with our SpyroPress Builder a drag-and-drop interface to build page laypouts, templates, partial templates and wordpress hirarchy without any coding.

Please read this manual, because it covers almost all the aspects needed for you to know about installing & running the theme. However, if you have any questions that are beyond the scope of this user manual, please join SpyroPress Support Forums. We provide world class support and do our best to give quick response to our customers.

Enjoy your Pixelogic theme!

##### Theme Details

- May, 18 th 2013
- SpyroPress
- info@spyropress.com
- spyropress.com/forums
- spyropress.com

User Manual

## Getting Started

### Installing Wordpress

To install this theme you must have a working version of WordPress already installed. For information in regard to installing the WordPress platform, please see the WordPress Codex - http://codex.wordpress.org/Installing_WordPress

WATCH! the instructional video (thanks to WooThemes).

### Additional Resources

- First Steps With WordPress
- FAQ New To WordPress
- WP101 Basix Training videos

### Installing Pixelogic

To install Pixelogic theme please follow these steps:

1. Download a theme package file from ThemeForest . Unzipp the package file on your computer - theme package folder will be created.
2. In WordPress admin navigate to Appearance » Themes » Install Themes » Upload and select the zipped theme file inside install subfolder of the previously unzipped theme package folder.
3. Now press [Install Now] button and wait until theme is uploaded and installed.
4. Once installation is done, activate the theme in Appearance » Themes .
5. SpyroPress dashboard will appear to guide you through the SpyroPress Builder Activation and basic theme settings.

### Update Pixelogic

Pixelogic comes with an auto theme updater notifier. As soon as we update the theme you will be notified for the latest available version.

The built-in theme updater will update the theme for you, it will download the latest changed files only and replace them in your theme folder on the server.

Note: If you didn't make any changes to the theme files, you are free to overwrite files with the new ones without the risk of loosing theme settings, pages, posts, etc, and backwards compatibility is guaranteed. In case you have made changes to the theme files, make sure you have a backup copy of your changes before you overwrite theme files.

### Installing Plugins

We have a recommend plugins list for Pixelogic . To install recommended plugins you can follow the step by step tutorial given below.

READ! Thanks to wpbeginner for the step by step guide.

### Installing Demo Content

1. Once you have purchased the theme, you can download the demo content from our support forums and unzipped in your computer.
2. In WordPress admin navigate to SpyroPress » Theme Options » Export/Import . Open and copy the content of demo-options.txt file and paste it into "Import" field and press Import options .
3. Make sure the permalinks structure is set to "Post name" (in Settings » Permalinks ) - this is required for the right content displaying in some shortcodes and is recommended option for better SEO.
4. Then navigate to Tools » Import and choose the "Wordpress" option.
   first you have to install the WordPress Importer plugin if you haven't installed it yet.
5. Now select the demo-content.xml file and press [Upload file and import] button to start the import procedure.
6. For import settings choose the author, under whom the content is imported and check to download attachments (images in this case). Press [Submit] button.
7. Now we need to set up homepage and blog page. Navigate to Settings » Reading and set "A static page (select below)" in "Front page displays" section. Select "Homepage Layout #" which you want as your website's front page and "Blog" as posts page.
8. To set the menu, navigate to Appearance » Menus and select any menu for Primary navigation in Theme Locations section on the left. Press [Save] button.

Your demo website should be set now.

## SpyroPress Builder

Never touch HTML again or use Pre-Defined Page Templates, time to regain control over your website and its content. This is what Content Management System means and SpyroPress Builder do.

### SpyroPress Builder

Brings the revolutionary Drag-and-Drop Page and Template Builder. Create elegant and complex layouts through our advanced visual interface. Be free to add anything in any place you want and be in control of everything.

Its backed by Countless Modules with Developer API to create unlimited modules according to your need.

### Integrated into Wordpress Core

Yes! Now you can use your favorite widgets, shortcodes, wordpress sidebars and wordpress menus to freely build whatever you want.

Learn More

## Pages

### Adding a New Page

Pixelogic comes with ton of option to customize a page look and feel.

1. Navigate to Pages » Add New to create a new page.
2. Set the title item title and content in the editor.
3. Also you can use the powerful SpyroPress Builder to create the pages with complex layout in no time, yes get rid of shortcodes.
4. In Page Options Metabox you can set these options:
   - Slider tab
     Choose a slideshow to display on the page. These slideshow can be created in the slider content type comes bundled with Pixelogic.
   - Layout tab
     You can hide the page title if you dont want to display it on the current page.
5. You can choose Page Templates!
6. Click [Publish] to create the page.

## Additional Content Types

Pixelogic comes with some useful custom content type (custom post types). The default predefined content types are:

- Bucket: Buckets are pieces of reusable content, which can be placed in the middle of another content area or even inside another bucket.
- Portfolio: a content type used to showcase your work.
- Slider: an advance slider management type.

### Bucket How to use?

Buckets are reuseable piece of content, which can be placed in the middle of another content area or even inside another bucket.

#### Advantages of Using Buckets

- Buckets make use of SpyroPress Builder for creating content! that mean you can design the complex bucket layout as well.
- Content is reusable in any area of the website – post, pages, sidebars, etc.

#### Shortcode

`[bucket id="" /]` shortcode can be used to display specific content into a post/page.

#### Creating a Bucket

1. Navigate to Buckets » Add New to create the Bucket.
2. Set the bucket title and build the content using either SpyroPress Builder or WordPress Editor.
3. Click [Publish] button to save the bucket.

Voilla! your first bucket is ready to use.

This is the core post type used by SpyroPress Builder to make templates as well, hence cant be disabled.

### Portfolio How to use?

Portfolio content type can be used to showcase your work. Portfolio can be organized into categories like Web Design, Web Development, etc.

Pixelogic provides six different ways to showcase your work on the website.

#### Adding new Portfolio Item

1. Navigate to Portfolios » Add New to create a new portfolio.
2. Set the title item title and content for your portfolio item.
3. Set the featured image, the image is required as it will be used as preview image on the portfolio listing pages and widgets.
4. On Portfolio Setting Metabox set the appropriate options:
   - Detail tab
     You can set an item details in this tab i.e. Project URL, Services you provide and Layout of the item.
   - Gallery tab
     Let you create the portfolio slider right on the page, with easy to use slider builder.
5. Choose a Portfolio Category to the item. Portfolio categories will be used to filter through the portfolio or display multiple portfolios.
6. Click [Publish] to create the portfolio.

### Slider How to use?

Slider content type allows you to manage slideshow for your website. It provides you great flexibility to create slideshow with ease by its highly interactive User Interface.

#### Adding new Slider

1. Navigate to Slider » Add New to create a new slider.
2. Select slider type and click [Publish] to activate the slider setting and slide fields.
3. Slider Settings Metabox contains the setting for the slider you have selected in the previous step. Here you can set the appropriate options according to your needs.
4. Slides Metabox here you add the slides using the repeater. You can add unlimited slides here.
5. Click [Publish] to publish the slideshow.

## Widgets

### Widget Areas

You can open the widget area just by clicking the arrow right from its title. Assign widgets to the area just by dragging them into open widget area below its description text. When no widget is assigned to the widget area, it will not be displayed.

Pixelogic creates 8 predefined widget areas:

- Primary Sidebar
  This area is displayed as default sidebar.
- Footer Sidebars (1-6)
  Website footer sidebars lets you create amazing website footers.

In addition to predefined widget area you can create as many custom widget areas as you need. To do this you can use our recommended Custom sidebars plug-in.
Download Custom sidebars

### Custom Widgets

The theme also comes with 6 Custom Widgets:

- Bucket
  Display specific bucket content into sidebar.
- Contact Info
  Quickly add contact info to your sidebar e.g. address, phone, email.
- PhotoStream
  Showing your photostream from Dribbble, Flickr, Pinterest, Instagram in the sidebar.
- Tab Widget
  Used to display popular posts, latest posts and latest comments in tab layout.
- Text and Photo
  Display static text and photo.
- Twitter
  Displays tweets from specific Twitter account.

## Bundled Shortcodes

- Footer Contact Info: [footer_information] - display contact information in footer.
- Socials: [socials] - display social infomartion in header.
- Image: [img] - used to align image.
- Image Frame: [img_frame] - wrap an image into frame.
- Icon: [icon] - used to display an icon from the library of bundled icons.
- Social Icon: [social_icon] - used to display a social icon from the library of bundled icons.
- Dropcap: [dropcap] - make a letter dropcap
- Blockquote: [blockquote] - used to display a qoute in block.
- Google Map: [gmap] - used to make a google map with the desire address with a marker.

## Theme Options

### How to use theme admin panel?

1. All the theme options can be set in theme admin panel. To display it navigate to Spyropress » Theme Options in WordPress admin menu.

2. After admin panel is displayed, choose the options category from left pane.

   Panel contains many different settings for the theme. Please, read the option description for more information on each option and how to set it up.

3. After you set all the required options, don't forget to save your changes by clicking the [Save changes] button.

Pixelogic featured an amazingly powerful and beautiful Site Options Panel where you can find all the theme settings. It is as easy to use as it gets and offers several different options fields and input types which help to set the right option value.

All, theme options are self-explanatory or are described well directly in admin panel. The theme options page is divided into the following categories:

- General Setting
- Header Customization
- Footer Customization
- Post Options
- Setting
- Import and Export

##### Exporting / importing the theme settings

You can export and save your theme settings and later import them back in Appearance » Options Export/Import section. Please read the available options description for more info on how to export or import theme settings.

## Tips and Tricks

### Make your site run faster Add some rules to your .htaccess file

If you have never done this, you should be careful when doing it, but this is the most important step you can do to make your site load faster. First, you need to find your .htaccess file, which should be at the root of your WordPress installation. Open it, and at the top, add these lines of code:

    #SET EXPIRY DATES FOR RESOURCES
    # 1 YEAR

    Header set Cache-Control "max-age=29030400, public"

    # 1 WEEK

    Header set Cache-Control "max-age=604800, public"

    # 3 HOUR

    Header set Cache-Control "max-age=10800"

    # NEVER CACHE - notice the extra directives

    Header set Cache-Control "max-age=0, private, no-store, no-cache, must-revalidate"

    #DEFLATE(COMPRESS) RESOURCES
    Addtype font/opentype .otf
    Addtype font/eot .eot
    Addtype font/truetype .ttf
    AddOutputFilterByType DEFLATE text/html text/plain text/xml
    AddOutputFilterByType DEFLATE text/css application/x-javascript
    AddOutputFilterByType DEFLATE text/css text/html text/plain text/xml text/javascript
    AddOutputFilterByType DEFLATE image/svg+xml image/svg font/opentype font/truetype font/eot

### Additional Plugins

Here is the list of additional useful recommended plugins:

- WPML - The WordPress Multilingual Plugin
  This is a perfect solution for making your website multilingual.
- Jetpack by WordPress.com
  The Jetpack plugin was created directly by WordPress and offers so much features. The most useful ones are social networks sharing buttons (fully styled with this theme) or easy to use form generator . (Please note that the theme doesn't support plugin's Infinite Scroll feature.)
- Post Types Order
  This plugin lets you reorganize posts, projects, pricing table columns and other contents of this theme with ease of drag and drop functionality.

## Sources and Credits

Scripts, images, icons used to build Pixelogic.

- jQuery
- Modernizr
- Twitter Bootstrap
- Google WebFonts
- Font-Awesome

- jQuery FancyBox
- jQuery Cookie
- jQuery GMap3
- jQuery Selectbox
- jQuery Superfish

- Flex Slider
- ImagesLoaded
- Isotope
- News Ticker