Customizing Module View Using the all-new Canvas design suite

Customizing Module View Using the all-new Canvas design suite

Businesses and data are cohesive entities that exist and grow together. The more people you meet and transactions you make, the more information you're going to accumulate in your database—so it's important to keep your growing database clean and accessible.

Zoho CRM offers three types of module views so you can organize data based on your requirements: list view, Kanban view, and canvas view. Read this article to learn more about module views.

  1. The list view is a systematic tabulation of your data sorted based on specific criteria. It displays records as line items and enables you to manage, freeze, and navigate across columns in a module. Click here to learn more about list view.
  2. The Kanban view is a productivity-based view that enables you to classify your records based on different fields, like lead source, status, industry, and so on. It's especially beneficial if you want to monitor progress or index records based on a particular attribute. Click here to learn more about the Kanban view.
  3. The Canvas view is a dynamic orientation of your records created using our bespoke Canvas builder. You can incorporate different graphic and design elements to your records in module view to suit your brand guidelines and ad hoc accessibility. It offers customization in three layouts—custom list view, tile view, and table view—to sculpt your view according to your data type.

 In this article:


Types of Canvas views

Canvas offers three types of module view orientations to accommodate data of different types.

Custom list view

The custom list view enables you to stack records horizontally, one above the other. The space each row provides can comfortably and prominently display your business logo, lead images, lead information, buttons, and more. This view is clutter-free and suitable for storing information about your customers and CRM users in tandem.

Tile view

As its name suggests, the tile view displays records as tiles. With its finite span, modules like accounts, products, or contacts that require a showcase of records become befitting. These tiles are closely knit, that looks like a product line up, by itself. You can adjust the shape of the tile to be a square or a rectangle.

Table view

Like the list view, the table view is a tabulation of records, except it provides users with the ability to add colors to the rows. You can add one color to all rows or alternate between rows.

Business scenarios

Schools and real estate firms: One important asset that educational institutions have is their student databases. These institutions need to be able to see the information of all students listed systematically, and one viable option is to use the tile view, which enables users to view records in a way that makes them easy to distinguish and access.
The same view is also useful for showcasing real estate properties, whereby customers can view a neatly organized array of properties, each with an image and other important details. Click here to learn more about portals in Zoho CRM.

Lead information: One of the main activities one does in a CRM system is lead management. It's important to understand your leads' requirements, personas, and so on. Using the custom list view, you can orient your leads in such a way that you get useful information about your leads at a glance. With the custom list view, you can add the lead's image, as well as basic information like their name, email address, mobile number, lead source, tags, scores, lead status, activities, visit score, record owner, and so on—all in a view that minimizes clutter.


Inventory management: Businesses can only run smoothly if they manage their inventories effectively. Inventory management means continually assessing demand and managing stock so that you never run out of a hot-selling product. But that means inventory managers need to know what they have in stock and how much—with a high degree of accuracy. Thanks to its spreadsheet-like structure, the table Canvas view is a perfect fit for this kind of data, as it fits the screen and can display large quantities of data.

Availability

Permission required
Administrators and users with Manage Custom View permission can create/edit a Canvas.


Canvas module view builder: a quick look

Canvas is Zoho CRM's cutting-edge design studio that enables you to create and present your data in a more organized way. It's loaded with sophisticated design elements that are simple to view and straightforward to use.
While you can customize both the record details page and module views using the Canvas builder, this article is about customizing module views using Canvas.
The list view builder is made up of the following building blocks:
  1. Data: Contains CRM fields, related lists, buttons, and actions available in the selected module. With a simple drag and drop, you can place fields in wherever you want on the canvas.
  2. Elements: Includes sections, text boxes, tabs, tables, images, icons, lines, and buttons with which you can compartmentalize your data in your canvas.
  3. Style: Adds aesthetic value to your data and elements. Set background colors and borders, tweak radiuses, add shadows, and adjust padding and margins. You also have the option to customize the font type and color for both static and on-hover text.

How to work with Canvas

As discussed before, the canvas builder is a straightforward design tool with the following components: data, elements, and style. You can create templates from scratch or build upon pre-designed templates from our gallery. Upon opening a canvas, you can add components to a template via a simple drag-and-drop interface, and apply styles by selecting the placeholder data in the canvas.

Let's look at how you can create a canvas template:

