{"id":343018,"date":"2022-07-08T13:38:15","date_gmt":"2022-07-08T13:38:15","guid":{"rendered":"https:\/\/webkul.com\/blog\/?p=343018"},"modified":"2022-12-19T13:19:33","modified_gmt":"2022-12-19T13:19:33","slug":"how-to-extend-an-email-layout-in-a-theme-from-a-module","status":"publish","type":"post","link":"https:\/\/webkul.com\/blog\/how-to-extend-an-email-layout-in-a-theme-from-a-module\/","title":{"rendered":"How to extend an email layout in a theme from a module"},"content":{"rendered":"\n

In this blog, we are about to learn, how to extend an email layout in a theme from a module to add some content to an existing email template.<\/p>\n\n\n\n

Usually, we use the provided email theme, and sometimes we would like to add some extra information or change the header\/footer\/content. One of the advantages of new theme layouts is that PrestaShop uses the Twig template so we can take advantage of its extension and blocks features.<\/p>\n\n\n\n

To extend an email layout with HTML content in the existing email template, we need to follow the following steps:<\/p>\n\n\n\n

First of all, we need to register a new hook named ‘actionListMailThemes’<\/p>\n\n\n\n

We use this hook to extend HTML content in the existing email template.<\/p>\n\n\n\n

Now we need to add our layout to the theme\u2019s layout collection.
To do this we use the statement followed by the imported class namespace above the class declaration:<\/p>\n\n\n\n

use PrestaShop\\PrestaShop\\Core\\MailTemplate\\Layout\\Layout;\nuse PrestaShop\\PrestaShop\\Core\\MailTemplate\\ThemeCollectionInterface;<\/pre>\n\n\n\n
Now we define the definition of hook functionality as Follows:<\/p>\n\n\n\n
\/**\n     * @param array $hookParams\n     *\/\n    public function hookActionListMailThemes(array $hookParams)\n    {\n        if (!isset($hookParams['mailThemes'])) {\n            return;\n        }\n\n        \/** @var ThemeCollectionInterface $themes *\/\n        $themes = $hookParams['mailThemes'];\n        $theme = $themes->getByName('classic');\n        if (!$theme) {\n            return;\n        }\n\n        \/\/ First parameter is the layout name, second one is the module name (empty value matches the core layouts)\n        $orderConfLayout = $theme->getLayouts()->getLayout('order_conf', '');\n        if (null === $orderConfLayout) {\n            return;\n        }\n\n        \/\/The layout collection extends from ArrayCollection so it has more feature than it seems..\n        \/\/It allows to REPLACE the existing layout easily\n        $orderIndex = $theme->getLayouts()->indexOf($orderConfLayout);\n        $theme->getLayouts()->offsetSet($orderIndex, new Layout(\n            $orderConfLayout->getName(),\n            __DIR__ . '\/mails\/layouts\/order_conf.html.twig',\n            ''\n        ));\n    }<\/pre>\n\n\n\n
We will get results as follows:<\/p>\n\n\n\n
\"email-template-1\"<\/figure>\n\n\n\n
You can also use the constant name ThemeCatalogInterface::LIST_MAIL_THEMES_HOOK instead of actionListMailThemes.<\/p>\n\n\n\n
That\u2019s all about this blog.<\/p>\n\n\n\n
If any issue or doubt in the above step, please feel free to let us know in the comment section.<\/p>\n\n\n\n
We would be happy to help.<\/p>\n\n\n\n
You can also learn How to add an email layout and variables in a theme from a module<\/a><\/p>\n\n\n\n
You can also explore our PrestaShop Development Services<\/a> and a large range of quality PrestaShop Modules<\/a>.<\/p>\n\n\n\n
For any doubt contact us at support@webkul.com<\/a>.<\/p>\n","protected":false},"excerpt":{"rendered":"
In this blog, we are about to learn, how to extend an email layout in a theme from a module to add some content to an existing email template. Usually, we use the provided email theme, and sometimes we would like to add some extra information or change the header\/footer\/content. One of the advantages of […]<\/a><\/p>\n","protected":false},"author":434,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[209,1],"tags":[],"class_list":["post-343018","post","type-post","status-publish","format-standard","hentry","category-prestashop","category-uncategorized"],"yoast_head":"\nHow to extend an email layout in a theme from a module - Webkul Blog<\/title>\n<meta name=\"description\" content=\"We always use the provided email theme, and sometimes we would like to add some extra information or change the header\/footer\/content\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/webkul.com\/blog\/how-to-extend-an-email-layout-in-a-theme-from-a-module\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"How to extend an email layout in a theme from a module - Webkul Blog\" \/>\n<meta property=\"og:description\" content=\"We always use the provided email theme, and sometimes we would like to add some extra information or change the header\/footer\/content\" \/>\n<meta property=\"og:url\" content=\"https:\/\/webkul.com\/blog\/how-to-extend-an-email-layout-in-a-theme-from-a-module\/\" \/>\n<meta property=\"og:site_name\" content=\"Webkul Blog\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/webkul\/\" \/>\n<meta property=\"article:published_time\" content=\"2022-07-08T13:38:15+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2022-12-19T13:19:33+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/webkul.com\/blog\/wp-content\/uploads\/2022\/07\/email-template-1.png\" \/>\n<meta name=\"author\" content=\"Ravindra Gautam\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@webkul\" \/>\n<meta name=\"twitter:site\" content=\"@webkul\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Ravindra Gautam\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"2 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\/\/webkul.com\/blog\/how-to-extend-an-email-layout-in-a-theme-from-a-module\/#article\",\"isPartOf\":{\"@id\":\"https:\/\/webkul.com\/blog\/how-to-extend-an-email-layout-in-a-theme-from-a-module\/\"},\"author\":{\"name\":\"Ravindra Gautam\",\"@id\":\"https:\/\/webkul.com\/blog\/#\/schema\/person\/1a45b107e54bb2991c05f20fbb1dae12\"},\"headline\":\"How to extend an email layout in a theme from a module\",\"datePublished\":\"2022-07-08T13:38:15+00:00\",\"dateModified\":\"2022-12-19T13:19:33+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/webkul.com\/blog\/how-to-extend-an-email-layout-in-a-theme-from-a-module\/\"},\"wordCount\":275,\"commentCount\":0,\"publisher\":{\"@id\":\"https:\/\/webkul.com\/blog\/#organization\"},\"image\":{\"@id\":\"https:\/\/webkul.com\/blog\/how-to-extend-an-email-layout-in-a-theme-from-a-module\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/webkul.com\/blog\/wp-content\/uploads\/2022\/07\/email-template-1.png\",\"articleSection\":[\"prestashop\"],\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\/\/webkul.com\/blog\/how-to-extend-an-email-layout-in-a-theme-from-a-module\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/webkul.com\/blog\/how-to-extend-an-email-layout-in-a-theme-from-a-module\/\",\"url\":\"https:\/\/webkul.com\/blog\/how-to-extend-an-email-layout-in-a-theme-from-a-module\/\",\"name\":\"How to extend an email layout in a theme from a module - Webkul Blog\",\"isPartOf\":{\"@id\":\"https:\/\/webkul.com\/blog\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/webkul.com\/blog\/how-to-extend-an-email-layout-in-a-theme-from-a-module\/#primaryimage\"},\"image\":{\"@id\":\"https:\/\/webkul.com\/blog\/how-to-extend-an-email-layout-in-a-theme-from-a-module\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/webkul.com\/blog\/wp-content\/uploads\/2022\/07\/email-template-1.png\",\"datePublished\":\"2022-07-08T13:38:15+00:00\",\"dateModified\":\"2022-12-19T13:19:33+00:00\",\"description\":\"We always use the provided email theme, and sometimes we would like to add some extra information or change the header\/footer\/content\",\"breadcrumb\":{\"@id\":\"https:\/\/webkul.com\/blog\/how-to-extend-an-email-layout-in-a-theme-from-a-module\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/webkul.com\/blog\/how-to-extend-an-email-layout-in-a-theme-from-a-module\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/webkul.com\/blog\/how-to-extend-an-email-layout-in-a-theme-from-a-module\/#primaryimage\",\"url\":\"https:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2022\/07\/email-template-1.png\",\"contentUrl\":\"https:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2022\/07\/email-template-1.png\",\"width\":835,\"height\":301,\"caption\":\"email-template-1\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/webkul.com\/blog\/how-to-extend-an-email-layout-in-a-theme-from-a-module\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/webkul.com\/blog\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"How to extend an email layout in a theme from a module\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/webkul.com\/blog\/#website\",\"url\":\"https:\/\/webkul.com\/blog\/\",\"name\":\"Webkul Blog\",\"description\":\"\",\"publisher\":{\"@id\":\"https:\/\/webkul.com\/blog\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/webkul.com\/blog\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Organization\",\"@id\":\"https:\/\/webkul.com\/blog\/#organization\",\"name\":\"WebKul Software Private Limited\",\"url\":\"https:\/\/webkul.com\/blog\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/webkul.com\/blog\/#\/schema\/logo\/image\/\",\"url\":\"https:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2021\/08\/webkul-logo-accent-sq.png\",\"contentUrl\":\"https:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2021\/08\/webkul-logo-accent-sq.png\",\"width\":380,\"height\":380,\"caption\":\"WebKul Software Private Limited\"},\"image\":{\"@id\":\"https:\/\/webkul.com\/blog\/#\/schema\/logo\/image\/\"},\"sameAs\":[\"https:\/\/www.facebook.com\/webkul\/\",\"https:\/\/x.com\/webkul\",\"https:\/\/www.instagram.com\/webkul\/\",\"https:\/\/www.linkedin.com\/company\/webkul\",\"https:\/\/www.youtube.com\/user\/webkul\/\"]},{\"@type\":\"Person\",\"@id\":\"https:\/\/webkul.com\/blog\/#\/schema\/person\/1a45b107e54bb2991c05f20fbb1dae12\",\"name\":\"Ravindra Gautam\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/webkul.com\/blog\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/1b8439e2774cf21a264df535ff994154071e538a17da7dc76beb9f7ffa28fa19?s=96&d=https%3A%2F%2Fcdnblog.webkul.com%2Fblog%2Fwp-content%2Fuploads%2F2019%2F10%2Fmike.png&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/1b8439e2774cf21a264df535ff994154071e538a17da7dc76beb9f7ffa28fa19?s=96&d=https%3A%2F%2Fcdnblog.webkul.com%2Fblog%2Fwp-content%2Fuploads%2F2019%2F10%2Fmike.png&r=g\",\"caption\":\"Ravindra Gautam\"},\"description\":\"Ravindra is a Software Engineer in PrestaShop platform with expertise in Marketplace Development services. He excels in creating and managing online stores using PrestaShop, leveraging his skills in JavaScript, jQuery, and Web Services to deliver dynamic, user-friendly e-commerce solutions that drive business success.\",\"url\":\"https:\/\/webkul.com\/blog\/author\/ravindra-gautam192\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"How to extend an email layout in a theme from a module - Webkul Blog","description":"We always use the provided email theme, and sometimes we would like to add some extra information or change the header\/footer\/content","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/webkul.com\/blog\/how-to-extend-an-email-layout-in-a-theme-from-a-module\/","og_locale":"en_US","og_type":"article","og_title":"How to extend an email layout in a theme from a module - Webkul Blog","og_description":"We always use the provided email theme, and sometimes we would like to add some extra information or change the header\/footer\/content","og_url":"https:\/\/webkul.com\/blog\/how-to-extend-an-email-layout-in-a-theme-from-a-module\/","og_site_name":"Webkul Blog","article_publisher":"https:\/\/www.facebook.com\/webkul\/","article_published_time":"2022-07-08T13:38:15+00:00","article_modified_time":"2022-12-19T13:19:33+00:00","og_image":[{"url":"https:\/\/webkul.com\/blog\/wp-content\/uploads\/2022\/07\/email-template-1.png","type":"","width":"","height":""}],"author":"Ravindra Gautam","twitter_card":"summary_large_image","twitter_creator":"@webkul","twitter_site":"@webkul","twitter_misc":{"Written by":"Ravindra Gautam","Est. reading time":"2 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/webkul.com\/blog\/how-to-extend-an-email-layout-in-a-theme-from-a-module\/#article","isPartOf":{"@id":"https:\/\/webkul.com\/blog\/how-to-extend-an-email-layout-in-a-theme-from-a-module\/"},"author":{"name":"Ravindra Gautam","@id":"https:\/\/webkul.com\/blog\/#\/schema\/person\/1a45b107e54bb2991c05f20fbb1dae12"},"headline":"How to extend an email layout in a theme from a module","datePublished":"2022-07-08T13:38:15+00:00","dateModified":"2022-12-19T13:19:33+00:00","mainEntityOfPage":{"@id":"https:\/\/webkul.com\/blog\/how-to-extend-an-email-layout-in-a-theme-from-a-module\/"},"wordCount":275,"commentCount":0,"publisher":{"@id":"https:\/\/webkul.com\/blog\/#organization"},"image":{"@id":"https:\/\/webkul.com\/blog\/how-to-extend-an-email-layout-in-a-theme-from-a-module\/#primaryimage"},"thumbnailUrl":"https:\/\/webkul.com\/blog\/wp-content\/uploads\/2022\/07\/email-template-1.png","articleSection":["prestashop"],"inLanguage":"en-US","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/webkul.com\/blog\/how-to-extend-an-email-layout-in-a-theme-from-a-module\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/webkul.com\/blog\/how-to-extend-an-email-layout-in-a-theme-from-a-module\/","url":"https:\/\/webkul.com\/blog\/how-to-extend-an-email-layout-in-a-theme-from-a-module\/","name":"How to extend an email layout in a theme from a module - Webkul Blog","isPartOf":{"@id":"https:\/\/webkul.com\/blog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/webkul.com\/blog\/how-to-extend-an-email-layout-in-a-theme-from-a-module\/#primaryimage"},"image":{"@id":"https:\/\/webkul.com\/blog\/how-to-extend-an-email-layout-in-a-theme-from-a-module\/#primaryimage"},"thumbnailUrl":"https:\/\/webkul.com\/blog\/wp-content\/uploads\/2022\/07\/email-template-1.png","datePublished":"2022-07-08T13:38:15+00:00","dateModified":"2022-12-19T13:19:33+00:00","description":"We always use the provided email theme, and sometimes we would like to add some extra information or change the header\/footer\/content","breadcrumb":{"@id":"https:\/\/webkul.com\/blog\/how-to-extend-an-email-layout-in-a-theme-from-a-module\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/webkul.com\/blog\/how-to-extend-an-email-layout-in-a-theme-from-a-module\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/webkul.com\/blog\/how-to-extend-an-email-layout-in-a-theme-from-a-module\/#primaryimage","url":"https:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2022\/07\/email-template-1.png","contentUrl":"https:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2022\/07\/email-template-1.png","width":835,"height":301,"caption":"email-template-1"},{"@type":"BreadcrumbList","@id":"https:\/\/webkul.com\/blog\/how-to-extend-an-email-layout-in-a-theme-from-a-module\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/webkul.com\/blog\/"},{"@type":"ListItem","position":2,"name":"How to extend an email layout in a theme from a module"}]},{"@type":"WebSite","@id":"https:\/\/webkul.com\/blog\/#website","url":"https:\/\/webkul.com\/blog\/","name":"Webkul Blog","description":"","publisher":{"@id":"https:\/\/webkul.com\/blog\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/webkul.com\/blog\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/webkul.com\/blog\/#organization","name":"WebKul Software Private Limited","url":"https:\/\/webkul.com\/blog\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/webkul.com\/blog\/#\/schema\/logo\/image\/","url":"https:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2021\/08\/webkul-logo-accent-sq.png","contentUrl":"https:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2021\/08\/webkul-logo-accent-sq.png","width":380,"height":380,"caption":"WebKul Software Private Limited"},"image":{"@id":"https:\/\/webkul.com\/blog\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/webkul\/","https:\/\/x.com\/webkul","https:\/\/www.instagram.com\/webkul\/","https:\/\/www.linkedin.com\/company\/webkul","https:\/\/www.youtube.com\/user\/webkul\/"]},{"@type":"Person","@id":"https:\/\/webkul.com\/blog\/#\/schema\/person\/1a45b107e54bb2991c05f20fbb1dae12","name":"Ravindra Gautam","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/webkul.com\/blog\/#\/schema\/person\/image\/","url":"https:\/\/secure.gravatar.com\/avatar\/1b8439e2774cf21a264df535ff994154071e538a17da7dc76beb9f7ffa28fa19?s=96&d=https%3A%2F%2Fcdnblog.webkul.com%2Fblog%2Fwp-content%2Fuploads%2F2019%2F10%2Fmike.png&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/1b8439e2774cf21a264df535ff994154071e538a17da7dc76beb9f7ffa28fa19?s=96&d=https%3A%2F%2Fcdnblog.webkul.com%2Fblog%2Fwp-content%2Fuploads%2F2019%2F10%2Fmike.png&r=g","caption":"Ravindra Gautam"},"description":"Ravindra is a Software Engineer in PrestaShop platform with expertise in Marketplace Development services. He excels in creating and managing online stores using PrestaShop, leveraging his skills in JavaScript, jQuery, and Web Services to deliver dynamic, user-friendly e-commerce solutions that drive business success.","url":"https:\/\/webkul.com\/blog\/author\/ravindra-gautam192\/"}]}},"amp_enabled":true,"_links":{"self":[{"href":"https:\/\/webkul.com\/blog\/wp-json\/wp\/v2\/posts\/343018","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/webkul.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/webkul.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/webkul.com\/blog\/wp-json\/wp\/v2\/users\/434"}],"replies":[{"embeddable":true,"href":"https:\/\/webkul.com\/blog\/wp-json\/wp\/v2\/comments?post=343018"}],"version-history":[{"count":4,"href":"https:\/\/webkul.com\/blog\/wp-json\/wp\/v2\/posts\/343018\/revisions"}],"predecessor-version":[{"id":343351,"href":"https:\/\/webkul.com\/blog\/wp-json\/wp\/v2\/posts\/343018\/revisions\/343351"}],"wp:attachment":[{"href":"https:\/\/webkul.com\/blog\/wp-json\/wp\/v2\/media?parent=343018"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/webkul.com\/blog\/wp-json\/wp\/v2\/categories?post=343018"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/webkul.com\/blog\/wp-json\/wp\/v2\/tags?post=343018"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}