Novu•5mo ago

layoutIdentifier override not working

Hi, I am overriding the layoutIdentifier when triggering a workflow. When I get the email the desired layout is not applied. This only happens for the code first workflows I have defined. For the ones created from the dashboard the layout is correctly applied when I use the layoutIdentifier override. Here is the trigger information: curl -X POST 'https://api.novu.co/v1/events/trigger' \ -H 'Authorization: ApiKey NOVU_SECRET_KEY' \ -H 'Content-Type: application/json' \ -d '{ "name": "some-workflow", "to": { "subscriberId": "2" }, "payload": { "name": "Name 2", "updatedBy": "Dragan" }, "overrides": { "layoutIdentifier": "test-layout" } }'

12 Replies

Ask Inkeep•5mo ago

Hi @Dragan, 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: * Layouts * Mailersend * Pushpad * SendGrid -----------------------------

Ask Inkeep•5mo ago

Answer To override the layout during a trigger event, you can use the layoutIdentifier property in the overrides object. (1) Here's an example of how to use the layoutIdentifier override:

import { Novu } from "@novu/node";
const novu = new Novu("<NOVU_API_KEY>");
novu.trigger("workflow-identifier", {
  to: {
    subscriberId: "<SUBSCRIBER_ID>",
  },
  payload: {
    attachments: [
      {
        file: fs.readFileSync(__dirname + "/data/test.jpeg"),
        name: "test.jpeg",
        mime: "image/jpg",
      },
    ],
  },
  overrides: {
    layoutIdentifier: "your-layout-identifier",
  },
});

import { Novu } from "@novu/node";
const novu = new Novu("<NOVU_API_KEY>");
novu.trigger("workflow-identifier", {
  to: {
    subscriberId: "<SUBSCRIBER_ID>",
  },
  payload: {
    attachments: [
      {
        file: fs.readFileSync(__dirname + "/data/test.jpeg"),
        name: "test.jpeg",
        mime: "image/jpg",
      },
    ],
  },
  overrides: {
    layoutIdentifier: "your-layout-identifier",
  },
});

The layout specified will be used for all emails in the context of that trigger event. However, it's important to note that the override layout on trigger functionality is only available on v0.19.0 and later versions. Your curl command seems to be using the correct structure for the override. If you're experiencing issues with code-first workflows but not with dashboard-created workflows, it might be related to how the workflows are defined or how they interact with layouts. Since I don't have specific information about your code-first workflow implementation or the exact version of Novu you're using, I can't provide a definitive answer. If the issue persists, you might want to double-check your workflow definition and ensure you're using a compatible version of Novu. If you need further assistance, I suggest clicking on the "Ask for help" button to tag a team member who can review your specific setup and provide more tailored advice.

Sources [1] Layouts

Ask Inkeep•5mo ago

Feel free to tag @Ask Inkeep with additional questions.

Dima Grossman•5mo ago

Hi @Dragan for code first workflows, layouts are not applied. Layouts can be managed an reused from your code. In case you are working with React Email, it's as simple as reusing a react component. Layout overrides and management in the UI, is only relevant for legacy UI based workflows

DraganOP•5mo ago

@Dima Grossman I am using NodeJs. So I can only send the body from the workflow. Am I able to have a <head> tag in any way? (I want to load something there)

Dima Grossman•5mo ago

Using the @novu/framework definition? the body returned from the step can have the whole HTML content including the head

DraganOP•5mo ago

yes, I'm using @novu/framework. Ok, i'll try that out Here's what I have so far when loading a stylesheet in the head tag: For code first workflows (I send the entire html as the body): - In the preview in the dashboard I can see the styles applied - When I get the email the styles are missing For UI created workflows: - The styles are applied both in the preview and in the actual mail

Novu_Bot•5mo ago

@Dragan, you just advanced to level 2!

Dima Grossman•5mo ago

Do you have an example you can share of an html body sent?

DraganOP•5mo ago

<html> <head> <link rel="stylesheet" href="https://unpkg.com/primeflex@latest/primeflex.css"> <style> .logo { height: 100px; width: 200px; } </style> </head> <body> <div class="grid"> <div class="col-6 flex align-content-center flex-wrap"> <div class="text-left p-3 font-bold text-3xl"> Your updates </div> </div> <div class="col-6 flex justify-content-end flex-wrap"> <img class="p-3 logo" src="https://upload.wikimedia.org/wikipedia/commons/f/f3/Seal_of_Los_Angeles.svg"/> </div> </div>
<div class="pl-3 pb-3">Hello </div> <div class="pl-3">Information...</div>

<div class="grid"> <div class="col-12"> <div class="text-left pl-3 border-round-sm bg-primary font-bold"> City of LA </div> </div> </div> </body> </html> any updates on this?

Dima Grossman•5mo ago

@Pawan Jain do we have any updates on the styling and embeds of css sheets? I saw a similiar ticket on this a few days back.

Pawan Jain•4mo ago

@Dragan Apologies for missing this. I wan to check if you are still facing this issue?

Gaming

Programming

layoutIdentifier override not working