Understanding portal pages
This help page is for Creator 6 users with portals created after June 1, 2026.
- For portals created earlier, refer to this document to learn about the older version of portal page customization.
- If you are on Creator 5, refer to this document. Know your Creator version.
In a nutshell
Portal Pages are the building blocks of your portal. They help you create a user-friendly, customized interface tailored to your audience while reinforcing your brand identity. You can use the four default pages, Sign In, Sign Up, Create Password, and Reset Password, or create custom pages to suit your needs. Each page can be designed for a specific purpose, such as onboarding users, sharing information, guiding navigation, or enabling actions. Together, these pages ensure a consistent and visually cohesive journey across every user touchpoint, supporting external users at each stage of portal access.
Availability
- Portal Pages can be created in all paid plans of Creator.
- Only the super admin, admins, and developers can create and manage portal pages.
1. Overview
Zoho Creator Portal Pages enable you to build and manage portal interfaces for your external users. They help you structure your portal, configure layouts, and manage content blocks. With both prebuilt (default) and customizable pages in a unified framework, you can design user-facing pages, create new ones, and maintain a consistent interface aligned with your brand and use cases, without relying on external tools.
You can also create portal pages using Zia, Zoho’s AI assistant, by providing prompts or reference images, making it easier to quickly design and add content to pages that match your requirements. From essential access pages, such as login, signup, and password reset, to fully customized pages tailored to your business needs, Portal Pages help you deliver a cohesive, visually appealing, and engaging portal at every touchpoint.
2. Use cases
Let’s consider an academic institution that uses Zoho Creator to build an all-encompassing portal for students, faculty, and applicants. Using portal pages, they can design a complete and structured experience tailored to different user needs, such as onboarding applicants, providing resources for students, and enabling interactions for faculty, all within a consistent and branded interface.
- Home Page: Showcase featured courses, program highlights, faculty achievements, and important announcements.
- Admissions Page: Provide details about application processes, eligibility criteria, deadlines, and required documents for prospective students.
- Course Catalog Page: Display available courses with descriptions, schedules, and faculty information.
- Student Dashboard: Offer a personalized space for students to track enrolled courses, assignments, grades, and notifications.
- Faculty and Research Page: Highlight faculty profiles, research work, publications, and contact details.
- Events and Announcements Page: Share upcoming seminars, workshops, campus events, and important updates such as exam schedules, results, or policy changes.
- Support/Help Page: Provide FAQs, contact details, and support resources for students and applicants.
This approach ensures a structured, engaging, and consistent portal throughout the entire student journey. By using Zoho Creator’s Portal, the institution can build a complete, website-like interface while reducing reliance on external tools.
3. Navigation guide to portal pages
Navigate to DEPLOY > Portals in the left panel, select your portal, and open the Portal Pages tab on the right. Click Open Builder to start customizing.
4. Portal Pages
4.1. Types of Portal Pages
Portal pages are of two types, default and custom, each serving a distinct purpose in the portal experience.
Default Portal Pages
These are system-generated pages required for user access to the portal, such as Sign In, Sign Up, Reset Password, and Forgot Password. While they cannot be deleted, you can customize their layout and appearance to match your branding and requirements. Learn how to customize your portal pages
Custom Portal Pages
These are pages created by admins to extend the portal experience. They can be used to build landing pages, onboarding flows, or any business-specific content tailored to your use case, allowing you to design a more comprehensive and personalized portal.
Default pages ensure essential portal functionality, while custom pages provide the flexibility to design interactions specific to your audience.
4.2. Portal Page Builder
The Portal Page Builder provides a centralized visual workspace where you can design, structure, and configure portal pages using components and layout controls. It allows you to build portal pages through a drag-and-drop interface by adding components, organizing layouts, and configuring their properties within a structured environment. You can either start from scratch or choose from prebuilt templates to quickly create pages based on your requirements.
The builder interface is divided into several sections that help you construct and manage portal pages efficiently.
1. Top pane - Page controls and actions
The top pane contains controls used to identify the application, manage portal pages, and perform page-level actions.
Element | Description |
Application name | Displays the name of the application to which the portal belongs. |
Portal page dropdown | Allows you to switch between existing portal pages. Pages are grouped into Default and Custom categories for easier navigation. Selecting a page loads it in the builder for editing. |
Create new portal page (+) | Enables you to add and start designing a new portal page. |
Undo and Redo | Revert or restore the most recent changes made in the builder. |
Portal page settings | Opens the settings panel where you can configure page-level properties. |
Save | Saves the changes made to the portal page. |
Close | Exits the Portal Page Builder and returns to the portal module. |
2. Left pane - Components
The left pane lists the components that can be used while designing portal pages. You can drag and place these components into the builder workspace to construct the layout and functionality of the portal page. View all the available components here.
3. Builder workspace
The central builder space is the main design area where portal pages are created and structured. This 'What You See Is What You Get' workspace allows you to arrange components, define layouts, and visually build the portal page as it will appear to users.
4. Right pane - Component properties
The right pane displays the configuration options for the component currently selected in the builder workspace. From here, you can modify properties such as appearance, behavior, and other component-specific settings. View all available common properties and properties specific to certain component.
4.3. Components in a Portal Page
Portal Pages are built using a set of configurable components that allow you to structure content, present information visually, and enable user interactions within the portal. These components can be dragged and dropped from the Components pane and placed within the builder workspace to design the portal page layout.
Component | Description |
Text | Text is used to add written content, such as headings, descriptions, instructions, or informational messages, within the portal. It helps guide users and communicate important information clearly. |
Image | An image is used to display visual content, such as banners, illustrations, or product visuals, on the portal page. It enhances the overall look and helps convey information visually. |
Icon | An icon is a graphical symbol used to represent actions, features, or sections within the portal. It provides visual cues that make the interface easier to understand. |
Canvas | Canvas is a flexible layout container used to organize and arrange multiple components within a section of the page. It helps structure content and manage layout effectively. |
Navigation | Navigation is used to add menus or links that help users move between different pages or sections within the portal. It ensures smooth and intuitive access across the portal. |
Hero Section | A hero section is used to highlight key content at the top of the page. It typically combines text, images, and calls to action to capture attention and communicate important information. |
Forms | Forms are used to collect and submit user input within the portal. They enable interaction by allowing users to provide information directly through the page. |
Footer | The footer appears at the bottom of the portal page and contains supporting links, contact information, or additional navigation options. It provides easy access to secondary content. |
Branding | Branding is used to include elements such as logos or brand visuals within the portal. It helps maintain a consistent and recognizable appearance. |
Text Components | Text components provide structured elements such as headings, subheadings, and paragraphs. They help organize and present content in a clear and readable format. |
Tiles | Tiles display content in a card-like layout that highlights features, actions, or sections. They provide a visually organized way to present information for quick access. |
4.4. Common properties
Most components share a set of common styling and layout properties that help control the appearance and positioning of elements within the portal page.
The rows and columns within each component can also be customized. Row settings include spacing, fill color, edit HTML, and border. Column settings include fill color and border. Column widths can be adjusted by dragging their borders.
Property | Description |
Layout | Layout defines how the component is positioned and aligned within the page. It helps organize elements effectively to maintain a structured and balanced layout. |
Display properties | Display properties determine how the component is rendered on the page. They control the visibility and presentation of the component within the layout. |
Background | Background settings define the visual appearance behind the component. They can be used to apply colors, images, or styles to enhance the look of the page. |
Padding | Padding defines the space between the component’s content and its border. It helps improve readability and spacing within the component. |
Radius | Radius controls the roundness of the component’s corners. It can be adjusted to create sharper edges or smoother, rounded corners. |
Border | Border defines the outline of the component. It can be customized by adjusting the style, thickness, and color to highlight or separate elements. |
Shadow | Shadow adds depth to the component by creating a shadow effect. It helps emphasize elements and improve visual hierarchy on the page. |
4.5. Component-specific properties
Some components include additional properties that are unique to that component type. These properties allow you to configure specific behaviors or visual elements.
Property | Applicable Component | Description |
Font Family | Text | A font family can be selected to define the typeface of the text displayed in the portal. This helps maintain a consistent visual identity and improves readability across different sections. |
Font Weight | Text | The thickness of the text can be adjusted (e.g., light, regular, bold) to highlight important content and create a clear visual hierarchy. |
Font Size | Text | The size of the text can be configured to ensure readability and proper emphasis of content within the portal. |
Text Color | Text | A color can be applied to text elements to match branding guidelines and improve visibility and contrast. |
Text Alignment | Text | Text can be aligned horizontally (left, center, right) to control how content is presented within its container. |
Vertical Alignment | Text | Text can be aligned vertically within its container to ensure proper positioning and balanced layout. |
Padding | All components | Padding can be applied to control the internal spacing between the content and the edges of a component, improving layout and readability. |
Image Source | Image | An image can be uploaded and displayed on the portal page to enhance visual presentation. Images are commonly used for banners, logos, or other illustrative content within the portal. |
Image Fit | Image | The way an image fits within its container can be adjusted to ensure it displays properly across different screen sizes. |
Image Position | Image | The position of the image within its container can be set to control its alignment and focus area. |
Icon | Icon | An icon can be selected from the available icon library to represent actions or sections within the portal. Icons help provide visual cues for actions such as edit, delete, or navigation, making the interface easier to understand. |
Canvas Type | H-Stack, V-Stack | The canvas type can be configured to define how the layout behaves, allowing better control over the overall page structure. |
Align Items | H-Stack, V-Stack | Items within a container can be aligned along the cross axis to control their positioning and maintain a consistent layout. |
Layout Style | H-Stack, V-Stack | The layout style can be set (e.g., row, column, grid) to define how child elements are arranged within the container. |
Overflow | H-Stack, V-Stack | The overflow behavior can be configured to control how content exceeding the container’s boundaries is handled (e.g., hidden, scroll). |
Container Background | Form | A background color or style can be applied to the container to enhance visual separation and match the portal design. |
Container Padding | Form | Padding can be adjusted within the container to control spacing between its content and borders for better layout consistency. |
Container Radius | Form | The corner radius of the container can be modified to create sharp or rounded edges, enhancing the visual appearance. |
Container Border | Form | A border can be applied around the container, with options to customize its style, width, and color for better definition. |
Container Shadow | Form | Shadow effects can be added to the container to create depth and make elements stand out from the background. |
Heading Color | Form | A color can be applied to heading text within forms to distinguish it from other content and improve readability. |
Body Color | Form | The color of body text within forms can be set to ensure clarity and consistency across the interface. |
Field Background Color | Form | A background color can be applied to input fields to improve visibility and distinguish them from other elements. |
Field Border Color | Form | The border color of input fields can be customized to enhance focus indication and visual clarity. |
Placeholder Text Color | Form | The color of placeholder text inside input fields can be set to ensure it is visible yet distinguishable from user input. |
Button Text Color | Button | The text color of buttons can be customized to ensure readability and alignment with the overall design. |
Button Background Color | Button | A background color can be applied to buttons to make them visually prominent and easy to identify. |
Button Border | Button | A border can be applied to buttons with customizable style, width, and color to enhance their appearance. |
Link Color | Link | The default color of links can be set to align with branding and make them easily recognizable. |
Link Text Color | Link | The color of link text can be customized for different states or contexts to improve usability and consistency. |
Menu | Menu | The menu represents the primary navigation component of the portal. It can be enabled or disabled from this section, but creating or modifying menu structure is not supported here. |
Menu item | Menu | Menu items represent individual entries within the menu. The first menu item defines the overall style (such as layout, spacing, and typography), and all other menu items automatically follow this style for consistency. |
5. Related Topics
6. Related Videos
What’s next
Previous step
What’s next
After understanding how to configure portal pages, the next step is to learn about email notifications and how to configure them to keep portal users informed about important updates.
Previous step
Before configuring portal pages, ensure that you're familiar with portals in Zoho Creator. Additionally, make sure you understand portal pages and their core functionalities.
Access your files securely from anywhere
Zoho CRM Training Programs
Learn how to use the best tools for sales force automation and better customer engagement from Zoho's implementation specialists.
Zoho DataPrep Personalized Demo
If you'd like a personalized walk-through of our data preparation tool, please request a demo and we'll be happy to show you how to get the best out of Zoho DataPrep.
- Zoho Workerly Home
- Forums
- Connect With Us:
- Zoho Recruit Home
- Forums
- Connect With Us:
Zoho FSM Video Tutorials
Centralize Knowledge. Transform Learning.
All-in-one knowledge management and training platform for your employees and customers.
New to Zoho Writer?
Create. Review. Publish.
New to Zoho CRM Plus?
Deliver unforgettable customer experiences
New to Zoho CRM Plus?
Deliver unforgettable customer experiences
New to Zoho Marketing Plus?
Everything you need to run your marketing
New to Zoho Marketing Plus?
Everything you need to run your marketing
You are currently viewing the help pages of Qntrl’s earlier version. Click here to view our latest version—Qntrl 3.0's help articles.
New to Zoho Survey?
Zoho Sheet Resources
Zoho Forms Resources
New to Zoho Sign?
Zoho Sign Resources
Sign, Paperless!
New to Zoho TeamInbox?
Zoho TeamInbox Resources
New to Zoho ZeptoMail?
Design. Discuss. Deliver.
New to Zoho Workerly?
New to Zoho Recruit?
New to Zoho CRM?
New to Zoho Projects?
New to Zoho Sprints?
New to Zoho Assist?
New to Bigin?
Related Articles
Understanding portal pages (Deprecated)
This help page is for Creator 6 users with portals created before June 1, 2026. For portals created later, refer to this document to learn about the latest version of portal page customization. If you are on Creator 5, refer to this document. Know ...Customizing portal pages
This help page is for Creator 6 users with portals created after June 1, 2026. For portals created earlier, refer to this document to learn about the older version of portal page customization. If you are on Creator 5, refer to this document. Know ...Customizing portal pages (Deprecated)
This help page is for Creator 6 users with portals created before June 1, 2026. For portals created later, refer to this document to learn about the latest version of portal page customization. If you are on Creator 5, refer to this document. Know ...Accessing and managing Zoho Creator portal account
What does this page cover Learn how to sign up for and sign in to your Creator portal, and manage your account settings, including authentication methods, sessions and profile details. Note: This page is intended only for portal users. Availability ...Configuring Portal
This help page is for users in Creator 6. If you are in the older version (Creator 5), click here. Know your Creator version. What does this page cover This page guides you to create and configure portals in Zoho Creator, including hosting options, ...
New to Zoho LandingPage?
Zoho LandingPage Resources