Foundation 6 Minimal site profile

Recommended Posts

Foundation 6 Minimal site profile for ProcessWire

This profile is based on the "minimal site profile (intermediate edition)" and bundled with Foundation 6.

This precompiled version can be downloaded at github.



  • Foundation 6 framework
  • Font-Awesome
  • MeanMenu
  • Slick Carousel (Why not Orbit ?)
  • Render / helper functions for :
    • Simple ul navigation
    • Foundation Multi-level topbar
    • MeanMenu - Responsive menu for mobile device
    • Slick Carousel
    • Foundation Accordion
    • Foundation Callouts
    • Jumbotron



  • jQuery


How To Install

  1. Download the zip file at Github or clone directly the repo with git clone and skip the step 2.
  2. Extract the folder site-fdn6-precompiled into a fresh ProcessWire installation root folder.
  3. During the installation of ProcessWire, choose the profile "ProcessWire Foundation 6 profile".





  • The ProcessWire staff




mobile-1.PNG                                          mobie-2.PNG

Edited by flydev
typo and precompiled version download link modified
  • Like 14

Share this post

Link to post
Share on other sites

Hi at flydev => you did it again and this time with the foundation grid :)

Thanks for doing this and also making a pre-compiled profile. I am happy to see it is also compatible with processwire 2.7.2. I have uploaded it to a test server online here: I think I like the friendly foundation grid more than the intimidating bootstrap but that may be just personal expierence. Looking inside the templates folder, home.php, basic-page.php, _main.php, etc. I see you have a deeper understanding of pw api than I do and am happy to learn from there e.g. filling, preparing and render $content. I also saw you did a great job with customizing the backend:


Since the issue for me in this is building processwire website templates, I add here franciccio's post where he mentioned a good source of free html5/css templates: and here are also eight responsive foundation templates: although you have to subscribe to foundation for downloading (I am not affiliated with them in any way). There are probably more free foundation templates to find on the web such as this really nice one: (foundation 5 is still available)

Edit: make your own foundation template:




  • Like 3

Share this post

Link to post
Share on other sites


In "Download the zip file at Github or clone directly the repo with git clone and skip the step 2." the link points to your Bootstrap profile. You might want to fix this.

Thanks for this profile anyway, I'm gonna take a look at it in the following days.


  • Like 2

Share this post

Link to post
Share on other sites

@flydev It's me again :)

I've installed the profile, and thank's to @adrian's Tracy Debugger module, I did spot these:

These are easy to fix issues, so you might want to update the published version on github.

BTW, thanks @pwired for the online demo! This way I could easily demostrate's result.

  • Like 2

Share this post

Link to post
Share on other sites

@flydev most grateful for this ZF6/PW profile. I found your examples in _func.php to be tremendously helpful and enlightening.  Thanks too for your introduction to the slick.js carousle/slider. I use the scss version of Foundation and was delighted to find the slick.js scss files in its distro. I chose to slug it out with the ZF6 top nav using @soma's MarkupSimpleNavigation rather than meanmenu.js but glad to learn about that too.

Edited by joebaich
completing what I set out to say.
  • Like 1

Share this post

Link to post
Share on other sites

thx for this nice and clean F6-profile.   Sorry for this attachement, I thought there was a problem to remove the images, but it's working fine.


Screen Shot 08-13-16 at 12.35 PM.PNG

Edited by hansv
problem mentioned was not a problem

Share this post

Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

  • Recently Browsing   0 members

    No registered users viewing this page.

  • Similar Content

    • By Marcel
      Hey all,
      I want to customize the mywebsite/processwire/profile page. It's almost all good but I want to get rid of the sections 'Admin Theme' and 'Language' so that the user can just set a new password. (see image)
      Do I have to modify the admin template or how can I do that? Because when I go tree>Admin>Profile there are no fields to add or remove.
      Or where can I find the php file?
      I would appreciate your help.

    • By rafaoski
      This profile can be used as a business card or very simple blog.
      Requires the latest version processwire 3.0.101 !!!
      Milligram Site Profile For Processwire 3x with include functions like:
      wireIncludeFile | wireRenderFile
      Essentially, this structure uses minimalist CSS framework Milligram and the Flexbox Grid System Gridlex
      Live Example
      CAN DOWNLOAD FROM THIS LINK ( Basic Version and simple Blog Version )

      If you want to use Laravel Mix you must first ensure that Node.js and NPM are installed on your machine.
      Basic example to Debian and Ubuntu based Linux distributions:
      curl -sL | sudo -E bash - sudo apt-get install -y nodejs
      See more installation options LINK
      npm is installed with Node.js just check in linux terminal like below:
      node -v
      npm -v
      Set BrowserSync inside folder /templates/webpack.mix.js and change your dev url
      proxy: 'http://localhost/mix/', to your installation processwire folder like:
      proxy: 'http://localhost/your-processwire-installation-folder/',
      Next install npm packages in your templates folder with command npm install
      Now, boot up the dev server npm run watch, and you're all set go!
      On completion, use the command npm run production to build styles and scripts in the dist folder
      Simple Usage ( Basic Command )
      Run npm install Watch npm run watch Build npm run production All files to Webpack build steps is inside file ( webpack.mix.js )
      Folder With all SCSS files is inside templates/src/scss
      All build styles and scripts is inside the ( dist ) folder
      Laravel Mix
      Feather Icons
      Web Font Loader
      Verlok Lazy Load
      Cookie Consent
    • By Marcel
      I am very new to processwire and bootstrap. I have a field (text area) and there I want to be able to insert an image which is responsive. I tryed it with Source but in the end the page doesn't seem to like it when I insert in Source the following code
      <img src="<?php echo $homepage->content_img->url; ?>" class="img-fluid" alt="Responsive image"> What can I do to make it possible to insert reponsive images in a text area?
      Thank you in advance.
    • By karian
      Hi, based on the work of @microcipcip and @gebeer  (see their posts here and here), I put together a Processwire + React boilerplate (profile).
      Github repo:

    • By webhoes
      I am working of a site for a sport organisation.
      All affiliated gyms can edit their profile. I have used the advaced mode so that if you create a new page under location the gym can login and edit their profile.
      i also want that they can add instructors as child of their profile and also are able to edit those instructors.
      I can not get passed the able to edit all subpaged or none.
      How should this be done? Or is this not possible?