Stofgenoeg.nl

Dutch webshop for hand-made unique presents: http://www.stofgenoeg.nl/

Corry crafts unique, hand-made presents. She mainly uses Vlisco fabric, setting her apart from many other crafts stores. She wanted a professional web store that is easy to manage. The project included developing a new graphic style and HTML/CSS, JS, and PHP coding. The result is a heavily customised WordPress theme running WooCommerce.

Webshop

Woocommerce combined with several plugins and custom PhP scripts

The main function of the website is a webshop. This project was my first experience with WooCommerce. I was surprised with the simplicity of setting up, adding products the sheer volume of compatible plugins to customise the shop. Nevertheless, I of-course made some adjustments on my own using webhooks to inject PHP and JS coding.

Search bar

custom HTML + CSS + PHP

A search bar with category menu sticks to the top of the page at all times. The shopping basket shows on the top right, displaying a summary of its contents on hover.

Responsive design

mainly CSS, with small PHP + JS snippets for more complex behaviour

The responsiveness of the webshop to different screen sizes was a great challenge to me. I was able to almost all elements respond correctly through css using @media().

The filter sidebar on the shop page needed a more complex logic. This sidebar is initially hidden on smaller screens. Visibility can be toggled using a “filter” button. I programmed this myself using JS injection using PHP hooks and CSS styling for smaller screens.

Logo

Stofgenoeg is about hand-crafted gifts using fabrics and yarn. Therefore, I wanted the logo to resemble this. I chose to go for the look of thread, or yarn. After some explorations with yarn, the result is the word Stofgenoeg in a yarn font. Read about the process in this blog post.

Results

The final website was launched on May 2019. The website is a professional webshop that emphasises the hand-made gifts that are made by Corry. The main benefit is the increased simplicity of the ordering processes for both the customer and Corry.