SiteSpectre by rafaoski

Site Profile for Processwire 3x using Framework Spectre.css

Site Profile For Processwire 3x with include Framework Spectre.css and functions like:


MarkupRegions

FunctionsAPI

If you want to use GULP STACK you must install these packages on your system:

Node.js
GULP

Now go to folder with all template files and install Important Dependencies

npm install
bower install

Go to gulpfile.js and change in line 9 -- var URL: "http://spectre.dev/" To your local processwire-installation -- like:

localhost/my-local-folder-processwire-installation/

Folder With all SCSS file is inside templates/assets/scss

To use the Font Awesome, you must uncomment ( remove => // ) this code line into the file that is in assets/scss/master.scss in line 6, must look like below:

'../../node_modules/font-awesome/scss/font-awesome.scss',

To copy Font Awesome use the command:

gulp copy

Now Use This Command to Watch all changes:

gulp watch

To Build all CSS with Font Awesome:

gulp build

Folder With all compressed CSS file is inside templates/assets/css

References:

Spectre.css
Font Awesome

Install and use modules at your own risk. Always have a site and database backup before installing new modules.

Latest news

  • ProcessWire Weekly #542
    In the 542nd issue of ProcessWire Weekly we'll check out a couple of new third party modules, a new site of the week, and more. Read on!
    Weekly.pw / 28 September 2024
  • Custom Fields Module
    This week we look at a new ProFields module named Custom Fields. This module provides a way to rapidly build out ProcessWire fields that contain any number of subfields/properties within them.
    Blog / 30 August 2024
  • Subscribe to weekly ProcessWire news

“We chose ProcessWire because of its excellent architecture, modular extensibility and the internal API. The CMS offers the necessary flexibility and performance for such a complex website like superbude.de. ProcessWire offers options that are only available for larger systems, such as Drupal, and allows a much slimmer development process.” —xport communication GmbH