Giter VIP home page Giter VIP logo

advanced-gulp-wordpress's Introduction

Advanced Gulp WordPress

An Advanced Gulp Workflow for WordPress themes.

Features

  • Gulp
  • Sass for CSS
  • Auto Image optimization
  • Bower for assets management
  • Lean PHP files with next to no syntax
  • Custom architecture design
  • Theme zip file build with Gulp

Getting and Installing the Theme

  1. Grab a copy of this theme or Clone this theme, E.g. go to the themes folder then run git clone https://github.com/ahmadawais/advanced-gulp-wordpress.git

  2. You need Node.js & Sass installed if you haven't installed it, go ahead and install it first. Once you have Node, Sass and the theme installed, the next step is simple enough.

  3. Install Dependencies โ€” Open a command prompt/terminal and navigate to your theme's root directory and run this command: npm install - This installs all the necessary Gulp plugins to help with task automation such as Sass compiling and browser-sync! You'll need to run this step on each of your projects, going forward.

  4. Set your project configuration in gulpfile.js!! Be sure to go into gulpfile.js and setup the project configuration variables. This is important for using Browser-Sync with your project. Make sure in gulpfile.js that you set the project variable to the appropriate name for your project URL. Default is "yourlocal.dev"

  5. Install Bower - In the command prompt/terminal run this command: npm install -g bower. This installs Bower (the -g flag installs globally, not just in the current directory, super friends). Your only need to do this step once.

  6. Run gulp command in the root folder of your theme and it will start generating CSS from Sass and everything else

  7. Run gulp images to optimize images and only place the images in assets/img/raw/ folder, they'll moved to assets/img/ once optimized

  8. To build an installable zip file of your theme, use command gulp build and your project.zip file will be created as well as a buildTheme folder, where you can see what was zipped.

License

Neat was released under GPL v2.

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.