# Dely Food - FoodDelivery Marketplace

***

## Intro

<figure><img src="https://939140092-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fj4F8EGOdqHCANaqFGd7S%2Fuploads%2FGKw1Ef8WbVFPlPD0pwHW%2Fhttps___meta-q.cdn.bubble.io_f1677579437163x510071760849315100_delyfood-teplate.png?alt=media&#x26;token=71f7b0bb-143b-4ced-940f-2e86e97983ee" alt=""><figcaption></figcaption></figure>

## Links

🖥️[ Preview link](https://fooddeliverynew.bubbleapps.io/)

🌐 [Template page on Bubble Marketplace](https://bubble.io/template/fooddelivery-marketplace-1661187972411x616166950208012300)

***

## Screenshots

<div align="center" data-full-width="false"><figure><img src="https://939140092-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fj4F8EGOdqHCANaqFGd7S%2Fuploads%2Fh7GLNo7UrXcEdn6IcIRd%2F1.png?alt=media&#x26;token=3611762e-0a04-40c3-96ba-0b26adde2e50" alt=""><figcaption><p>Index page</p></figcaption></figure> <figure><img src="https://939140092-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fj4F8EGOdqHCANaqFGd7S%2Fuploads%2F3mZOf5f4t9tUleeUvaYn%2F2.png?alt=media&#x26;token=0c1ad34a-5169-4d54-8d10-7c375d7f5877" alt=""><figcaption><p>Features</p></figcaption></figure> <figure><img src="https://939140092-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fj4F8EGOdqHCANaqFGd7S%2Fuploads%2Fgayvb8Gi6eJdU2iiA6zN%2F3.png?alt=media&#x26;token=ef2a71fa-d679-4dc3-be6b-e65c79d469d1" alt=""><figcaption><p>Dishes page</p></figcaption></figure> <figure><img src="https://939140092-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fj4F8EGOdqHCANaqFGd7S%2Fuploads%2Fqe4f0AYKPQBtLlv11XuJ%2F4.png?alt=media&#x26;token=7bc4e9a2-d504-43ac-aaec-a7e32b20f3c0" alt=""><figcaption><p>About us</p></figcaption></figure> <figure><img src="https://939140092-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fj4F8EGOdqHCANaqFGd7S%2Fuploads%2FoIgeMixyY4x2gQqkPokz%2F5.png?alt=media&#x26;token=42401b7b-0afd-4125-8420-16556fcbdf84" alt=""><figcaption><p>Admins dashboard</p></figcaption></figure> <figure><img src="https://939140092-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fj4F8EGOdqHCANaqFGd7S%2Fuploads%2F1Lk44RoWuYhz13sO0j7X%2F6.png?alt=media&#x26;token=9026cc3b-11f6-4c38-a71b-f7c7961cb913" alt=""><figcaption><p>Profile page</p></figcaption></figure></div>

***

## Template details

DalyFood is a template that is great for those who want to open their own marketplace for food sales and delivery. In this case, we got a universal template with which you can start your own business. This is a #nocode template that allows the administrator to publish food categories and positions, and the user can choose the food that she\he likes the most, add it to the cart and arrange food delivery

DalyFood template features the following:&#x20;

✅ Responsive design&#x20;

✅ Admin dashboard&#x20;

✅ Create and edit products from admin panel&#x20;

✅ Possibility to add extra options to available products&#x20;

✅ Quick and flexible product search&#x20;

✅ Search across all product categories&#x20;

✅ Sort and filter using multiple criteria&#x20;

✅ The function of viewing order history in admin dashboard&#x20;

This template is sold "as is" but if there are any critical bugs, feel free to reach out. Our team will try to fix them ASAP.\
\
We tried to keep all the workflows and design architecture simple for beginner-intermediate users to use and adjust. However, we recommend having at least moderate experience with Bubble to be able to fully use and edit the app’s backend.\
\
If you need any assistance to customize this template for your personal or business project, feel free to reach out to our team via <dev@appassion.io>. We are always there to help build new products and mobile/web applications.\
\
We hope this template would become a great starting point for your project.

{% hint style="warning" %}
*<mark style="color:red;">**Removing the banner**</mark>*

*<mark style="color:red;">**1. Open the app in Bubble editor**</mark>*&#x20;

*<mark style="color:red;">**2. Go to settings -> SEO/Metatags**</mark>*&#x20;

*<mark style="color:red;">**3. Remove the content of "Script in the body"**</mark>*
{% endhint %}

***

## User flows&#x20;

**Main user flow:**&#x20;

-> Product search -> View product description -> Choice of additional options -> Add product to cart -> Editing a shopping cart -> Order delivery

***

## Key features

<table data-view="cards"><thead><tr><th></th><th align="center"></th><th></th><th data-hidden data-card-cover data-type="files"></th><th data-hidden data-type="checkbox"></th></tr></thead><tbody><tr><td></td><td align="center"><mark style="color:orange;"><strong>MULTISELECT EDITOR</strong></mark></td><td></td><td></td><td>true</td></tr><tr><td></td><td align="center"><mark style="color:orange;"><strong>DROPDOWN RICH TEXT</strong></mark> </td><td></td><td></td><td>false</td></tr><tr><td></td><td align="center"><mark style="color:orange;"><strong>RESTAURANT LISTINGS</strong></mark></td><td></td><td></td><td>true</td></tr><tr><td></td><td align="center"><mark style="color:orange;"><strong>SECURE PAYMENT OPTIONS</strong></mark></td><td></td><td></td><td>true</td></tr><tr><td></td><td align="center"><mark style="color:orange;"><strong>ORDER CUSTOMIZATION</strong></mark></td><td></td><td></td><td>true</td></tr><tr><td></td><td align="center"><mark style="color:orange;"><strong>RATINGS AND REVIEWS</strong></mark></td><td></td><td></td><td>false</td></tr></tbody></table>

## Workflows&#x20;

### Primary colors and their purposes

### **Green**

Emphasizes actions related to creating or modifying records in the database, indicating successful operation completion.

**For example:**

{% tabs %}
{% tab title="Example 1" %}

<figure><img src="https://content.gitbook.com/content/j4F8EGOdqHCANaqFGd7S/blobs/oVLOZFQY88mnbEsbAC7s/exmp%201.svg" alt=""><figcaption></figcaption></figure>
{% endtab %}

{% tab title="Example 2" %}

<figure><img src="https://content.gitbook.com/content/j4F8EGOdqHCANaqFGd7S/blobs/lRnNnhof8YbQFzNOzkeG/exmp%202.svg" alt=""><figcaption></figcaption></figure>
{% endtab %}
{% endtabs %}

### **Red**

Designated for actions involving deletion or resetting of values, aiding users in quickly identifying them.

**For example:**

{% tabs %}
{% tab title="Example 1" %}

<figure><img src="https://content.gitbook.com/content/j4F8EGOdqHCANaqFGd7S/blobs/GRPe9gZ9wg8vxJVAKfwh/exmp%203.svg" alt=""><figcaption></figcaption></figure>
{% endtab %}

{% tab title="Example 2" %}

<figure><img src="https://content.gitbook.com/content/j4F8EGOdqHCANaqFGd7S/blobs/AOIWVaJkfVV7JGsovMQW/exmp%204.svg" alt=""><figcaption></figcaption></figure>
{% endtab %}
{% endtabs %}

### **Blue**

Reserved for actions that do not impact application resources, such as opening or closing pop-up windows.

**For example:**

{% tabs %}
{% tab title="Example 1" %}

<figure><img src="https://content.gitbook.com/content/j4F8EGOdqHCANaqFGd7S/blobs/027V4eBoBlKIpdEUF2Kb/exmp%205.svg" alt=""><figcaption></figcaption></figure>
{% endtab %}

{% tab title="Example 2" %}

<figure><img src="https://content.gitbook.com/content/j4F8EGOdqHCANaqFGd7S/blobs/bvGwXiwV1FwjJatYtiqx/exmp%206.svg" alt=""><figcaption></figcaption></figure>
{% endtab %}
{% endtabs %}

### **Orange**

Used for actions related to app navigation, providing ease of orientation within the interface.

**For example:**

{% tabs %}
{% tab title="Example 1" %}

<figure><img src="https://content.gitbook.com/content/j4F8EGOdqHCANaqFGd7S/blobs/EkYedZqmIOIjrKx6VFEJ/exmp%207.svg" alt=""><figcaption></figcaption></figure>
{% endtab %}

{% tab title="Example 2" %}

<figure><img src="https://content.gitbook.com/content/j4F8EGOdqHCANaqFGd7S/blobs/3swgJmDsyHf5eIFAOxiu/exmp%208.svg" alt=""><figcaption></figcaption></figure>
{% endtab %}
{% endtabs %}

### **Brown**

&#x20;Utilized for custom workflows and API work, highlighting these actions among others.

**For example:**

{% tabs %}
{% tab title="Example 1" %}

<figure><img src="https://content.gitbook.com/content/j4F8EGOdqHCANaqFGd7S/blobs/721RZcUOYLkB0YsJlVj0/exmp%209.svg" alt=""><figcaption></figcaption></figure>
{% endtab %}

{% tab title="Example 2" %}

<figure><img src="https://content.gitbook.com/content/j4F8EGOdqHCANaqFGd7S/blobs/UkMhBnUQkzmMI1dLAfbd/exmp%2010.svg" alt=""><figcaption></figcaption></figure>
{% endtab %}
{% endtabs %}

### **Purple**

Left to the developer's discretion for assigning color to actions as they see fit.

**For example:**

{% tabs %}
{% tab title="Example 1" %}

<figure><img src="https://content.gitbook.com/content/j4F8EGOdqHCANaqFGd7S/blobs/nMdxLqpy6CfJKQxYyA12/purple%201.svg" alt=""><figcaption></figcaption></figure>
{% endtab %}

{% tab title="Example 2" %}

<figure><img src="https://content.gitbook.com/content/j4F8EGOdqHCANaqFGd7S/blobs/XSPACzT336VMgJV763Zz/purple%202.svg" alt=""><figcaption></figcaption></figure>
{% endtab %}
{% endtabs %}

### **Cyan**

&#x20;**I**ntended for actions involving the use of Custom Events, ensuring ease of perception for complex operations.

**For example:**

{% tabs %}
{% tab title="Example 1" %}

<figure><img src="https://content.gitbook.com/content/j4F8EGOdqHCANaqFGd7S/blobs/bVnDD4Pk6qkgOapdfCc4/cyan%201.svg" alt=""><figcaption></figcaption></figure>
{% endtab %}

{% tab title="Example 2" %}

<figure><img src="https://content.gitbook.com/content/j4F8EGOdqHCANaqFGd7S/blobs/joVmFYRVDNbvJttsBVkD/cyan%202.svg" alt=""><figcaption></figcaption></figure>
{% endtab %}
{% endtabs %}

### **Grey**

Employed for all other actions not covered by other colors, aiding in making the interface clear and balanced.

For example:

{% tabs %}
{% tab title="Example 1" %}

<figure><img src="https://content.gitbook.com/content/j4F8EGOdqHCANaqFGd7S/blobs/WQTaMZC435sS7LgTRgwv/grey%201.svg" alt="" width="352"><figcaption></figcaption></figure>
{% endtab %}
{% endtabs %}

{% hint style="warning" %}
These standards are purely recommendations. Possible discrepancies do not affect the functionality of the application.
{% endhint %}

***

## Pages

*Below, you will find a list of all the pages available on this platform, along with a brief description of their functionality.*

\ <mark style="color:orange;">**Index:**</mark> Explore our landing page for insights on the template, featuring descriptions, recommended food, our dishes and other information.

<mark style="color:orange;">**Docs:**</mark> Access all necessary platform documentation, including Privacy Policy, Terms & Conditions, and Frequently Asked Questions (FAQ).

<mark style="color:orange;">**Dashboard:**</mark> An admin's dashboard providing essential and up-to-date information.&#x20;

* The  "General" tab compiles information about latest sales and dishes, taxes and discounts.
* The  "Products" tab compiles information about all products on site such as name, category, description, extra, price, image and offer to admins possibility to Delete or view all information about product.
* The  "Orders" tab compiles information about all orders such as order number, date, address, selected dishes, delivery description, price and offer to admins possibility to delete or view all information about order.
* The  "Other" tab compiles information about all FAQ titles and descriptions where admins can edit all information and carousel image where admins can upload or edit some image.

<mark style="color:orange;">**Reset Password:**</mark> Effortlessly reset your password and receive updated login credentials for seamless access.

<mark style="color:orange;">**Checkout:**</mark> This page contains all the necessary information and functionality so that the user, after having chosen all the necessary products, can make a checkout to order the products at home.

<mark style="color:orange;">**Profile:**</mark> This page offers users the possibility to check their personal data and is the necessary functionality to allow the user to modify them.

<mark style="color:orange;">**About Us:**</mark> Exploring this page the user can find out more interesting and useful information about us.

<mark style="color:orange;">**Menu:**</mark> This page displays all the products on the site with a little information about them such as name, price, image and a short description to make it easier for the user to choose the desired product and at the top of the page there is a search where the user can search for the product by name or choose a specific dish.

***

## Reusable elements

1. **Footer** - a section at the bottom of a web page containing additional information such as contacts and links. Used in the following pages: <mark style="color:orange;">about, companies, company\_view, contact\_us, docs, index, job\_view, jobs, resume\_view, resumes.</mark>
2. **Header** - the top part of a web page containing the logo, application name, navigation elements, and other important components. <mark style="color:orange;">Found on all application pages.</mark>
3. **Download on the app**- Contains information on how and where users can download our phone app.
4. **Signup / Login Popup**- Contains popups that appear when the user wants to log in or register on the site and if they want to reset their password.

***

## Data Types

### Offers

This data type is designed for storing information related to Offers.&#x20;

| Field name | Type             | Notes        |
| ---------- | ---------------- | ------------ |
| `Image`    | `List of Images` | Offer images |

### Order

This data type is designed for storing information related to Order.&#x20;

| Field name         | Type                                                                                         | Notes                  |
| ------------------ | -------------------------------------------------------------------------------------------- | ---------------------- |
| `Address`          | `Text`                                                                                       | Order address          |
| `Delivery Details` | `Text`                                                                                       | Order delivery details |
| `Delivery Type`    | <p><code>Option set:</code><br><a href="#delivery-type"><code>Delivery Type</code></a></p>   | Order delivery type    |
| `Full Name`        | `Text`                                                                                       | Order full name        |
| `Location`         | `Text`                                                                                       | Order location         |
| `Order ID`         | `Number`                                                                                     | Order id number        |
| `Ordered Products` | `List of` [`Ordered Productses`](#ordered-products)                                          | Order products         |
| `Owner`            | [`User`](#user)                                                                              | Order owner name       |
| `Payment Method`   | <p><code>Option set:</code><br><a href="#payment-method"><code>Payment Method</code></a></p> | Order payment method   |
| `Phone`            | `Text`                                                                                       | Order phone number     |
| `Products Price`   | `Number`                                                                                     | Order products price   |
| `Status`           | <p><code>Option set:</code><br><a href="#order-status"><code>Order Status</code></a></p>     | Order status           |
| `Total Price`      | `Number`                                                                                     | Order total price      |
| `User`             | [`User`](#user)                                                                              | Order user name        |

### Ordered Products

This data type is designed for storing information related to Ordered Products.&#x20;

| Field name | Type                                | Notes                     |
| ---------- | ----------------------------------- | ------------------------- |
| `Order`    | [`Order`](#order)                   | Order number              |
| `Price`    | `Number`                            | Ordered products price    |
| `Product`  | [`Product`](#produc)                | Ordered products          |
| `Quantity` | `Number`                            | Ordered products quantity |
| `Size`     | [`Product Size`](#product-size)     | Ordered products size     |
| `Toppings` | `List of` [`Toppingses`](#toppings) | Ordered products toppings |

### Product

This data type is designed for storing information related to Product.&#x20;

| Field name    | Type                                                                             | Notes               |
| ------------- | -------------------------------------------------------------------------------- | ------------------- |
| `Category`    | <p><code>Option set:</code><br><a href="#category"><code>Category</code></a></p> | Product category    |
| `Description` | `Text`                                                                           | Product description |
| `Image`       | `Image`                                                                          | Product image       |
| `Name`        | `Text`                                                                           | Product name        |
| `Price`       | `Number`                                                                         | Product price       |
| `Rating`      | `Number`                                                                         | Product rating      |
| `Size`        | `List of` [`Product Sizes`](#product-size)                                       | Product size        |
| `Toppings`    | `List of` [`Toppingses`](#toppings)                                              | Product toppings    |

### Product Size

This data type is designed for storing information related to Product Size.&#x20;

| Field name | Type     | Notes                       |
| ---------- | -------- | --------------------------- |
| `Name`     | `Text`   | Product size name           |
| `Price`    | `Number` | Product size price          |
| `Regular`  | `Yes/No` | Product size regular status |

### Taxes & Discounts

This data type is designed for storing information related to Taxes & Discounts.&#x20;

| Field name | Type                                                                             | Notes                      |
| ---------- | -------------------------------------------------------------------------------- | -------------------------- |
| `Category` | <p><code>Option set:</code><br><a href="#category"><code>Category</code></a></p> | Taxes & Discounts category |
| `Discount` | `Number`                                                                         | Discount                   |
| `Fees`     | `Number`                                                                         | Taxes & Discounts fees     |
| `Order`    | [`Order`](#order)                                                                | Taxes & Discounts order    |
| `Taxes`    | `Number`                                                                         | Taxes                      |

### Toppings

This data type is designed for storing information related to Toppings.&#x20;

| Field name | Type     | Notes          |
| ---------- | -------- | -------------- |
| `Name`     | `Text`   | Toppings name  |
| `Price`    | `Number` | Toppings price |

### User

This data type is designed for storing information related to User.&#x20;

| Field name      | Type              | Notes              |
| --------------- | ----------------- | ------------------ |
| `Address`       | `Text`            | User address       |
| `Admin`         | `Yes/No`          | User admins stauts |
| `City`          | `Text`            | User city name     |
| `Current Order` | [`Order`](#order) | User current order |
| `Demo`          | `Yes/No`          | User demo status   |
| `Name`          | `Text`            | User name          |
| `Phone`         | `Number`          | User phone number  |
| `Email`         | `Text`            | User email         |

### FAQ

This data type is designed for storing information related to FAQ.&#x20;

| Field name    | Type   | Notes           |
| ------------- | ------ | --------------- |
| `Description` | `Text` | FAQ description |
| `Title`       | `Text` | FAQ title       |

***

## Option sets&#x20;

#### Category

* All
* Sushi
* Pasta
* Burgers
* Pizza
* Desserts

#### Delivery Type

* Standard
* Priority

#### Order Status

* Open
* Closed

#### Payment Method

* Cash
* Credit Card

#### Sort

* Sort by name
* Price low to high
* Price high to low

***

<figure><img src="https://content.gitbook.com/content/j4F8EGOdqHCANaqFGd7S/blobs/M2vfrKJD5a3CAqqO58N2/Logo-Appassion.png" alt=""><figcaption></figcaption></figure>

The template is available in its current form, however, further alterations can be negotiated.&#x20;

Don't hesitate to reach out to us with any questions, and we'll gladly explore options to accommodate your concepts – Visit us at [<mark style="color:orange;">https://appassion.io/</mark>](https://appassion.io/) or email us at <mark style="color:orange;"><dev@appassion.io></mark>

<mark style="color:orange;">**We are always at your service through:**</mark> [Upwork](https://www.upwork.com/agencies/1472948949083369472/), [Clutch](https://clutch.co/profile/appassion#highlights). \ <br>