Custom homepage with tabs like Proj 1, Proj 2 showing different layouts & data

Collapse
X
 
  • Time
  • Show
Clear All
new posts
  • IshitaRana
    Junior Member
    • Apr 2025
    • 16

    #1

    Custom homepage with tabs like Proj 1, Proj 2 showing different layouts & data

    Hi,

    I'd like to create a custom page in EspoCRM that acts as a homepage after user login. On this page, I want to display tabs like "Project 1", "Project 2", etc., and based on which tab the user clicks, it should:
    • Show different sets of data.
    • Load different layouts (e.g., fields shown or view arrangement) depending on the selected project.

    I have a few specific questions:
    1. Is there a way to define such a custom view with tabs that conditionally renders content/layout?
    2. How can I register this view?
    3. Can this page be set as the default landing page after login for users (without modifying core files)?
    4. If I use layout sets, can they be dynamically applied based on the selected tab or project?
    Has anyone implemented something similar or can point me in the right direction?
  • yuri
    Member
    • Mar 2014
    • 9196

    #2
    Hello,

    It's not a trivial task.

    The default home page can be defined the following way.


    custom/Espo/Custom/Resources/metadata/clientDefs/Home.json

    Code:
    {
        "view": "custom:views/my-custom-home-view'
    }

    client/custom/src/views/my-custom-home-view.js
    Code:
    define(['view'], (View) => {
    
        return class extends View {
    
            templateContent = `
                // Hello
            `
    
            setup() {}
          
            afterRender() {}
        }
    });
    Applying layout sets is possible but programmatically. One would need to fetch the layout set some how before applying it to the record view.

    When creating a views/record/detail (or edit), it's possible to pass the layout data in the detailLayout parameter.
    If you find EspoCRM good, we would greatly appreciate if you could give the project a star on GitHub. We believe our work truly deserves more recognition. Thanks.

    Comment

    Working...