Skip to content

Customise Layout

Jahid Chetti edited this page Apr 21, 2026 · 1 revision

Customise main page layout

Main page layout

In portalConfig.json (in the layout config) you can define the layout of the perspectives on the main page like this:

{
    "mainPage": {
        "perspectives": [
            {
                "id": "part1",
                "cardsPerRow": 3,
                "perspectives": [
                    "perspective1",
                    "perspective2",
                    "perspective3"
                ]
            },
            {
                "id": "part2",
                "cardsPerRow": 2,
                "perspectives": [
                    "perspective4",
                    "perspective5"
                ]
            }
        ]
    }
}

The perspectives here can now also be dummy-internals.

Then in your locale you can do this to add your text:

{
    "mainPageLayout": {
        "part1": {
            "heading": "test heading",
            "description": "some description text"
        },
        "part2": {
            "heading": "test part"
        }
    }
}

Info dropdown

You can now also add your pages in info-dropdown through config in portalConfig.json by adding them under topBar.infoDropdown.

Footer

Footer images can now also be added in portalConfig.json in the layoutConfig like this:

{
    "footer": {
        "reducedHeight": 44,
        "defaultHeight": 64,
        "images": [
            {
                "id": "ghentcdh",
                "href": "https://www.ghentcdh.ugent.be/",
                "image": "logos/ghentcdh.png",
                "alt": "ghentcdh logo",
                "width": 150,
                "height": 40
            },
            {
                "id": "heldig",
                "href": "https://www.helsinki.fi/en/helsinki-centre-for-digital-humanities",
                "image": "logos/heldig-logo-transparent-black.png",
                "alt": "heldig logo",
                "width": 118,
                "height": 33
            },
            {
                "id": "helsinki",
                "href": "https://www.helsinki.fi/en",
                "image": "logos/university-of-helsinki-logo-transparent-black.png",
                "alt": "University of Helsinki logo",
                "width": 155,
                "height": 40
            }
        ]
    }
}

The path to the image should use the assets directory of the configs as root.

Clone this wiki locally