Random Article


 
Don't Miss
 

UberGrid – responsive grid builder for WordPress

 
 
Overview
 

Author: karevn
 
Date: May, 2013
 
Area: ,
 
Buyer Rating
 
 
 
 
 


 
$16.00


Summary

UberGrid is a powerful responsive grid / gallery builder for WordPress that will impress your visitors with stylish grids built in minutes. You can use UberGrid to present your portfolio, team, products, photos, blog posts, or anything else that can be presented with square cells. Its unique customisability will adopt to almost any needs. Features […]

0
Posted June 27, 2013 by admin

 
Features
 
 

UberGrid is a powerful responsive grid / gallery builder for WordPress that will impress your visitors with stylish grids built in minutes. You can use UberGrid to present your portfolio, team, products, photos, blog posts, or anything else that can be presented with square cells. Its unique customisability will adopt to almost any needs.

Features

  • Super-Responsive! UberGrid has two modes – “fill the width available” (default one), and “forced width”. Both modes use progressive enhancement approach that works from IE6 to all the modern browsers.
  • Killer feature – template-based automatic builder. Choose post type, apply filters, and build the grid on every page load (or one time and modify it manually). WooCommerce-compatible
  • Cell filtering to represent departments, work types, etc.
  • Highly customizable cells – 12 cell layouts with 2x width and/or height support, different title layouts, labels below cells, etc – please see the demo.
  • Powerful responsive built-in lightbox with image, google maps, youtube, vimeo and text support.
  • Third party lightboxes are supported too
  • Customizable … everything – spacing, border, block size, font name and size, images, colors. You name it – I will add missing ones. View annotated builder screenshot
  • Customizable on-hover descriptions with animation support.
  • Fast CSS3 animations and effects (when supported by the browser).
  • 600+ fonts using Google fonts
  • No coding required
  • Great support

Usability

As a big fan of Apple products, I thought about every little detail when built UberGrid, and paid special attention to front and backend usability on traditional computer screens, tablets and mobiles.

\

I’ve been needing something like this for over a decade (literally) – thanks!

chipperson, the first commenter

Workflow

UberGrid usage is simple:

  1. Click “Add new UberGrid”
  2. Build a grid manually or by using existing posts, pages, products or custom post types.
  3. Save the grid built and copy the shortcode generated to pages and posts you want.

\

Technical features

  • Generated HTML can be cached to make UberGrid rocket fast if you have a busy site or slow shard hosting.
  • CSS can be loaded as a separate stylesheet not burdening your HTML with style tags.
  • timthumb and alike are NOT used saving you from hackers. All the image processing is done by WordPress API
  • Self-diagnostics available at the settings page.
  • WordPress 3.5 required (because UberGrid uses a new image selector available from 3.5)

\

Installation and usage

Installation, first way:

  1. Download a plugin file from CodeCanyon
  2. Log into your WordPress admin area
  3. Go to “Plugins”, click “Add new” link at the top
  4. Click “upload”, choose a file downloaded in the file selector field and submit the form
  5. Click “activate”
  6. highly recommendedGo to the admin dashboard, clicl “Updates” under the dashboard link at the left menu. Update to the latest UberGrid version by choosing Ubergrid among updates available.

Installation, second way:

  1. Download a plugin file from CodeCanyon
  2. Unzip the plugin archive
  3. Open your FTP client of choise, upload the folder unzipped to your WordPress installation’s wp-content/plugins folder. Make sure you did not add an extra folder hierarchy and plugin .php files are right at wp-content/plugins/uber-grid folder
  4. Log into WordPress admin area, go to “Plugins”, find “UberGrid”, click “activate”
  5. highly recommendedGo to the admin dashboard, clicl “Updates” under the dashboard link at the left menu. Update to the latest UberGrid version by choosing Ubergrid among updates available.

Usage

  1. At the WordPress admin area, go to “UberGrid”, click “add new”
  2. Give your grid some title
  3. Add some cells by clicking “Add cell” button. Assign them images, layout options and text according to your needs.
  4. Adjust the style and layout according to your site design.
  5. Click “Create” or “Save”.
  6. Copy a shortcode generated below the title.
  7. Insert it into your pages or posts where you need UberGrid to appear
  8. Enjoy and feel free to ask for new features or support!

Advanced usage

You can show UberGrid created programmatically by copying its ID from the builder screen and adding <?php echo ubergrid($your_grid_id) ?> into your template. Do not forget to replace $your_grid_id with actual value.

A catch with some themes

Some users report that UberGrid does not show right on their sites. If that is the case for you – please make sure to update to 1.1.3 and check “Use shortcode hack” setting at the Settings ? UberGrid screen.

And a giveaway

I am always looking for new ways to use UberGrid. If you built an unique design that uses UberGrid – drop me a link to it, I’ll be happy to publish it as an example and will send you any other of my plugins as a gift.

Support

I offer a free support and bugfixes – feel free to contact me! If you experience any kind of issues – please send me a private message, and I’ll be happy to help. Including your site URL and a screenshot will help me to resolve your issue much, much faster!

Roadmap

    1. Done Lightbox support.
    2. Done Social network icons for better team representation.
    3. Done Auto-generation based on different types of posts.
    4. DoneCell tagging and filtering.
    5. Pagination
    6. Demo videos!

Release history

    • 1.3.5 – Item cloning fixed (it did not preserve cell layouts)
    • 1.3.2, 1.3.3

– compatibility improvements (css, WooCommerce).

    • 1.3.1

– Cell filtering based on tags set, much faster grid saving, CSS compatibility fixes.

  • 1.2 – Grid auto-generation from posts, better self-diagnostics, lightbox fixes.
  • 1.1.3 – better compatibility, editor JavaScript performance dramatically improved.
  • 1.1.1 – added compatibility option for themes adding “p” tags too aggressively
  • 1.1 – Popup content dropped, added lightbox support, social icons, extended self-diagnostics and lots of CSS compatibility fixes
  • 1.0.1 – Preview fixed
  • 1.0 – Initial release

0 Comments



Be the first to comment!


Leave a Response

(required)