Breadfast (pvt) Ltd. is Sri Lanka’s first ever online bakery that delivers fresh baked foods every morning at the customer’s doorstep without them have to leave their house.
When Ihthisham, the founder of Breadfast approached us with his idea of selling breads online; we initially thought it would be the usual eCommerce website that sells goods to customers. But we were wrong. Though some operations of Breadfast was somewhat similar to most of the eCommerce websites we developed, this client had a couple of unique requirements.
- Yes, it’s an online store, but the customers can’t order after specific hours- no, nope. It’s not open for 24/7 orders!
- Orders are only delivered to customers from Colombo 1 to Colombo 15 – which won’t be categorized through postal codes.
- Customers should be able to choose a specific delivery date, and delivery time – well, that’s not unique to food delivery services though; this was the first time we had to face that challenge.
And few other requirements that an online store needs.
Tackling the challenge
We did a few researches and brainstormed some ideas on how we were planning on designing and developing the online store that doesn’t sell goods 24/7. We thought both about custom designing the platform from scratch or to go with an eCommerce platform. The latter was more suitable since the client was on a budget and it’s easy to build one something than to build from scratch. Eventually we settled for WooCommerce. Read our blog post on why WooCommerce is better than OpenCart (another popular eCommerce platform)
Solution and Strategy
An eCommerce store needs a proper security since it collects some sensitive user information. Besides Google now highlights if a website is not secure or not in the address bar. For this we need a proper SSL certificate. Since we were using Cloudflare’s CDN to route the website’s traffic, we had that problem covered. One of Cloudflare’s additional feature is that SSL comes for free (as in FREE). A shared SSL was sufficient for the website since the client was not planning on having the payment processor to operate in the website itself.
Now that we made sure that the website is hosted securely, we deployed WordPress and installed WooCommerce. A simple, yet powerful eCommerce management tool.
And now is the time for fun part – Custom coding and mods.
The best thing about WordPress and the plugins that uses it; it always has a way to achieve what we need. In order to make sure that the website collects orders only from the customers located in a specific area, we added some custom php functions and for some other exclusive requirements this website wanted.
We used few combinations of WordPress plugins to achieve some other tasks. For custom store hours and specific delivery date and time, you might want to check on Woocommerce Order Delivery or Pickup with Date and Time by ByConsole and WooCommerce Open Close by Jaed Mosharraf to achieve those functions. We did some additional configurations in those plugins to meet the exact expectation of the client. While the free versions of those plugins do some basic functions, you may need to go for a paid version to get the full use of them if you don’t know how to play around the code.
Next for the part for payment gateway integration, we explored possible options that are available in Sri Lankan market. PayHere, WebXPay, and of course the payment gateways offered by the banks of Sri Lanka. The client settled for the Commercial Bank’s payment gateway. Since there are no plugins available out of the box for custom payment gateway we had to develop a WordPress plugin for Commercial Bank payment gateway.
UI & UX
Breadfast’s main theme color is Honey Orange #DD9933 to match the logo and the color of bakery goods. Just Black #000000 for headings, off canvas elements and body texts had an accent of Very Dark Gray #545454. Honey Orange that matches the images of the products gives the website an aesthetically pleasing look while not sabotaging the overall appearance.