askvity

How to Use HTML in Zoho Creator

Published in Zoho Creator HTML 3 mins read

To use HTML in Zoho Creator, you typically add it to a page using an HTML Snippet. This allows you to embed custom content, styling, or external elements directly within your page layout.

Here are the exact steps to add and use an HTML snippet on a page in Zoho Creator, based on the provided reference:

Steps to Add an HTML Snippet

Embedding custom HTML on your Zoho Creator page is a straightforward process using the dedicated HTML Snippet element. Follow these steps:

  1. Edit your app: Navigate to the Zoho Creator application where you want to add the HTML.
  2. Navigate to the Design tab: Once inside the app editor, go to the 'Design' tab. This is where you manage the layout and components of your pages.
  3. Open the page builder: Select the specific page where you intend to place the HTML content. The page builder interface will load.
  4. Drag and drop the HTML Snippet:
    • In the page builder, look for the 'Snippets' section on the left-hand side panel.
    • Locate the HTML Snippet element within the list of available snippets.
    • Click and drag the HTML Snippet and drop it onto the desired position on your page layout. A container for your HTML will appear.
  5. Add the required HTML code:
    • Click on the HTML Snippet you just added to open its configuration options.
    • You will find an area or editor where you can paste or write your HTML code.
    • Add the HTML content you want to display on your page here. This could include anything from simple text formatting and images to embedded videos, iframes, or custom CSS within <style> tags.
  6. Click Save and close the editor: After adding your HTML code, save the changes within the snippet's editor and then save the changes to the page layout itself.

Once saved, the HTML code you added within the snippet will be rendered on the page when users access it.

What Can You Do with HTML Snippets?

Using HTML snippets provides flexibility to enhance your Zoho Creator pages beyond the standard drag-and-drop elements. You can leverage them for:

  • Adding custom styling or formatting that isn't easily achievable with theme options.
  • Embedding external content like videos from platforms like YouTube, Google Maps, or other websites using <iframe> tags.
  • Creating unique visual elements or layouts using standard HTML tags.
  • Including custom JavaScript (within <script> tags) to add dynamic behavior, though complex scripting might be better handled via Page Load or field actions where appropriate.

HTML snippets are a powerful tool for customizing the look and feel of specific sections on your Zoho Creator pages.

Related Articles