# Blank Page

### **Adding the Blank Page building block** <a href="#add" id="add"></a>

1. Click the red **+ Block** button.
2. Select the **Advanced** tab.<br>

   <figure><img src="/files/t0nSVFD6nuCc8tV59GRp" alt=""><figcaption></figcaption></figure>
3. Select the  **Blank Page** block and click **Add this block.**
4. Fill in the **name** of the block and click on **Add this Block**. <br>

   <figure><img src="/files/nVCMNsC1kb14cJEUvk5l" alt=""><figcaption></figcaption></figure>
5. Click on the **icon** if you want to change the image used in the menu.\
   \* **Replace** allows you to choose from a wide range of AppMachine icons or upload your own.\
   \* **Delete** removes the icon so that only text is used (in this case "Gigs") is presented in your app's menu.

### Using Elements Mode to build your Blank Page

Elements mode can be accessed by clicking on the "**Edit in Elements mode**" button under the **General** settings or, while the Blank Page block is selected, clicking on the Elements section above the block tree.

![](/files/xYEZrWa7vmFZgT3n1zc8)

#### Adding Elements to your app

To add a new element to your app, click on the blue + Add Element button.&#x20;

![](/files/Lxrb5TztpPCQjppLq7mr)

You will see a window appear with three sections; **Your Components**, **Components**, and **Display.**

* **Your Components**: In this section, custom components (or a collection of Elements) that you have created and saved will appear in this section.&#x20;
* **Components**: These are collections of Elements with a specific design or purpose/functionality that have already been created for you by AppMachine.<br>

  <figure><img src="/files/n1ycavJk9mrggKmrjp38" alt=""><figcaption></figcaption></figure>
* **Display**: These are the individual Elements with which you can edit your Blank Page block with design elements or information that you want to display.

A great way to get started with building components in your Blank Page block is reviewing or understanding how the Components were built that we have already made available by AppMachine in the **Components** section.

Below, the Component "What's New" has been added to a Blank Page block.&#x20;

<figure><img src="/files/UM2KRhnO6TNscoj9J2Ct" alt=""><figcaption></figcaption></figure>

The "**What's New**" component is comprised of a title and a list with three items. Each item has it's own icon to illustrate the item.&#x20;

The entire component is contained in a Container element. This allows you to organize your designed components on the screen and to easily move entire components with the Element tree.&#x20;

You can see below how the "Item 2" **Container** element has been moved to the end of the list now.

<figure><img src="/files/9GP8OJ6MoBOmnTeAKSVR" alt=""><figcaption></figcaption></figure>

### Element Properties

As you can also see, each Element has its own set of Properties that can influenced. These Properties appear when you select an Element in the Element tree. <br>

<figure><img src="/files/CB24x49hlfBbh4mdSCH6" alt=""><figcaption></figcaption></figure>

These Properties can include:

* **Layout:** Allows you to change the **Width**, **Height**, **Margin**, **Padding** and **Gap** as relative to other Elements.&#x20;
* **Background:** Allows you to change the background of the selected Element.&#x20;
* **Border:** Give the selected Element a border and define the radius of the border, the width, and the color.
* **Other:** Give the Element a name for easy identification, a visible label, and turn the element's visibility on or off with the toggle.

Now that you've analyzed how one of AppMachine's Components has been built, try building your own screen(s)! If you run into any issues, don't hesitate to contact [AppMachine support](mailto:support@appmachine.com).&#x20;

### **The Blank Page building block settings**

The **Blank Page** building block editor is composed of two editing screens: **General** and **Design**.&#x20;

<figure><img src="/files/Fc19qWBHufvZcNLUmqm3" alt=""><figcaption></figcaption></figure>

The settings in the **Settings** editing screen are empty here as the entirety of this block is edited in  Elements mode. Click on "Edit in Elements mode" to edit the content of this block. **T**he settings in the **Design** screen influence those settings that you want to be different than those selected in the  **Theme** block.&#x20;

### **Settings**

There are several aspects of your **Blank Page** block that can be changed in this screen:

* The **name** of the block
* The **icon** (or image) that will be used in the app menu

Should the need arise to keep the users of your published app from using this portion of the app, then you can always make use of the **ON/OFF**  selector.

Change the selector to **OFF** to keep users from seeing the Blank Page block. Now you can continue developing your app without worrying about users coming upon areas that you haven't finished developing as of yet. Once you are satisfied with your progress, change the selector back to **ON** to publish this portion of your app.<br>


---

# 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.appmachine.com/blocks/blank-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.
