Skip to content

chyvak1831/starter

Repository files navigation

STARTER

Starter WooCommerce theme, how it looks/works by default see here https://starter-demo.dakha.info/shop.
Open source, free to use - MIT license.

Table of content



❔ About

This theme keeps your time: it provides main ecommerce pages ready for easy and fast customize (home, catalog, single page) and a few great features which usually used or must have.

✔️ 6 main reasons to use Starter

  1. easy to customize layout
  2. it developed in according with WPCS so existing custom code is secure
  3. load speed ready: load time for dekstop is under 1 second, for mobile is under 3 seconds; the weight of homepage and catalog is only about 300kb, the weight of single product page is only about 200kb.
    Details Weight shop page Weight single product page Please note: load time and weight of pages described above - it's Starter as is, without any third-party resources. When you'll add google analitycs, gtm etc - it will down and it's ok.
  4. lighthouse: seo, best practice, accessability is 100! Performance (aka google pagespeed): it's 96-100 for homepage, shop, category, product page, support and simple pages.
    Details Lighthouse Please note #1: lighthouse metrics described above - it's Starter as is, without any third-party resources. When you'll add google analitycs, gtm etc - it will down and it's ok. Please note #2: Performance metric is vary from time to time +-5 points and it's ok.
  5. retina ready
  6. extended by a few cool features (plugin-less): ajax filter/sort/pagination, color filters, filter display types, google fonts, comments, menus.

‼️ 1 reason not to use

  1. frontend plugins (which affects to home, catalog, single) are require code integration via shortcodes or functions usually - due theme does not used hooks for these pages (i.e. just "install plugin and activate" - does not works)


🔧 Installation & Usage

✅ Requirements

Probably Starter will works with other plugin versions - but with versions below it's tested.

  • WordPress >= 5.9

  • ACF >= 5.11.4

    Show details You can to install: "ACF Pro" - all features available or Basic ACF - is not available Home Page features and you'll not see comment images in admin due gallery and repeater features are not available in free version.
    After installation go to ACF and sync fields. ACF sync settings
  • Advanced Editor Tools (previously TinyMCE Advanced) >= 5.6.0

    Show details After installation copy settings
    {
      "settings": {
        "toolbar_1":"bold,italic,underline,forecolor,blockquote,bullist,numlist,alignleft,aligncenter,alignright,alignjustify,link,unlink,undo,redo,wp_adv",
        "toolbar_2":"formatselect,fontselect,fontsizeselect,styleselect,pastetext,removeformat,fullscreen",
        "toolbar_3":"",
        "toolbar_4":"",
        "options":"advlist,menubar_block,merge_toolbars",
        "plugins":"advlist",
        "toolbar_block":"core\/image,core\/image",
        "toolbar_block_side":"tadv\/sup,tadv\/sub,core\/strikethrough,core\/code,tadv\/mark,tadv\/removeformat",
        "panels_block":"tadv\/color-panel,tadv\/background-color-panel",
        "toolbar_classic_block":"formatselect,bold,italic,blockquote,bullist,numlist,alignleft,aligncenter,alignright,link,forecolor,backcolor,table,wp_help"
      },
      "admin_settings": {
        "options":"hybrid_mode,classic_paragraph_block,table_resize_bars,table_grid,table_tab_navigation,table_advtab",
        "disabled_editors":""
      }
    }

    Go to settings TinyMCE settings 1 TinyMCE settings 2 And paste here TinyMCE settings 3

  • Classic Editor >= 1.6.2

  • EWWW Image Optimizer >= 6.4.1

    Show details After installation go to EWWW setting and enable 'WebP Conversion' & 'Force WebP'. EWWW settings
  • W3 Total Cache >= 2.2.1

    Show details W3TC used for optimize page cache and js only. W3TC settings 1 W3TC settings 2
  • Node.js = 17.x.x (**IMPORTANT for Windows: be sure that you're using x86 version, e.g. v17)

  • gulp = 4.0.2 (how to install - see next step Setup)

🔧 Setup

  1. Install Requirements
  2. Install gulp globally (if it's not installed yet) - do it once
    npm i --global gulp-cli
  3. Go to theme folder and run cmd/terminal and install packages
    npm i
  4. Setup your local domain in config.js: replace yourdomain into your local domain - it's required for browserSync and for Critical CSS

🚀 Build commands

Default task (for development):

gulp

Open site with port 4000 to get browserSync reloads.

Production task:

gulp production

👍 Highly recommended/integrated to theme plugins



🤝 Contributing

Please open an issue first to discuss what you would like to change.



📘 License

MIT