How to implement Courier in angular app and customise inbox size

Open Q&A
,
1

I am trying to integrate courier inbox and toast service in my angular application. When i am tried in normal HTML file with your Dev Docs. it works with your default component themes. I have some doubts 1) how to customize the inbox size in angular app.

and If there is a workflow example in there it will help to reduce development time like below a sample workflow

  1. Use create Brand api --When a brand register in your Organization
  2. use send api- Create a Welcome Notification
  3. create a user in courier to use in app-Push (inbox and toast)

like any integrations flows will help make easy to Onboard Courier
3)

2

Hey there @samsolomonm ,

Thanks for reaching out!

As far as I know, I’m not too sure if the inbox size can be adjusted for your angular app. If you’re using embedded integration you can configure components either inline with HTML or through window.courierConfig.

You’re also able to customize the Courier In-App Toast and Inbox through the brands designer.

3

Hi,
I created the brand via brand designer.
but now,how i integrate the brand with my embedded integration.
i tried the below way… but its not working… default branding was loading…
so how i change the default brand with my custom brand

FYR,

window.courierConfig = {
clientKey: “// myClintKey”,
userId: " // myUserId",
brand: “// myCustomBrand”,
components: {
toast: {
autoClose: false,
defaultIcon: false,
},
inbox: {
title: “Notifications”,
defaultIcon: false,
},
},
};

4

Hi, that integration Worked me after sometime. i changed brand field as brandId.

now i have an another doubt. how to change fonts for inbox and toast based on branding