Tips and Tricks WP eCommerce

eCommerce Solution for WordPress Blog

  • Home
  • eCommerce Plugins
  • WP eStore Documentation
  • WP Shopping Cart Doc

NextGen Gallery – Stacking More Product Boxes Side by Side

In the sell-photos-from-wordpress-site tutorial you learned how to sell your photos using NextGen Gallery and Simple PayPal Shopping Cart. In this tutorial I will show you how you can stack more product boxes side by side.

The following screenshot displays the products with the Add to Cart button in a NextGen gallery. In this example it created a two columns layout. But you may want to have three or more columns (depending on your design needs).

gallery-product-boxes-default

Setup Steps

Step 1: Create Your Custom Code

The plugin has the following class “ngg-gallery-thumbnail-box” that allows you to customize the displayed thumbnail box. In the following example 30% was added to the width tag so 3 product boxes can stack side by side.

Note: You may have to adjust this value to fit your width.

Custom Style Code:

.ngg-gallery-thumbnail-box {
float: left;
margin-right: 5px;
width: 30%;
}

Step 2: Add Your Custom Code

NextGen plugin has an area that allows you to add custom CSS code.

Go to Gallery -> Other Options -> Styles click on (Show Customize Options) link.

Make sure you save your changes.

adding-custom-css-code

The following screenshot displays three images aligned next to each other in the gallery.

gallery-product-boxes-with-more-columns

In the above example only three columns were created. You can have more columns if you want, just change the width percentage to a smaller number.

 

WP eStore NextGen Gallery AddOn

This addon is no longer maintained. It is better to use a photo selling solution like our photo seller plugin for this kind of usage.

NextGen Gallery AddOn Details

The NextGen Gallery Addon allows you to sell your NextGen gallery images via the WP eStore plugin.

Using the eStore NextGen Gallery Addon

There are two ways you can use this addon and integration NextGen gallery with eStore. Please see the following documentation and choose the one that fits your need:

  • NextGen Gallery Integration (Method 1)
  • NextGen Gallery Integration (Method 2)

AddOn Price

The eStore NextGen Gallery Addon is FREE for all customers who purchased WP eStore plugin from us.

Download the NextGen Gallery Addon (v1.5)

You can download this addon from the addon download area of our customer only support forum

  • Addon download area

Installing the Addon

You can install this addon the same way you install any WordPress plugin:

  • Go to the “Add New” plugins screen in your WordPress admin area
  • Click the “upload” tab
  • Browse for the plugin file (eStore-nextgen-gallery-addon.zip)
  • Click “Install Now” and then activate the plugin

General Note

Please note that some of these free eStore addons are developed by our users in the community. So they do not have any advanced customization option. The description above explains exactly what this addon does.

Your Shopping Cart

Shopping Cart Empty
Shopping Cart is Empty
Visit The Shop

Search

Featured Documents

Stylish Product Display Options for WP eStore WP eStore Quick Setup and Usage Video Tutorial WP eStore Shortcodes and Functions Reference WordPress eStore Plugin Features WordPress eStore Plugin Demo What Our Customers Have to Say About Our Products WordPress eStore WishList (Feature Suggestions) WordPress eStore Frequently Asked Questions (FAQ) How to Show Add to Cart buttons

Featured Plugins

wordpress_estore_icon
wordpress membership plugin icon
WP Express Checkout Plugin
Lightbox Ultimate Plugin
wordpress_affiliate_plugin_icon

Copyright © 2023 | eCommerce Plugins