Skip to content

Customize the default theme

Steve Lebleu edited this page Feb 23, 2024 · 12 revisions

This section describes how to customize your branding by overriding the default theme provided by Cliam.

It's useful when you don't compile your template yourself, and don't have templates defined at the web API provider side.

ℹ️ Default templates are limited to the default transactions available.

In the .cliamrc.js file, fill in the placeholder property. Each of these fields is required when you're using default templates.

  "placeholders": {
    "company": {
      "name": "My Company",
      "url": "https://www.my-website.com",
      "location": {
        "street": "Baker street",
        "num": "221B",
        "zip": "NW1 6XE",
        "city": "Marylebone",
        "country": "United Kingdom"
      },
      "email": "contact@john-doe.com",
      "phone": "+44 20 7224 3688",
      "socials": [
        {
          "name": "github",
          "url": "https://github.com/steve-lebleu/cliam"
        }
      ]
    },
    "theme": {
      "logo": "https://cdn.konfer.be/images/cliam/assets/logo-cliam.png",
      "primaryColor": "5bd1d7",
      "secondaryColor": "348498",
      "tertiaryColor": "004d61",
      "quaternaryColor": "ff502f"
    }
  },

That's all ! Now to use the default templates, you just need to provide a data property without any template defined on your transporter.

Indeed, when you don't provides templates in cliamrc.js, and you don't pass any content, the system fallback on default templates and try to compile them on the fly.

👉 See default transactions for more information about what's available in basic setup.

Discuss on Slack

Clone this wiki locally