# Commerce (Waggin) is
The theme avoids repeated Blade edits by exposing a section-based editor where non-developers can manage banners, grids, carousels, and static content in a visual preview.
# Installing the Waggin theme
Follow these steps in your Bagisto project:
- Unzip the extension and merge packages/Webkul into your project so the package is at packages/Webkul/Waggin.
- Add the PSR-4 namespace to composer.json under autoload.psr-4: "Webkul\\Waggin\\": "packages/Webkul/Waggin/src".
- Run composer dump-autoload.
- Run the installer: php artisan waggin-theme:install.
These steps place the theme files into your Bagisto installation and register the package so Laravel can autoload it.
# Activating Waggin on a channel
Installed is not the same as active. Bagisto 2.4 keeps a theme gallery at Appearance → Themes, and a theme only goes live when a channel points to it. Activation is per channel, so one channel can run Waggin while another uses a different theme.
- Waggin checks whether any channel uses the code waggin before it boots its extras. Shop routes and settings blocks register only when the theme is active somewhere, so an installed-but-unused Waggin has no runtime cost.
- Each channel maintains its own section data, so channels have independent homepages and content.
A live Waggin demo shows a typical end-state you can inspect before switching channels.
# Admin: the section editor and content workflow
Open Appearance → Themes → Customize on the Waggin card to edit the theme. The editor shows:
- An ordered list of sections (left).
- A live storefront preview (right) with Desktop / Tablet / Mobile widths across the top.
- Channel and locale selectors, because sections are stored per theme and channel, and content can be locale-specific.
- Click a section to open its fields. Types include image carousels, product carousels, category carousels, static content, services content, and footer links. Waggin adds Product Grid and Category Grid types by extending the section schema.
- Carousels provide slides with image, title, link, and button. Grids give a title, description, and a product or category filter. Grids and carousels are filter-driven rather than hand-picked: for example, a "New Products" grid displays items flagged as new at the product level.
- Saving writes a draft. The preview pane renders drafts so you can review changes.
- Publish promotes every draft for that theme and channel at once. Discard removes drafts.
- You can toggle a section on or off, reorder by drag, duplicate as a starting point, or delete.
# Categories and navigation images
Treat the category tree as the navigation backbone. A three-level tree often suits pet catalogs: top level (Dogs, Cats, Birds, Small Pets), second level for product kind (Food, Toys, Accessories), third level for specific shelves (Dry Dog Food, Rope & Tug Toys, Collars & Leashes). Assign products to leaf categories and to parent levels because Bagisto does not auto-aggregate children into parent listings.
Each category requires multiple images for the storefront navigation. Plan category images and the tree structure before styling the home page or menu to avoid rework.
# Where this guide helps
This guide removes the common blocker of editing Blade files for layout changes and hands content control to the admin UI. Use the editor for iterative content updates, keep category structure correct, and activate Waggin per channel when ready.