1. Start
  2. Change Log
  3. Theme Overview
  4. Theme Videos
  5. Installing inStock
  6. Useful Video Tutorials
  7. Change Site Logos (yes 2)
  8. Understanding inStock
  9. SetUp your Payment Method
  10. Working with the Slideshow
  11. Change Theme Colors
  12. Latest Tweets
  13. Internationalization Instructions
  14. Advanced Theme Development
  15. Internet Explorer
  16. Additional Information
  17. Sources and Credits
  18. Post Installation FAQs

inStock Documentation - Retina Responsive HTML5 & CSS3 Drupal Commerce theme built with Bootstrap

Change Log

V 1.2.38 July 14th, 2015

V 1.2.37 May 16th, 2015

V 1.2.36 April 6th, 2015

V 1.2.35 March 19th, 2015

V 1.2.34 January 18th, 2015

V 1.2.34 December 17th, 2014

V 1.2.34 December 7th, 2014

V 1.2.33 November 7th, 2014

V 1.2.32 October 16th, 2014

V 1.2.31 August 8th, 2014

V 1.2.30 August 1st, 2014

V 1.2.29 July 16th, 2014

V 1.1.28 June 14th, 2014

V 1.1.24 November 24th, 2013

V 1.0.22 August 20th, 2013

Theme Overview

inStock is a Retina Responsive HTML5 & CSS3 Bootstrap based Drupal Commerce theme online ecommerce websites and stores. It includes a lot of features you can easily setup to get your site 99% ready in just a few minutes.

It includes a Premium Slider with +100 jQuery effects, a fully responsive layout (try resizing your browser) for iPhone and Smartphones in both portrait and landscape mode, iPad and tablet, desktop and wide screens, a product browser, filtering, brand support, faceted search, a blog, a wide social media integration and many more you can read on a detailed list. It also includes a wide set of blocks, views, docs, modules and features packaged with an easy 5 steps installation via the "Next, next ..." format.

This theme was built containing a lot of SEO best practices. It uses, in every View & Content Page, semantically valid HTML code and CSS so search engines can index them easily. Headlines are where they should be (h1, h2, h3, h4, etc.) depending on the View hierarchy.

Fully Responsive Layout

The most important feature of inStock is the completely responsive 4 level layout for Smartphones, tablets, iPhones, iPads and desktop computers. You can test it resizing your browser.

Theme Features

The most notable features of inStock are:

Drupal Modules Used

Additional features

What will you get if you purchase this item?

The package contains all the files needed to have a completely functional inStock's installation on your webserver in minutes and start editing all the sample content. Listing all of them, package contains:

Theme Videos

Installing inStock

inStock is created over an installation profile, so you don't need to do much to get it working. Following steps will guide you trough the installation process.

1. Extract inStock_v1.zip file on your web server. It includes all you need to get it working, so don't worry about any other files handle.

The location of your installation depends on the kind of server you're using. I mention some examples here you may be:

Once you extract it, it will be located on a folder called "inStock". You can change it and place your new theme name there.

2. Using a Web Browser, navigate to your folder/domain/subdomain where the extracted inStock's folder was created.. I'll use as example the name "inStock" due to the default folder. It would be on "http://localhost/inStock" in case you installed it locally or "http://yourdomain.com/inStock" in a remote installation.

3. Select inStock as your installation profile on the "Select an installation profile" page and then click "Save and Continue".

4. Select your language on the "Choose language" page and then click "Save and Continue" by default, the theme is English Based.

5. Setup your database info on the "Database configuration" page and then click "Save and Continue". If you haven't created it yet, do it via phpMyAdmin or any other MySQL configuration app. Once you continue, the installation process will begin. Please, be a little bit patient.

6. Configure your site basic info on the "Configure Site" page and then click "Save and Continue". Wait a little bit, until all inStock features are configured.

7. Congrats, there's your purchase. Enjoy it, and most of all, check out the red tags :D.

IMPORTANT NOTE: If you experience any issue during installation, please read the Post Installation FAQs. If you don't solve your issue there, then get into our forums.

Useful Video Tutorials

As in any of our themes, we use to create a lot of video tutorials of different topics you might be interested while working with the theme. In this case, we have created a few videos that can be played directly from our Youtube Channel:

