1. What Does This Page Cover?

3. Overview

4. Pages in Creator

4.1. See How It Works

4.2. Use Case

1. Say you've created a Doorstep Package Delivery application to handle your business.

1. Panels that display aggregate metrics like their total count of orders delivered in a day, due of their current delivery, number of returns that need to be picked up, and more.
2. A gauge to visually check if the delivery representative is achieving their daily target and track progress.
3. An Order Backlogs report to check for undelivered orders due to address detail errors, no-show of customer, and so on.
4. A Verify Delivery form can be embedded to enter the OTP from the customer to close the order.
   
5. A HTML snippet to add a Quick Links table.
6. A bar chart can display completed monthly deliveries to track their year-round performance for bonuses.
   

2. You've created a Zylker Game Management application to conduct and manage one's own playing slots. It also keeps account of the games they participate in that are conducted by others.

The dashboard will have:

1. The name of the logged-in user is displayed in the start of the page using page variables and page script.
2. Panels that showcase the number of upcoming games they are a participant of, the number of games they are conducting, the total games played, their rating as a player, and so on.
3. A search bar that lets them search and filter the different sports that are happening in the upcoming week.
4. An embedded report of the playing slots of the user.

4.3. Navigation Guide for Creation of Pages

4.4. Types of Pages in Creator

1. Blank - Create a page anew and customize it by including all the different elements that Creator offers to build a live and dynamic view for your applications.
2. From a template - Create a page from a predefined template that Creator offers to suit your business needs.The library of these page templates provides you with 10 different layouts, each using different elements such as panels, charts, embedded reports, forms, and more. Choose one that is most fitting for the purpose that your page serves. You can customize them further, add new elements, or remove existing ones, if deemed unnecessary. 
   

4.5. Elements of a Page

Page Element	Page Element in Live Mode	Description	Scenarios
Panel		A panel is a tile-like container used to display key metrics. Images or icons can also be placed above the metric for visual reference. Panels can be used to display key aggregates like Sum, Count, Average, and more using the data added in any of the applications present in a Zoho Creator account.	In an Order Management application, a panel can be configured to display: Average Order Cost for a selected region Maximum Invoice Value for the week
Chart		A chart is a graphical representation of the data in an application. The chart gallery provides a large variety of chart types including column charts, bar charts, and more. They represent patterns and trends comprehensively, and also help in drawing quick comparisons.	In a Project Timeline Dashboard, a chart can display the number of Ongoing projects, New, and Finished projects according to the different departments.
Gauge		A gauge might visually represents a goal/target and how your business metric is progressing towards that goal/target. It can also be used as an indicator that displays a predefined state/range.	In an Employee Dashboard, a gauge can be used to display: Revenue performance for the year-to-date or other marketing and sales goals. A sales metric can be represented as poor, average or good sales; where poor, average and good are the ranges or states.
Search		The search element in a page enables your users to search for data across the applications in your Zoho Creator account. The search results are shown by filtering the data stored in your application using the search input.	In an In-House Doctors page, when a search element is included, it helps you search for doctors whose specializations will be displayed in an All Doctors report.
Form		A form can be embedded in a page from any of the applications in your Zoho Creator account. You can also embed it as a button which when clicked, will open the form.	In an Asset Management application, an Add Asset form can be embedded alongside an All Assets in Possession embedded report. Every time a user submits the form, the records are appended in the report.
Report		A report can be embedded in a page from any of the applications in your Zoho Creator account. You can embed a report into the page to view a detailed account of highlighted findings in the data.	In a Payroll Dashboard, a report that displays the pay slip history of the employee can be embedded in their dashboard.
Snippets		Snippets are used to embed chunks of code that let you add your own tools/elements to a page and not be confined to the predefined elements we offer. Some of their uses are to insert creative tables, fetch and list specific data from reports, add headers with dynamic values from a form, and more. The three kinds of snippets Creator offers to create customized elements are: ZML Snippet- Use Zoho Markup Language and Deluge to render snippets in all devices. HTML Snippet- Use HTML and Deluge to render snippets in web applications. Embed - Insert external media like images, videos, or other links using their iframe embed codes. Note: ZML snippets are rendered in all devices by default.  For HTML snippets, you need to write responsive codes for each device (except for web) separately if needed, for it to be rendered.	In a Project Management application, a live timer can help you track the duration you take to finish your tasks. Tracking this timeline helps you manage your time and effort more efficiently. A HTML snippet could be used to insert this live timer.
Button		Buttons are used to perform a specific function on click by associating actions to it. You can choose from the pre-defined button actions such as opening reports or executing workflows, or add your own custom action to the button.	In an online drugstore, Zylker, a page might display various sections of drugs and products (Cosmetics, Child Care, Mother Care, Oral Supplements, etc). A Shop Now button can be embedded in each section that, when clicked on, redirects to the broad page that displays all related products for shopping.
Widgets (Available only in the paid plans of Creator)		Widgets enable you to create and customize niche features, extend interface customization beyond the built-in features, and also incorporate third-party apps into your pages. They boost your control over the front-end design of your application and help you mirror the uniqueness of your brand.	A live tracking widget can be inserted in the Delivery application's Customer Dashboard. This will allow them to track the position of the delivery representative on a map. In a Ticket Booking platform, after you've filled out information using a form, you are redirected to a page where a timer displays the time left to complete payment. This live timer can be inserted using widgets.
Viewer (Available only in the paid plans of Creator)		Viewer enables you to use your mobile's camera to scan a marker for your AR sets. The output can be wholly seen on your application's page. You can move the device to get a better view.	A viewer can help you to include try-it-outs in an online Furniture Store. You can scan a place using your mobile and let the AR viewer help you visualize the product in that space.

4.6. Customize the Outlook of Page

Icon	Icon Name	Description
	Themes	Setting a theme for your application applies the chosen theme to all the components of your application including your pages. This includes choosing a layout, setting a color, choosing a font, and more.
	Sections	Manage the sections of your pages, set icons that make them look distinct, and much more.
For browser: For phone/tablet:	Page Layout Customization	Define the alignment of page elements with each other and the way they are displayed. You can either choose to show them as separated cards or as attached sections. This option is available for the UI of browser, phone, and tablet. In a browser's UI, you can set margin value on all four sides in pixels. For a phone or tablet's UI, you can choose a suitable layout that decides the arrangement of the page elements.

1. Using the styling options provided while configuring page elements such as charts, gauges, search, and more.
2. Using the ZML editors provided while configuring page elements such as  panels and buttons.
3. Inserting styled snippets and widgets that add more visual appeal.
   

5. Points to Note

1. Users added to an application with a permission set that includes Access permission for specific pages will be able to view them.
2. Page variables can be used to perform custom tasks inside your pages, such as loading data based on the login user. For example:
1. The name of the user can be displayed at the top.
2. The number of hours an employee has worked for in a week can be displayed.
   

6. Related Topics

1. Create and Manage Pages
2. Configure Layout Customization for a Page
3. Understand Page Builder