“Multipurpose Website Template” v1.0

“GoodShopping | Multipurpose Theme ”

Created: 27/June/2013
By: Denis Svetlov
Email: myashki@yandex.ru

Thank you for purchasing my theme. If you have any questions that are beyond the scope of this help file, please feel free to email via my user page contact form here. Thanks so much!

GoodShopping is a universal theme for online shopping, as you see big online stores like Amazon, Ebay etc. I tried to redesign a template which would include great design and which would be very easily for the buyer to buy and the seller to sell. The great thing in this template is that it isn't having extra scripts and over animations, it's just like decent template for online shopping. This template comes in four different color schemes, suitable for your different subjects, like you've opened a departmental store, you can add things to it and sell it. Also We've made a special template for Electronic stores, for nowadays Smartphones, Gaming Stuff etc. In order to customize the colors, as we all know, the main file is main.css file or style.css, written as you like. You'll open that file in Dreamweaver, then you just need to change the colors, for example, it's written #21548, change it to whatever color you like, but make sure the color is in it's HTML color code. If you face any problems, feel free to contact me, I'm your helper 24/7.


Table of Contents

  1. HTML Structure
  2. CSS Files and Structure
  3. Template editing
  4. JavaScript
  5. PSD Files
  6. Sources and Credits

A) HTML Structure - top

This theme is a fixed-layout with four columns. Below you can see a structure of that layout:

The code divided into sections, so you can easily find the right bloc.

HTML Structure

B) CSS Files and Structure - top

In this theme I use 5 CSS files:
banners.css – Here you can change the look of animated banners.
font-awesome.css – CSS settings file for a symbol font where you can change the look of any of the 249 icons.
main.css – Main styles for all pages of layout with comments, which simplify the search of the style you want.
reset.css – Generic reset file. A lot of browsers interpret the default behavior of html elements differently. By using a general reset CSS file, we can work round this.
ui.css – Styles for buttons, menus and other elements. If you want to change the colors of buttons or menus, you will need to make a gradient. I recommend to use that Photoshop plugin: css3ps, or colorzilla.com

C) Template editing - top

Changing the color of the left side of the menu

Changing the color of the right side of the menu

To create a gradient you can download the plugin for Photoshop - css3ps
The same way you can change the colors of buttons styles which you will find in the file ui.css in the following sections: Red Buttons, Buttons-Gray, Buttons-Buy, etc.

D) JavaScript - top

This template using 5 JavaScript files:
init.js, jquery.bxSlider.min.js and jquery.js – Settings of pictures and product sliders
jquery.ui-slider.js –Extra settings for pictures slider
selectBox.min.js – Plugin for customizing the “selectbox” look

E) PSD Files - top

In archive you will find PSD files for 8 pages, made in four color variants. The total number of PSDs is 32.
contact us.psd

F) Sources and Credits - top

To create that layout I used:

Once again, thank you so much for purchasing this theme. As I said at the beginning, I'd be glad to help you if you have any questions relating to this theme. No guarantees, but I'll do my best to assist. If you have a more general question relating to the themes on ThemeForest, you might consider visiting the forums and asking your question in the "Item Discussion" section.

Denis Svetlov

Go To Table of Contents