PrestaShop Starter Theme

Starter theme for PrestaShop 9, based on Hummingbird v2.0.0. Cleaned up and stripped down to serve as a lightweight foundation for custom projects.

Stack

• PrestaShop >= 9.1.0
• Bootstrap 5.3.3 (trimmed down)
• Webpack 5, esbuild-loader, TypeScript
• PurgeCSS in production
• Node >= 20
• Default font: Roboto (locally hosted via @fontsource)
• No jQuery

What changed from Hummingbird

Removed

• jQuery and all its plugins — full vanilla/TypeScript
• Material Design Icons — font, mixins, codepoints, and all template references
• Original fonts (Inter, Vazirmatn) — replaced by Roboto (@fontsource, self-hosted)
• Storybook — not needed for this workflow
• RTL support — sources, cssjanus loader, and RTL assets
• nouislider / wnumb — removed along with facetedsearch JS

Disabled Bootstrap components

The following Bootstrap imports are commented out (not deleted) in the SCSS source — uncomment to re-enable:

accordion, badge, breadcrumb, buttons, button-group, card, carousel, close, list-group, pagination, placeholders, progress, spinners, tables, toasts, navbar, nav, popover, tooltip, images, variables-dark

Bootstrap utilities are restricted to display + flex only.

Bootstrap carets are disabled ($enable-caret: false) — use SVG icons instead.

Removed JS modules

facetedsearch, productcomments, ps_mainmenu, mobile-menu

Removed module templates

ps_facetedsearch, ps_advertising, ps_rssfeed, ps_customtext, ps_imageslider, ps_banner, ps_sharebuttons, ps_bestsellers, ps_newproducts, ps_specials, ps_crossselling, ps_categoryproducts, ps_viewedproduct

Kept module templates

ps_socialfollow, blockwishlist, ps_featuredproducts, blockreassurance, contactform, ps_cashondelivery, ps_categorytree, ps_checkpayment, ps_contactinfo, ps_currencyselector, ps_customeraccountlinks, ps_customersignin, ps_emailalerts, ps_emailsubscription, ps_languageselector, ps_linklist, ps_productinfo, ps_searchbar, ps_shoppingcart, ps_wirepayment, ps_brandlist, ps_supplierlist, psgdpr

Production build size

Asset	Size
theme.css	~102 KB
theme.js	~144 KB
error.css	< 1 KB

PurgeCSS safelist

Configured in webpack/webpack.production.js. Current patterns:

modal, offcanvas, bs-, show, hide, fade, collapse, collapsing, dropdown, active, disabled, closing, open, alert, img-fluid, visually-hidden, was-validated, is-valid, is-invalid, valid-, invalid-, form-

When re-enabling a Bootstrap component, add its class patterns to the safelist.

Getting started

npm install
npm run watch       # Development with watch mode
npm run build       # Production build (PurgeCSS active)

New project checklist

1. Rename the theme — update config/theme.yml (name, display_name, author) and package.json (name, description)
2. Change the font — install via npm install @fontsource/your-font, update src/scss/prestashop/base/_fonts.scss, src/scss/bootstrap/overrides/variables/_variables.scss, and webpack/webpack.parts.js
3. Set up SVG icons — add SVG sources to src/icons/, the webpack build generates assets/img-dist/spritemap.svg
4. Adapt theme.yml hooks — configure according to the modules installed on the target project

Commands

npm run build          # Production build (PurgeCSS active)
npm run build:analyze  # Production build + bundle analyzer
npm run watch          # Watch mode
npm run dev            # Dev server with HMR + proxy
npm run lint           # ESLint JS/TS
npm run lint:fix
npm run stylelint      # Stylelint SCSS
npm run stylelint:fix
npm run prettier       # Check SCSS formatting
npm run prettier:fix
npm run test           # Jest

License

AFL-3.0