Let’s talk about how to make a online food store website integrated with marketplace using WordPress.
WordPress with some powerful plugins make this work more easier.
Table of Contents
1. Requirements of Online Food Store
2. Online Food Store Feature Definition
Let’s define feature from requirements based on WordPress platform.
Maybe this additional feature need to be added to website.
3. Setup Hosting Server
Use hosting server like SiteGround. But also can be use AWS(Amazon Web Service) or GCP(Google Cloud Platform) to more flexible.
In this time, I selected GCP(Google Cloud Platform) because it provides virtual server with Indonesia location. Since this online food store is serviced in Indonesia country, So GCP(Google Cloud Platform) with Jakarta Region is the best choice.
6. Install WordPress Plugins
6.1. Page Builder
The most advanced frontend drag & drop page builder. Create high-end, pixel perfect websites at record speeds. Any theme, any page, any design.
Elementor Pro brings a whole new design experience to WordPress. Customize your entire theme: header, footer, single post, archive and 404 page, all with one page builder.
Price : $49/year
6.2. Product Management
6.3. Loop Template
Receipt, Offline Store, Franchise archive page need to be customized.
6.4. Custom Post Type (For Receipt)
6.5. Custom Fields
Following data need to be managed by website.
Receipt: Cooking times, Cooking ingredients, portions, etc
Marketplace: Purchase link, etc
Offline Store: Address, Tel, Operation time, etc
Franchise: Shop URL, Name, etc
6.6. SEO (Search Engine Optimization)
6.7. Image Optimization
7. Create Custom Post Type
To inform the user of the food recipe purchased. Need to connect with associated food to purchase.
Information about one or multiple franchise store(s).
10. Setup Product & Marketplace Link
All selling food can be registerd as a product by WooCommerce.
As we want to display purchase link di website, how can link product with marketplace product?
Manually Add to Content
Just manually add to each product ccontent with marketplace link.
Paid (But Free with Elementor Pro)
Create custom field of each marketplace and link to WooCommerce Product.
Use custom fields with dynamic contents in product detail page using Elementor Pro
11. Create Required Page
Create a new page and design using Elementor.
11.2. Foods Page
Food is the Product in this WooCommerce webstore.
11.3. Receipts Page
Receipt is the Custom Post Type with additional custom fields.
Manually Create Template
Need to manually create archive-receipt.php for archive, and single-receipt.php for single post in selected WordPress theme.
11.4. Franchise Page
Franchise is the Custom Post Type with additional custom fields.
Manually Create Template
Need to manually create archive-franchise.php for archive, and single-franchise.php for single post in selected WordPress theme.
12. Add Filtering & Search feature
It would be better to user can filtering product(food), receipt using various filtering options.
Filtering options are already made when we create a taxonomies and additional custom fields of Product, Receipt, and Franchise. How can we add filtering options to page?
There is no free option at this time. Thus, we should buy a paid WordPress plugin for this.
Finally, We can make a online food store easily using WordPress with some plugins.
I’m highly recommanded to use Elementor Pro plugin because it make process more professional.
I’ll add to my portfolio after finished to setup.