Themes developer guide for Prestashop 1.7

Follow Prestashop 1.7 installation steps for local or server setups: choose language, accept terms, run environment checks, configure store information, and test the connection to create the shop.

Explore the new Prestashop 1.7 theme by downloading, configuring, and activating the Stalder theme from Brister team to build your custom theme.

Learn how to create a custom starter theme for Prestashop 1.7 from scratch, configuring and turning it on or off via the back office for a responsive, modern theme.

Create a central Prestashop 1.7 theme by making a folder named for the theme, adding a config folder with a theme config file that defines name, display name, and author.

Clone the starter theme from the official Prestashop 1.7 repository, move it to the themes folder, configure metadata with the theme config file, and manage dev assets and compilation.

Install node modules by running npm install to pull in dev dependencies and the sass compiler for building your Prestashop 1.7 theme.

Use the built-in file watcher in PhpStorm or WebStorm to auto build Prestashop 1.7 theme assets with npm run watch, and see CSS changes update quickly.

Configure Prestashop 1.7 theme by editing Theme.yml to set folder name, display name, version, developer details, and compatibility; define layouts and image sizes, then enable the theme in back office.

Activate and configure the new Prestashop 1.7 theme in your store, verify it on the front end, and begin customizing headers, sliders, and product listings.

Learn two methods to override Prestashop 1.7 theme styles: register overrides in the theme and a devs-folder per-module approach with centralized assets.

Edit the header by placing the contact information module in the correct position with drag and drop, and override styling with a new scss file for the module.

Learn to customize the Prestashop 1.7 header by styling links, backgrounds, and colors, and add a language selector before the cart with a dedicated module and CSS tweaks.

Override the currency model template in Prestashop 1.7 and customize the header with scss, fonts, and margins. Reuse the language selector block to align elements and remove borders.

Edit the header cart block in a Prestashop 1.7 theme by locating the cart module, overriding the template, and tailoring the dropdown and subtotal styling for the top-right cart.

Learn to build and customize a Prestashop 1.7 product page by structuring image, information, and actions, adjusting templates, and implementing responsive image sizing.

Create and refine a product page layout by styling the price, product title, and color variant labels, implementing accessible, clickable color options and a cohesive header integration.

Customize the Prestashop 1.7 product page by turning the quantity area and variants into a table, using Bootstrap form controls, and refining product references and images.