# Generic Tools

**Generic Tools** are a set of common utility controls that appear on a **component** when it is selected or hovered over in **Page Designer**.\
These tools are available across both **Web Pages** and **Mobile Pages** and provide quick access to essential actions such as moving, editing, duplicating, connecting data, translating, and deleting components.

***

#### Generic Tools Overview

The image below illustrates the Generic Tools icons and their positions on a selected component.

<figure><img src="https://2015371994-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FMpDjHWFRUtZ5nJcSfVXd%2Fuploads%2FB4w3sr7Zk9IUwyG20snU%2F1?alt=media" alt=""><figcaption></figcaption></figure>

***

### Generic Tool Functions

#### Drag Handle

Used to **drag and move** the selected component to a different location on the page.

<figure><img src="https://2015371994-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FMpDjHWFRUtZ5nJcSfVXd%2Fuploads%2F2sb5rDQbSMC1zIoZzHnd%2F2?alt=media" alt=""><figcaption></figcaption></figure>

***

#### Parent Container

Used to **select the parent container** of the current component.\
This tool helps users **navigate upward through the layout hierarchy**, especially when working with nested containers, rows, or grids.

<figure><img src="https://2015371994-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FMpDjHWFRUtZ5nJcSfVXd%2Fuploads%2FxkDSZo5e9wVaac4qXTEf%2F3?alt=media" alt=""><figcaption></figcaption></figure>

***

#### Duplicate

Used to **copy and duplicate** the selected component.\
This is useful when creating multiple components with similar structure or configuration.

<figure><img src="https://2015371994-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FMpDjHWFRUtZ5nJcSfVXd%2Fuploads%2Fxq66Zn8SUDFPtWQfkKN8%2F4?alt=media" alt=""><figcaption></figcaption></figure>

***

#### Edit

Used to **edit or change the content** of a component.\
This tool is typically available for **text‑based components**, such as:

* Label
* Text
* Paragraph

<figure><img src="https://2015371994-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FMpDjHWFRUtZ5nJcSfVXd%2Fuploads%2FZCBO8HtFatMhFPtm1gzR%2F5?alt=media" alt=""><figcaption></figcaption></figure>

***

#### Connect to Data

Used to **connect a component to a data source** in order to create **dynamic content**.\
Supported data sources include:

* Microflow
* Store
* Local database (for Mobile Pages)

<figure><img src="https://2015371994-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FMpDjHWFRUtZ5nJcSfVXd%2Fuploads%2F8umw0eiExRck36RrMj8T%2F6?alt=media" alt=""><figcaption></figcaption></figure>

***

#### Translation

Used to **map component text to a translation key**, enabling **multi‑language support** in the page.

<figure><img src="https://2015371994-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FMpDjHWFRUtZ5nJcSfVXd%2Fuploads%2FuMzxxcENT33iyB2bJmki%2F7?alt=media" alt=""><figcaption></figcaption></figure>

***

#### Delete

Used to **remove the component** from the page entirely.\
Once deleted, the component is removed from both the page canvas and the page structure.

<figure><img src="https://2015371994-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FMpDjHWFRUtZ5nJcSfVXd%2Fuploads%2F8umw0eiExRck36RrMj8T%2F6?alt=media" alt=""><figcaption></figcaption></figure>

***

### Summary

**Generic Tools** are the most frequently used controls in Page Designer.\
They allow users to:

* Move and reorganize components
* Navigate layout hierarchy
* Duplicate reusable elements
* Edit content efficiently
* Bind components to data
* Support multi‑language UI
* Remove unnecessary components

Mastering these tools significantly improves **design speed, accuracy, and usability** when building pages in ONEWEB.


---

# 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.onewebstack.com/designer-reference/page-designer/page-designer-tools/generic-tools.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.