Galaxy Responsive HTML5&CSS3 Website Template

• By: Mad_Dog
• themeforest.net/user/mad_dog
• Support Forum: http://forums.themedev.me

Thanks for purchasing this theme. If you have any questions that are beyond the scope of this help file, please feel free to submit your request to my support forum. Also you can find a lot of useful information right there. Thanks so much!

How to change intro slider?

In order to edit intro slider images and text you should first of all open index.html

The actual slider is starting from the line 146.

To change image slides for the first slide edit lines: 148, 158, 168. In the same way edit image slider for other slides.

In case you want for example edit effects for the first slide, then you should edit this values starting from the line 148.

data-x="372"
data-y="232"
data-endeasing="easeInOutBack"
data-endspeed="1000"
data-end="6500"
data-easing="easeInOutBack"
data-start="800"
data-speed="1000">

For more information in regards to the Revolution Slider, please read the documentation which is included in the template package.

How to change the logo?

You can do that very easily, simply replace the current logo image with your own one, the curren logo is located in img/logo.png folder. The required size is 101 × 112 (px)

How to change menu?

The menu code is located starting from the line 52, index.html file.
You can easily change the menu names, add or delete them from the code.

How to switch headers?

This premium theme is provided with a set of different headers that you can change in index.html file.
line 42.

In order to do this you need simply add class="type1"

So it will look like this <header class="head_type0"> or <header> is a default header.

<header class="head_type1">

<header class="head_type2">

<header class="head_type3">

<header class="head_type4">

How to switch Tag lines ?

In additiona to the different headers this theme is provided with the different Tag Lines above header that you can change in index.html file.
line 43.

In order to do this you need simply add class="tag_type1"

So it will look like this <section class="head_type0"> or <section class=""> is a default header. Default tag_type0 goes without tag lines.

<section class="head_type1">

<section class="head_type2">

<section class="head_type3">

<section class="head_type4">

How to add/manage portfolio?

There are 4 portfolio pages come with this template:

• 1,2,3,4 Column Portfolio

Let's take a look at 1 Column Portfolio, please open portfolio1.html file and go to line 164:

• data-category="portraits"is the name of the category it belongs to.
• src="img/portfolio/portfolio1.jpg"is the path to the image.
• portfolio_post.html is the path to the big preview.
• class="portfolio_dscr"-contain styles for the portfolio description.
• The tile and description goes below.

How to use shortcodes ?

In case you need to use one of the existing shortcodes on your page you should simply open shortcodes.html page and copy the existing shortcode

For example in shortcodes.html you want to copy diagram. In this case copy the code starting from line 1559-1598 and then past it in your page where you need and then edit it

<div class="row-fluid">
<div class="span12 module_cont module_normal_padding module_diagramm">
<div class="bg_title"><h4 class="headInModule">Diagram</h4></div>
<div class="shortcode_diagramm_shortcode diagramm">
<ul class="skills_list">
<li class="skill_li">
<div class="diagram_bar">
<h6>Lorem Ipsum - 60%</h6>
<div class="skill_div-wrapper"><div class="skill_div" data-percent="60"></div></div>
</div>
</li>
<li class="skill_li">
<div class="diagram_bar">
<h6>Dolor vestibulum mas eget - 75%</h6>
<div class="skill_div-wrapper"><div class="skill_div" data-percent="75"></div></div>
</div>
</li>
<li class="skill_li">
<div class="diagram_bar">
<h6>Egestas - 30%</h6>
<div class="skill_div-wrapper"><div class="skill_div" data-percent="30"></div></div>
</div>
</li>
<li class="skill_li">
<div class="diagram_bar">
<h6>ridiculus Pellentesque - 49%</h6>
<div class="skill_div-wrapper"><div class="skill_div" data-percent="49"></div></div>
</div>
</li>
<li class="skill_li">
<div class="diagram_bar">
<h6>Phasellus Massa - 100%</h6>
<div class="skill_div-wrapper"><div class="skill_div" data-percent="100"></div></div>
</div>
</li>
</ul>
</div>
<a id="anchor17"></a>
</div><!-- .module_cont -->
</div><!-- .row-fluid -->

Result

How to change the color of the theme?

You can do that easily, in two ways:

• Auto replacing. In order to change main color theme you should open css/color_theme.css and replace the default color #37878d with your own one.
• Manually. Simply open the same file and edit each instance of the main color #37878d
• Use preset css color_theme.css files from the colors folder.

How to change theme layout?

You can do that easily, by adding the following div tag right after the </footer>:

for the boxed layout

<div class="layout_trigger boxed_bg_cont" style="background-color:#c4c8cb; background-image:url(img/boxed_bg.jpg); background-repeat:repeat;"></div>

Background image layout

 <div class="layout_trigger image_bg_cont" style="background-color:#a9a9a9; background-image:url(img/bg_user.jpg); background-repeat:no-repeat;"> </div> 

Background color layout

  <div class="layout_trigger boxed_bg_cont" style="background-color:#1A0C14; background-repeat:repeat;"> </div> 

In general you just need to open the page that uses one of the layouts and copy the code that goes after the footer tag.

Contact Form Setup

You can setup your contact form in 2 clicks, please open mail.php file and find "te

st@test.com" on line 8, simply replace to your the email address all the requests will be sent to. That's all ;)

How to setup twitter?

To show posts from your flickr account all you need is to insert your account details in index.html file line 897, simply replace default username with yours ;)

$(document).ready(function(){
$('.tweet_1057').tweet({
modpath: 'twitter/',
count: 3,
username : 'themedev'
});
});

After this go to folder twitter and open index.php file and insert your consumer keys and user token keys.

/ Your Twitter App Consumer Key
private $consumer_key = 'YOUR_CONSUMER_KEY';

// Your Twitter App Consumer Secret
private $consumer_secret = 'YOUR_CONSUMER_SECRET';

// Your Twitter App Access Token
private $user_token = 'YOUR_ACCESS_TOKEN';

// Your Twitter App Access Token Secret
private $user_secret = 'YOUR_ACCESS_TOKEN_SECRET';

How to setup flickr?

To show posts from your flickr account you need is to insert your account details in index.html file line 897, simply replace default username with yours ;)

<script src="http://www.flickr.com/badge_code_v2.gne?count=6&display=latest&size=s&layout=x&source=user&user=92335820@N08"></script>

Source files included

Galaxy comes with 14 PSD and 26 HTML files. Some PSD files can include different pages inside, and can have hidden layers. Please note that the images are not included in the package.

All .js files are located in the /js/ folder.

Credits

I would like to say a big thnx to all the people who created an awesome stuff:

jQuery Carousel 0.9.8 by Thomas Lanciaux and Pierre Bertet
jQuery Easing v1.3 by George McGinley Smith. - http://gsgd.co.uk/sandbox/jquery/easing/
jQuery Form Plugin v2.05 - http://malsup.com/jquery/form/
Isotope v1.5.21 by David DeSandro / Metafizzy - http://metafizzy.co/#licenses
jQuery Nivo Slider v3.1 by Dev7studios - http://nivo.dev7studios.com
OneByOne Slider - http://codecanyon.net/user/sike
jQuery PrettyPhoto plugin by Stephane Caron - http://www.no-margin-for-errors.com
Tipsy tooltips for jQuery by Jason Frame - jason@onehackoranother.com
jquery.tweet.js by Todd Matthews & Steve Purcell - http://tweet.seaofclouds.com/
Superfish v1.4.8 - jQuery menu widget by Joel Birch - http://users.tpg.com.au/j_birch/plugins/superfish/