Create canvas templates as an admin

  1. Log into your CRM organization with your administrator credentials.
  2. Go to Setup ⚙ > Customization > Canvas > List View.
  3. Select the Create New List Page button on the right.

  4. In the Create your own customized list page pop-up, select a module and the type of canvas view you'd like to create.
    Take a quick peek at the view by clicking the preview link.
  5. Click Create.
  6. On the Select Template page, you can either select a pre-defined design from the gallery or create a blank template.
    1. For pre-defined templates, you can choose the desired design from the list, preview it, and click Select.

    2. To create a new canvas from scratch, click Create Blank Template button.
    3. Additionally, if your organization has saved templates already, you can select them from My Organization Canvas and repurpose them.
  7. Upon entering the canvas page, do the following:
    1. Enter a name for your canvas creation. Example: Lead list - custom list view.
    2. Based on the canvas type, a white/blank canvas will appear. You can add colors, gradients, or an image as your background, per your desire.
      1. Go to the Style option in the Edit console.
      2. Under Normal, select a background color from the palette. You can also choose from advanced colors in the palette.
        This will become the background of the canvas. Especially for custom list views and tile views, the chosen background will be applied for all records in the module view.
      3. To set an image as the background:
        1. Select the Image check box and upload a new image from your desktop, choose from the library, or add an image URL.

        2. The image you selected as the background will be added to the canvas in the contain style. You can also keep it at its original size, or cover the entire canvas background.

        3. You can also choose the direction in which the image repeats on the canvas, if at all: horizontally, vertically, or both.

      4. To apply a gradient, select the Gradient checkbox.
        1. Select the gradient direction by rotating the gradient roller.
        2. Click on the gradient nodes present on the either side of the gradient bar to select the desired color for your gradient.
        3. Drag the nodes left and right to adjust the strength of the gradient.

      5. Select the Padding and enter values to adjust the cushion space.


      6. Also, you can adjust the scale of the canvas by setting its height and width.

      7. Similar settings can be configured for the canvas background when on mouse hover.

    3. To compartmentalize your canvas space using elements:
      1. Click Elements from the edit console.
      2. Drag and drop the desired elements like sections, text boxes, images, icons, and lines from the tray into the canvas.
      3. Furthermore, you can select and apply styling over an element to customize it as desired.

    4. To add data to your canvas:
      1. Click Data from the edit console.
      2. Drag and drop the desired fields and actions present in that module where you want them on the canvas.
      3. You can also apply styling elements like font type, size, color, orientation, type case, prominence, label alignment, text background, and more to each piece of data by clicking on it.
  8. Upon completion, click Save to save the template.
    Using the methods above, you can create canvas creations for other views, as well.
Note: A module can have only one template created for each canvas view.

Managing canvas templates as an admin

All the templates created for an organization will be displayed as line items on the canvas page. The page's list view tab contains module views, and the details page contains templates created for record detail pages.

In the list view tab, an admin can perform the following actions:
  1. Create new list view page templates

  2. Sort templates based on modules and views

  3. Manage canvas rules
  4. Clone, preview, edit, or delete templates
  5. Activate or deactivate templates

Switch between different module views

Users can choose from the following module views according to their preferences: list view, Kanban view, and canvas view.

To switch between module views:
  1. Go to the desired module and click on the module views icon at the top-right corner of the page.
  2. From the dropdown menu, select a desired view for your records. The options are list view, Kanban view, canvas custom list view, tile view, and table view.

Quick hacks to work with Canvas easily

By now, you've probably realized how simple it is to work with Canvas. However, you can still make it easier via the following pointers:
Create templates quickly: If you haven't created a particular view for a module yet, you can create one directly from the module itself. To do so, follow these steps:
  1. Click the module view button at the top-right corner of the page.
  2. Select the desired canvas view for which you haven't yet created a view.
  3. On the following page, click Create view. This will directly take you to the Canvas builder.
  4. Add data quickly: Instead of searching and dragging desired fields from the data component, you can simply right click on the template, go to insert, and then click field or action.

  5. Create conditional styling: You can determine the criteria and change the styling of a particular component, such as a font size change, color change, and so on.

  6. Mark a component fixed/fluid: If you mark a component to be fluid, the component will render the entire span of the text in the output. If you mark it fixed, irrespective of the character count, the text will be constricted to the defined length, sometimes clipping the tail end of the text.
  7. Copy/paste style: Instead of formatting a particular style repeatedly, you can copy the style and apply it to the component(s) you want to format. Right-click on the style you want to copy and click copy style. Then select the component you want to replicate the styling for, right-click on the component, and click paste style.
  8. Lock a component: Locking a component will make it easier to edit the template by keeping the component in place while you make adjustments.
  9. Hide/show label: A label is a field's name. You can choose to display a field's name or just its values while. This is a great way to maximize space in your template.
  10. Format label alignment: You can choose the text alignment for text boxes, namely left, center, or right.

