Smart Product Grid

설명

Custom animated product grid plugin for WooCommerce. Includes grid,
masonry and carousel layouts, AJAX filters/pagination, quick-view modal,
animated add-to-cart (mini-cart auto-refresh), wishlist, and compare.

When Elementor is active, a “WC Custom Grid” widget appears in the widget
panel under the “WC Custom Grid” category — search for “wc custom grid”
or “products” to drag and drop it. The shortcode also works (see below);
both options are available.

Features

  • Grid / Masonry / Carousel layouts, switchable with a single shortcode attribute
  • Category, product-tag, price-range and sort filters — all AJAX (no page reload)
  • “Load more” AJAX pagination
  • Quick View modal: image, description, price, variations, and Add to Cart
  • Animated Add to Cart: hover lift, pulse-glow on success, mini-cart
    fragment refresh (compatible with WooCommerce’s added_to_cart event)
  • Wishlist: works for both guest and logged-in users via WooCommerce customer
    session; for logged-in users the list is also persisted to user meta so
    it survives session changes
  • Compare: up to 4 products, stored in WooCommerce customer session,
    sticky bottom bar + side-by-side table modal
  • Sale badge, out-of-stock badge, and star rating — all pulled from WooCommerce data

This plugin requires WooCommerce to be installed and active.

Shortcode Options

[wccg_grid
    layout="grid"              -> grid | masonry | carousel
    columns="3"                -> number of columns on desktop (auto-responsive on mobile)
    per_page="9"               -> products shown on first load
    category="shoes,bags"      -> comma-separated category slugs (leave empty for all)
    orderby="popularity"       -> popularity | date | price | price-desc | rating
    show_filters="yes"         -> show category + price + sort filter bar
    show_price_filter="yes"    -> show price range slider
    show_tag_filter="yes"      -> show product tag filter
    title="Bestsellers"
    subtitle="Our top products"
]

스크린샷

설치

  1. Upload the smart-product-grid folder via WordPress admin > Plugins > Add New > Upload Plugin.
  2. Activate the plugin. WooCommerce must be active — an admin notice will appear if it is not.
  3. Add the shortcode to any page or post:

    [wccg_grid title=”Bestsellers” subtitle=”Our top products”]

FAQ

Does the plugin load GSAP from a CDN?

No. All JavaScript, including the animation layer, is bundled locally in
assets/js/. The animations gracefully degrade — if the script fails to
load, everything else continues to work.

The wishlist table was not created.

The wishlist table ({prefix}_wccg_wishlist) is created on plugin activation
via dbDelta(). If you updated the plugin while it was already active,
deactivate and re-activate once to run the activation hook.

How do I change the accent color?

Open assets/css/style.css and change the --wccg-accent CSS custom
property near the top of the file. If you are using the Elementor widget,
the “Accent color” control in the Card style section handles this without
editing any file.

후기

이 플러그인에 대한 평가가 없습니다.

기여자 & 개발자

“Smart Product Grid”(은)는 오픈 소스 소프트웨어입니다. 다음의 사람들이 이 플러그인에 기여하였습니다.

기여자

자국어로 “Smart Product Grid”(을)를 번역하세요.

개발에 관심이 있으십니까?

코드 탐색하기는, SVN 저장소를 확인하시거나, 개발 기록을 RSS로 구독하세요.

변경이력

1.0.0

  • Initial release.