Installing inStock Responsive Drupal Theme
Adding a New Product to your Store - inStock Responsive Drupal Theme
Creating a new Article - inStock Responsive Drupal Theme
Change Site Logo - inStock Responsive Drupal Theme
Working with the Slideshow - inStock Responsive Drupal Theme
Store Backend Tour - inStock Responsive Drupal Theme
Adding Products to your Cart - inStock Responsive Drupal Theme
Adding a New Special Announcement - inStock Responsive Drupal Theme
Adding a New Page - inStock Responsive Drupal Theme
Change Contact Form Mail - inStock Responsive Drupal Theme
Customizing Main Menu - inStock Responsive Drupal Theme
Setting Up your Social Media Profiles - inStock Responsive Drupal Theme
Change About Block Text - inStock Responsive Drupal Theme

As we build more videos, these will be added in our inStock Youtube PlayList.

Understanding inStock

inStock is a Premium Drupal Installation profile that provides a powerfull startup to create an online store based on the popular Drupal Commerce module. It provides all the product presentation layout, browsing, filtering and classification. The design is very clean and intuitive, Apple inspired and product focused.

We will try to explain it using the common flow used by any visitor that would like to purchase any of your products or might be interested on exploring all you can offer:

Visitors access your site for the first time

In most of cases, people will access your site via the Home Page. While your site gets ranked on Search Engines, more traffic will come in trough product pages, but your Home Page will always be your first impression.

I got the idea of who you are and what you sell, now: I want a Tablet

Once a visitor understands your site, he will go directly to one of your showcased products or just to a selection of them. What does this means:

inStock has only 3 level of Pages:

This allows your visitors to cycle your products and re-browse without any dead end. They can sort Tablets by make and price, explore the offers you have and the different products on your stock.

Mmmmmm.... OK, let's see this tablet.

And here comes the product page, a page designed to present a product and provide the visitor a way to explore the ones simmilar to it, the ones made by the same naufacturer, still get the offers and featured ones and share it in his favourite social media resource.

And here ends the main explanation on how does inStock works. Not to difficult uhhh?

SetUp your Payment Method

inStock DOES NOT INCLUDES ANY PAYMENT METHOD BY DEFAULT as there are more than +140 Drupal Commerce Payment modules out there including PayPal, Skrill..... We only provide the theme and the payment setup has to be made by the site admin, as we can't include all modules in the theme by default.

So, what do you need to do to setup your online payment method:

Working with the Slideshow

inStock includes the awesome Premium Slideshow MD Slider. It provides a beauty and powerful tool to present your business and impress your visitors. Detailed Sliders Instructions and setup are included in the downloadable package and can't be distributed online. Here only is show an overview:

MD Slider provide a timeline where you can add as many visual HTML elements as you want such as Text, Images and YouTube/Vimeo videos. Major features are:

Change Theme Colors

Setting up your color set is easy. Just follow these steps:

1 - Browse to http://yourdomain.com/inStock/admin/appearance/settings/inStock.

2 - Once there, change the colors you need.

3 - Go to the bottom of the Page and click Save Configuration.

5 - Go to your home page.. It's done.

Latest Tweets

Twitter and Facebook are awesome ways to get conected with your visitors, clients and friends. inStock includes 3 of the most populars ways to share and integrate your site with Facebook, Twitter and +300 social resources.

Following features are totally responsive and can be easily configure site wide if you follow these steps:

Latest Tweets on the Footer

1 - Scroll down to Twitter block and Edit it.

2 - Once there, set your Twitter Widget ID and Save. It's done.

Content Sharing

All your Blog post and Products can be shared via +300 social resources including Facebook, Twitter, Flickr, Youtube, Digg and many many more. It will appear automatically over your posts and your portfolio items.

Internationalization Instructions

Internationalizing a Drupal site is very simple. Resuming it, you only need to install a translation package and all Drupal core interface will change. Then some minor fixes for every language context, and your front-end site will be 100% translated to your desired language.

Here we explain how to:

inStock supports ANY Left to Right language you install from Drupal Translations. Of course, it depends of the level of translation of the ".po" files for the defined language, but most of them are very advanced.

Following are the steps required for translating the front-end interface language. The backend deppends on the modules your'e using, so here we only explain how to change the language of the "site side" visitors can see and, of course, the core functions of Drupal. The rest of the things are just content, so when you edit it on your desired language, it will be just addapted to it.

Translating Drupal Interface

