# Ez Starter - Landing Page

<figure><img src="https://d1muf25xaso8hp.cloudfront.net/https%3A%2F%2Fmeta-l.cdn.bubble.io%2Ff1655801399337x382365599590828200%2FEzStarter.png?w=768&#x26;h=439&#x26;auto=compress&#x26;dpr=1.75&#x26;fit=max" alt=""><figcaption></figcaption></figure>

***

## 🔗Links

&#x20;      [**Template Link on Bubble Marketplace**](https://bubble.io/template/ez-starter---landing-pages-1543857478506x584227237813551100)

&#x20;      [**Template Link on Our Website**](https://eazycode.com/template/ez-starter---landing-page-1692021501364x423238075415478500)

&#x20;      [**Preview Link**](https://ezstarter.bubbleapps.io/)&#x20;

&#x20;      [**Forum Link**](https://forum.bubble.io/t/new-template-ez-starter-free-landing-page-template-by-ezcode/64896)

***

## Photos

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

<figure><img src="/files/GzuecuQnSFFMbxKkQmKT" alt=""><figcaption></figcaption></figure>
{% endtab %}

{% tab title="2" %}

<figure><img src="/files/9qvan2wbUsdakJ7iyuR0" alt=""><figcaption></figcaption></figure>
{% endtab %}

{% tab title="3" %}

<figure><img src="/files/9BRYi5jSM2MrYMdHj7iz" alt=""><figcaption></figcaption></figure>
{% endtab %}

{% tab title="4" %}

<figure><img src="/files/xywZX1I44lcuqtWTCdhr" alt=""><figcaption></figcaption></figure>
{% endtab %}

{% tab title="5" %}

<figure><img src="/files/e5fwraXehaxME11PyZf9" alt=""><figcaption></figcaption></figure>
{% endtab %}

{% tab title="6" %}

<figure><img src="/files/DaZ53QAA03nz9MP2Fs14" alt=""><figcaption></figcaption></figure>
{% endtab %}

{% tab title="7" %}

<figure><img src="/files/yA9jPf9mrpZ51zTAUKtY" alt=""><figcaption></figcaption></figure>
{% endtab %}
{% endtabs %}

## Introduction&#x20;

A landing is a web page primarily designed to collect contact information from the target audience. It is used to enhance advertising effectiveness and expand the reach of the audience. We have created this template for entrepreneurs who are interested in promoting their businesses and attracting new clients. Additionally, Ez Starter is perfect for those who are just getting started with bubble.io development. The template combines a simple design with ease of customization to fit your needs. It includes all the necessary functions of a landing page and is fully compatible with all types of devices.

The template is completely free, although additional modifications can be discussed. Please feel free to contact us with any questions, and we will be happy to find a solution for your idea.

***

## Notes

{% hint style="info" %} <mark style="color:blue;">**Important note**</mark><mark style="color:blue;">:</mark> After purchasing this template and customizing it, be sure that you had a chance to learn how to set up data security.&#x20;