More assets on Canvas in Zoho CRM:
LMS course: Canvas in Zoho CRM

Browse through a list of certified canvas designers available in your country here.

    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 CRM Training
        Redefine the way you work
        with Zoho Workplace

          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 CRM Training

            Create, share, and deliver

            beautiful slides from anywhere.

            Get Started Now


              Zoho Sign now offers specialized one-on-one training for both administrators and developers.

              BOOK A SESSION






                          Quick Links Workflow Automation Data Collection
                          Web Forms Enterprise Begin Data Collection
                          Interactive Forms Workplace Data Collection App
                          Offline Forms Customer Service Accessible Forms
                          Digital Forms Marketing Forms for Small Business
                          HTML Forms Education Forms for Enterprise
                          Contact Forms E-commerce Forms for any business
                          Lead Generation Forms Healthcare Forms for Startups
                          Wordpress Forms Customer onboarding Order Forms for Small Business
                          No Code Forms Construction RSVP tool for holidays
                          Free Forms Travel
                          Prefill Forms Non-Profit

                          Intake Forms Legal

                          Form Designer HR

                          Card Forms Food
                          Assign Forms Photography

                          Translate Forms Real Estate
                          Electronic Forms

                          Notification Emails for Forms Alternatives
                          Holiday Forms Google Forms alternative 
                          Form to PDF Jotform alternative





                                            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.




                                                Manage your brands on social media

                                                  Zoho Desk Resources

                                                  • Desk Community Learning Series


                                                  • Digest


                                                  • Functions


                                                  • Meetups


                                                  • Kbase


                                                  • Resources


                                                  • Glossary


                                                  • Desk Marketplace


                                                  • MVP Corner


                                                  • Word of the Day


                                                    Zoho Marketing Automation

                                                      Zoho Sheet Resources

                                                       

                                                          Zoho Forms Resources


                                                            Secure your business
                                                            communication with Zoho Mail


                                                            Mail on the move with
                                                            Zoho Mail mobile application

                                                              Stay on top of your schedule
                                                              at all times


                                                              Carry your calendar with you
                                                              Anytime, anywhere




                                                                    Zoho Sign Resources

                                                                      Sign, Paperless!

                                                                      Sign and send business documents on the go!

                                                                      Get Started Now




                                                                              Zoho TeamInbox Resources



                                                                                      Zoho DataPrep Resources



                                                                                        Zoho DataPrep Demo

                                                                                        Get a personalized demo or POC

                                                                                        REGISTER NOW


                                                                                          Design. Discuss. Deliver.

                                                                                          Create visually engaging stories with Zoho Show.

                                                                                          Get Started Now









                                                                                                              • Related Articles

                                                                                                              • Customizing Record Detail Page Using Canvas

                                                                                                                The canvas list view provides ways to customize the record display in the module list. You can add record images, use custom buttons to represent fields, use specific font style or size for the field labels, change the alignment of field types and ...
                                                                                                              • Canvas in sandbox

                                                                                                                You can redesign the interface of record detail pages and list view pages using Canvas. You can ensure the interface presented to a user is relevant to that user's work and dynamically styled based on the data present in a record. This goes a long ...
                                                                                                              • Canvas Record Form

                                                                                                                Overview Canvas Record Form enriches Zoho CRM by introducing an advanced level of customization for record creation. This integral part of the Canvas design suite enables users to design forms that are not only functionally comprehensive but also ...
                                                                                                              • FAQs on Canvas

                                                                                                                1. What is Zoho CRM Canvas and why do I need it? Zoho CRM is a powerful system that houses all of your key business data including customer information, employee details, business contracts, sales activities and so on. It helps you streamline ...
                                                                                                              • Using Zoho Finance Suite Integration

                                                                                                                Some content may only be available to specific users. Viewing the finance suite integration modules Once you have integrated the Zoho Finance Suite into Zoho CRM, you will be able to do the following actions for each of the Zoho Finance applications. ...
                                                                                                                Wherever you are is as good as
                                                                                                                your workplace

                                                                                                                  Resources

                                                                                                                  Videos

                                                                                                                  Watch comprehensive videos on features and other important topics that will help you master Zoho CRM.



                                                                                                                  eBooks

                                                                                                                  Download free eBooks and access a range of topics to get deeper insight on successfully using Zoho CRM.



                                                                                                                  Webinars

                                                                                                                  Sign up for our webinars and learn the Zoho CRM basics, from customization to sales force automation and more.



                                                                                                                  CRM Tips

                                                                                                                  Make the most of Zoho CRM with these useful tips.



                                                                                                                    Zoho Show Resources