/design-ecommerce

eCommerce Design - Open-Source Bootstrap 5 Template | AppSeed

Primary LanguageSCSSOtherNOASSERTION

Open-Source eCommerce Design Template styled with Bootstrap 5 using a simple codebase and best practices - Actively supported by AppSeed.


Need More? 🛒 BUY License: ONLY $19 (managed by GUMROAD)

  • Access to FIGMA File view demo
  • Remove Footer Credits
  • Updates: Lifetime
  • Unlimited hobby & commercial projects
  • 🚀 Support via Email & Discord

eCommerce Design - Open-source Template crafted by AppSeed.


Features

  • 🚀 Bootstrap 5
  • ⚙️ Gulp Tooling (simple usage, no fancy tools)
  • Easy Customization (files already integrated)
  • ✅ Pages
    • ✅ HOMEpage
    • ✅ Category Page
    • ✅ Product

How To use it

Compile the project

$ yarn       # install modules
$ gulp       # start for development
$ gulp scss  # recompile SCSS

The design should be visible in the browser.


How To Customize

Step 1: Open & Edit assets\scss\variables.scss. This file allows to set the primary and seconday colors of the website

/*
* Global Styling (edit below variables) 
* Warn: once edited, the SCSS needs to be recompiled
*/
$primary:   #FF7A00 !default; // primary color
$secondary: #00D2C4 !default; // secondary
$info:      #17c1e8 !default; 
$success:   #82d616 !default;
$warning:   #fbcf33 !default;
$danger:    #ea0606 !default;

Step 2: Add custom styles to assets\scss\custom.scss. This file, initially shipped empty, should contain your own code CSS code.

.your-awesome-class {
    color: red;
}

Step 3: Recompile SCSS via GULP

$ gulp scss

At this point, the new styles should be visible in the website.


Sections

Product Page

Product Page - Open-Source eCommerce Design by AppSeed.


Testimonial Component

Testimonial - Open-Source eCommerce Design by AppSeed.


PROMO Component

PROMO Component - Open-Source eCommerce Design by AppSeed.


Brand Component

Brand Component - Open-Source eCommerce Design by AppSeed.



Free eCommerce Design - Open-Source project crafted by AppSeed.