1 - Download the Drupal core translation of your language. You can get it from : http://localize.drupal.org/ . It's just a *.po file

2 - Browse to http://yourdomain.com/admin/modules and enable Locale module

3 - Once enabled browse to http://yourdomain.com/admin/config/regional/translate/import/ and under the "Language File" tab, browse your .po file and select it.

4 - Select the language you're importing under the Import into select option.

5 - Just click Import Button. It will take some time 'cause importing +5000 words and phrases to databse will take some time.

6 - Once it's done browse to http://yourdomain.com/admin/config/regional/translate and set your language as default. Save your configuration. Done!. Your site is now in your language!

All tooltips of Social icons "Visit ### on Twitter" should be changed directly on the file: "sites/all/modules/socialmedia/socialmedia.widgets.inc" searching by the string "Visit". Unfortunatelly, the module isn't translated, so this is the way to do it.

Translating Friendly URLs

All URLs can be internacianlized via PathAuto module. You can configure it at:

Advanced Theme Development

If you're an advanced theme developer or want to know how to extend inStock, then you need to know where are the Styles :)

CSS Files

inStock's CSS files are located at /sites/all/themes/inStock/less and generated by LESS module folder. They're all "section commented" so you can find each section easily. If you need to add custom CSS styles, do it on the file css/styles.css

Internet Explorer

Internet Explorer is an special topic everyday :( . inStock supports IE8 and IE9, with an special style sheet for them. You can find them at /sites/all/themes/inStock_doublemthemes/css folder.

So please, if you find any bug or issue, contact us and we'll get it up to date as soon as posible and send it to you free of charge.

Additional Information

This site has been tested in all the following browsers, the only major difference is the rendering of rounded corners.

The browsers tested are:

If you have any problem and want to contact me do it via the Support forums.

Support can take up to 48 hours (except during holidays, it can be more during those periods), and I usually need to see the problem so don't hesitate to send me a link with a description of your problem.

Sources and Credits

I've used the following resources:

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. We'll do our best to assist.


Post Installation FAQs

Following are a set of questions and answers to common issues that Drupal begginers have. I placed them here to allow you to keep on your "site setup" process and don't need to break your head off searching in our forums or in Google. ;)

Temporary Folder

I'm receiving an error on my admin section wich says "Warning: fileowner() [function.fileowner]: stat failed for temporary://update_OebWV9 in update_manager_local_transfers_allowed() (line 912 of SOMEPATH)." or "Warning: move_uploaded_file(temporary://FILE) [function.move-uploaded-file]: failed to open stream: "DrupalTemporaryStreamWrapper::stream_open" call failed in drupal_move_uploaded_file() (line 1601 of SOMEPATH"

To solve it, follow these steps:

1. Browse to http://yourdomain.com/inStock/admin/config/media/file-system Logged in as admin.

2. Under the "Temporary directory" tag, just set:

Those are the common path to the temporary folders on the different OS. It depends, of course, of the location of the real one, but in 99% of cases, this will be the required value.

3. Click Save Configuration. Done!

New versions of Modules Available

I got a message saying "Some Drupal modules need to be updated" or "There is a security update available for your version of Drupal. To ensure the security of your server, you should update immediately! See the available updates page for more information and to install your missing updates."

Not a problem, just I recommend you to follow these steps:

1. Browse to http://yourdomain.com/inStock/admin/reports/updates/update Logged in as admin.

2. Update them all one by one. It will allow you to notice any issue, in case the compatibility results on an unstable behavior on your site.

If so, please take a look at the changelog of the module at the Drupal.org Modules site.

Installation didn't finished

My installation didn't completed. After step #6 I received an error messaje and then a white screen.

This issue ocurrs when your PHP.ini configuration cuts the installation process for security reasons. Usually, PHP has a 30 seconds timeout for any script, so while the database is beeing imported, it cuts down the process, so only a few tables are on your database. For solving it, follow these steps:

1. Extract your site once again on your web server. It will overwrite all files to start over again.

2. Using phpMyAdmin, drop all created tables. The same idea, start over again.

3. The most important step. Increase PHP.ini timeouts: For doing it, look for the php.ini file that rules your server. Once there, "search" for line where "max_execution_time" variable appears. 90 would be a better value.

4. Restart your Apache Server. It will apply the changes.

5. Start again the Installation Process. Done!