Check all privacy settings by the following link before launch: [*<mark style="color:blue;">**Bubble Privacy**</mark>* ](https://manual.bubble.io/help-guides/data/the-database/protecting-data-with-privacy-rules)

Since access to objects differs in each application and is unique for each case, ensure you have established all the privacy rules.
{% endhint %}

{% hint style="danger" %} <mark style="color:red;">This template is not the final product. Any part of the application can be modified for different needs.</mark>
{% endhint %}

***

## Pages

These are three variations of the landing page with different unique designs.

A landing page is a single web page that serves as the entry point for a website or a specific marketing campaign. It is designed with the primary goal of converting visitors into potential customers or leads

***

## Reusable elements

### about\_us

This reusable element contains images and texts that contain information about the company.

### apps

This reusable element contains ways to get the app.

### banner

This reusable element contains a background, image, buttons, and trigger for popups with video from YouTube.

### call\_to\_action

This reusable element contains a call to action bloc. It has information, features, and images.

### features

This reusable element contains information about the item's features.&#x20;

### footer

This reusable element contains a subscription, logo, and links to EzCode plugins, templates, and socials.

### Header

This reusable element contains scroll buttons to the main blocs of the page and mobile menu.

### pricing&#x20;

This reusable element contains groups with pricing information and learns more buttons.

### Signup / Login Popup

This reusable element contains sign-up, log-in and reset password forms.

### testimonials

This reusable element contains images and tabs with testimonials.

### why\_us&#x20;

This reusable element contains reasons to choose this company, item or else. It contains tabs with information about benefits.

***

## Workflow

Highlighting the workflow with color is a great way to separate actions in essence and significance. Below is the <mark style="color:green;">Eazy</mark><mark style="color:red;">Code</mark> standard for the use of colors with a detailed explanation.

{% hint style="warning" %} <mark style="color:orange;">The standards below are for informational purposes only. Any discrepancy is not related to the functionality of the application.</mark>
{% endhint %}

**Blue** - The actions taking place on our screen do not utilize the application's resources. For instance, when an element is clicked and a popup is opened or closed.

<div align="center"><figure><img src="/files/jXBLqAqnhRtr8trT1P4y" alt="" width="200"><figcaption></figcaption></figure></div>

**Green** - These actions involve creating or modifying entries in the database. For example, "Create a new Thing," "Make changes to a thing or a list of things," as well as "Copy a list of things," and so on.

<figure><img src="/files/IhsNgLQzEqD60jRJQ1nn" alt="" width="200"><figcaption></figcaption></figure>

**Red** - This action involves deleting or resetting values. For instance, "Delete a thing or a list of things," as well as "Reset a group" and "Reset inputs."

<figure><img src="/files/Bvmu9eBxmVDTHmejQBzN" alt="" width="200"><figcaption></figcaption></figure>

**Orange** - Actions related to your navigation. For example, "Navigate to a page," or "Do when a condition is true" – when you use specific values for checking, such as "When the current user is logged in," and so on.

<figure><img src="/files/6V3DXdnLhMYwqnWDpiP8" alt="" width="200"><figcaption></figcaption></figure>

**Cyan** - Actions utilizing Custom Events – lengthy tasks that involve the creation, modification, deletion, and plugins within a single comprehensive workflow as steps.

<figure><img src="/files/GPrMgq8tXbrjY9yyZVyH" alt="" width="200"><figcaption></figcaption></figure>

**Brown** - Custom workflow, API workflow, and similar tasks.

<figure><img src="/files/keW5zGLMCW3tTyyEOWOZ" alt="" width="200"><figcaption></figcaption></figure>

**Purple** - The significance of this color is determined by the developer themselves, as it is done due to the fact that everyone has their own approach to development.

<figure><img src="/files/XNzKj8OwRFRk1HFOGqvy" alt="" width="200"><figcaption></figcaption></figure>

**Grey** - All other actions.

<figure><img src="/files/HC9QqjagbZp1qTBebH6y" alt="test" width="201"><figcaption></figcaption></figure>

***

## Data Types:

### Video

This data type is used to store youtube video proprieties.

<table data-full-width="false"><thead><tr><th>Field name</th><th>Type</th><th>Notes</th><th data-hidden>Notes</th></tr></thead><tbody><tr><td><code>link</code></td><td><code>get YouTube Video</code></td><td>Stores the link to the video.</td><td></td></tr><tr><td><code>video</code></td><td><code>text</code></td><td>Stores the name of the video.</td><td></td></tr></tbody></table>

***

<div align="left"><figure><img src="/files/FWlRXstCc6xNIGrX5Eqb" alt="" width="188"><figcaption></figcaption></figure></div>

The template is sold as is, although additional modifications can be discussed. Feel free to contact us for any inquiries and we’ll be happy to find a solution for your ideas – <http://eazycode.com/>

**Hire us:**

<img src="/files/4KPeHfCmX2d7zpd83cXF" alt="" data-size="line"> <https://www.fiverr.com/share/qQoDQZ>\ <img src="/files/h0wwtUMwvDod7FamBfIq" alt="" data-size="line"> <https://www.upwork.com/freelancers/~01c1a4cbef44ecb5f1>\
\
**Follow us:**

<img src="/files/67Q41mFR1z6nYwKvqJeJ" alt="" data-size="line"> <https://www.facebook.com/eazycode>\ <img src="/files/6MUa0InxwRzMoVStCu5q" alt="" data-size="line"> <https://twitter.com/ezcode_official>  \ <img src="/files/IUseXDC1i7zfvZcQgctx" alt="" data-size="line"> <https://www.instagram.com/eazycodecom/>\ <img src="/files/0dMeGeMKCjKSGW3RBP6P" alt="" data-size="line"> <https://www.linkedin.com/company/eazycodecom/>


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.eazycode.com/ezcode-documentation/templates/ez-starter-landing-page.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.