How do I add avatar URLs or images in an in-app notification?
Is there any documentation for this?
Here is the one, I could find but it's incomplete:
https://docs.novu.co/notification-center/client/react/get-started#use-your-own-backend-and-socket-url
Novu
React Get Started - Novu
Learn how to add novu powered In-App notification center to your React app
8 Replies
Hi @David 😎, I'm an AI assistant for Novu. While a team member reviews this question, I'll see if I can find relevant sources for your question.
-----------------------------
While I generate an answer, here are some sources that might be helpful:
* React Get Started
* Deploy with Docker
* API Reference
* Vue
-----------------------------
Answer
To add avatar URLs or images in an in-app notification, you can follow these steps:
1. Enable Avatar in the Workflow:
In your Novu dashboard, you can enable the "Add an Avatar" button in the In-App channel configuration. This allows notifications to show a default avatar (1) .
2. Using Variables in Avatar URL:
You can configure the avatar using variables, allowing dynamic URLs based on the payload. However, there may be an issue if variables in the avatar URL field are not working as expected (2) .
Here are some references from the documentation that might be helpful:
- React Get Started (3)
- How to build dev.to In-App Notification System in 20 minutes - Novu (1)
Please check these sources for detailed instructions and examples.
Glad I could be helpful. Feel free to create a new thread with any new questions you may have.
@David 😎
Did above response by
Ask Inkeep helped you?Yes, I think I've seen the answer in one of the recommended articles.
If I have any further questions, I'll reply to this post and tag you.
Thanks 🙂
@Pawan Jain @sumitsaurabh927
Please, how do I update the avatar URL directly from a trigger?
Do, I need to pass it as a payload cos it's not working.
cc: @Pawan Jain
@David 😎
I think it is the same issue as in other support post
https://discord.com/channels/895029566685462578/1252567927501357096/1252857600207224893
Can we continue there?