## Getting Started

#### Quick start

    <p class="mb-0">Looking to start your project quickly? Just unzip the <code>Phoenix-v1.23.0.zip</code>. We have precompiled and packaged everything in the <code>public</code> directory for you. Start editing the <code>public/pages/starter.html</code> with a text or code editor, save it, and open the file in your favourite browser to see the changes.</p>

Looking to start your project quickly? Just unzip the `Phoenix-v1.23.0.zip`. We have precompiled and packaged everything in the `public` directory for you. Start editing the `public/pages/starter.html` with a text or code editor, save it, and open the file in your favourite browser to see the changes.

#### Setting up Build system

    <p>Unzip the <code>Phoenix-v1.23.0.zip</code> to any folder and open a command line or terminal at that location.
      theme's dev tools require <a href="https://nodejs.org/en/" target="_blank">Node</a> and <a href="https://git-scm.com/" target="_blank">Git</a> . If you do not have them in your machine, please install their latest stable version from their corresponding website. As you have <span class="fw-black text-body-emphasis">Node and Git installed and accessible from your terminal or command line</span>, install <a href="https://gulpjs.com/" target="_blank">Gulp CLI</a> package
      globally with the following command:</p><pre><code class="lang-html">npm i gulp-cli -g
    </code></pre>
    <p class="mt-4">When you’re done, install the rest of the theme’s dependencies with:</p><pre><code class="lang-html">npm i
    </code></pre>
    <p class="mt-4">Now run:</p><pre><code class="lang-html">gulp
    </code></pre>
    <p class="mt-4">Running gulp will compile the SCSS, transpile the javascript, copy all required libraries form <code>node_modules</code> to the corresponding <code>public/assets/vendors </code> directory and will open a browser window to <code>public/index.html</code></p>
    <p>All of the following folders are monitored for changes, which will tell the browser to reload automatically after any changes are made:</p><pre><code class="lang-html">public/assets/fonts/
    public/assets/video/
    public/assets/img/
    public/vendors
    src/pug/
    src/scss/
    src/js/
    </code></pre>
    <p class="mt-4">Now you can edit any <code>pug</code> file from <code>src/pug</code>, change SCSS variable with <code>scss/_user-variables.scss</code>, or write your own SCSS code in <code>scss/_user.scss</code> and add or update <code>javaScript</code> from <code>src/js</code> directory.</p>
    <div class="alert alert-subtle-warning">Running the <code>gulp</code> command will discard and regenerate all the files in following directories:</div><pre><code class="lang-html">public/**/*.html
    public/assets/css/
    public/assets/js/
    public/vendors
    </code></pre>
    <p class="mt-4">Hit <code>Ctrl+C</code> or just close the command line window to stop the server.</p>
    <p>Happy editing!</p>

Unzip the `Phoenix-v1.23.0.zip` to any folder and open a command line or terminal at that location. theme's dev tools require Node and Git . If you do not have them in your machine, please install their latest stable version from their corresponding website. As you have Node and Git installed and accessible from your terminal or command line, install Gulp CLI package globally with the following command:

    npm i gulp-cli -g

When you’re done, install the rest of the theme’s dependencies with:

    npm i

Now run:

    gulp

Running gulp will compile the SCSS, transpile the javascript, copy all required libraries form `node_modules` to the corresponding `public/assets/vendors` directory and will open a browser window to `public/index.html`

All of the following folders are monitored for changes, which will tell the browser to reload automatically after any changes are made:

    public/assets/fonts/
    public/assets/video/
    public/assets/img/
    public/vendors
    src/pug/
    src/scss/
    src/js/

Now you can edit any `pug` file from `src/pug`, change SCSS variable with `scss/_user-variables.scss`, or write your own SCSS code in `scss/_user.scss` and add or update `javaScript` from `src/js` directory.

Running the `gulp` command will discard and regenerate all the files in following directories:

    public/**/*.html
    public/assets/css/
    public/assets/js/
    public/vendors

Hit `Ctrl+C` or just close the command line window to stop the server.

Happy editing!

##### Demo widget

I need help with something

I can’t reorder a product I previously ordered

How do I place an order?

My payment method not working

##### Eric

Ask us anything – we’ll get back to you here or by email within 24 hours.

##### Theme Customizer

Explore different styles according to your preferences

##### Color Scheme

Light
Dark
Auto

##### RTL

Change text direction

##### Support Chat

Toggle support chat

##### Navigation Type

Vertical
Horizontal
Combo
Dual nav

##### Vertical Navbar Appearance

Default Default
Darker Lighter

##### Horizontal Navbar Shape

Default
Slim

##### Horizontal Navbar Appearance

Default
Darker Lighter
Purchase template
customize