Jade template не поддерживает гнездование

У меня есть шаблон электронной почты из нефрита. Он включает в себя файл mixin, который включает микширование header, которое должно быть во всех электронных письмах. Он включается должным образом, но из-за уровня гнездования внутри него (3 уровня в глубину), все, что я помещаю после mixin, не поддерживает гнездование там, где оно должно.Jade template не поддерживает гнездование

views/mixins/email.jade

mixin header(siteLogo) 
    div(style='margin-bottom: 20px; border: 1px solid #ddd; padding: 20px; width: 50%; margin: 0 auto 20px;') 
    div(style='text-align: center; border-bottom: 1px solid #EEE; padding-bottom: 10px;') 
     img(src='#{siteLogo}', style='text-align: center;')

views/emails/forgot_password.jade:

include ../mixins/email 

+header(siteLogo) 
    p 
    | Hi #{name}, 
    p 
    | Welcome to the site!

Формирует электронной почты HTML, как:

<div style="margin-bottom:20px;border:1px solid #ddd;padding:20px;width:50%;margin:0 auto 20px"> 
    <div style="text-align:center;border-bottom:1px solid #eee;padding-bottom:10px"> 
    <img src="path/to/image/logo" style="text-align:center"> 
    </div> 
</div> 
<p>Hi BobCobb</p> 
<p>Welcome to the site!</p>

Но я хочу оба этих paragra рН-теги быть внутри основной <div> нравится:

<div style="margin-bottom:20px;border:1px solid #ddd;padding:20px;width:50%;margin:0 auto 20px"> 
    <div style="text-align:center;border-bottom:1px solid #eee;padding-bottom:10px"> 
    <img src="path/to/image/logo" style="text-align:center"> 
    </div> 
    <p>Hi BobCobb</p> 
    <p>Welcome to the site!</p> 
</div>

источник

2013-12-17 bob_cobb

Джейд бесполезно для HTML электронной почты. Я бы настоятельно рекомендовал использовать любую веб-инфраструктуру.

Подробнее о том, как html email differs from the web.

Вот что ваш код должен выглядеть, если он оптимизирован для HTML электронной почты:

<table width="50%" border="0" cellpadding="0" cellspacing="0" style="border:1px solid #dddddd"> 
    <tr> 
    <td align="center"> 
     <img alt="" src="path/to/image/logo" width="100" height="75" style="margin: 0; border: 0; padding: 0; display: block;"> 
    </td> 
    </tr> 
    <tr> 
    <td style="font-family: Helvetica, Arial, sans-serif; font-size: 14px; color: #000000; padding:20px; border-top:1px solid #dddddd;"> 
     <p>Hi BobCobb</p> 
     <p>Welcome to the site!</p> 
    </td> 
    </tr> 
</table>

источник

2013-12-18 14:19:31 John

Единственный шаблон/рамки Я знаю для HTML электронной почты [Чернила на Zurb] (http://zurb.com/ink/templates.php). – John

Я видел чернила раньше и понимаю, что использование чего-либо, кроме таблиц в электронных письмах, будет выглядеть плохо, но основной момент (того, что я пытаюсь решить) заключается в том, что я хочу использовать микшимы и частичные элементы, необходимо поддерживать поддержку тех же шаблонов электронной почты, поэтому, если я изменяю верхний или нижний колонтитул, я могу сделать это в одном месте. Это попытка удержать вещи СУХОЙ. –

Вы можете попробовать что-то вроде php include() для объединения файлов под шаблонов (отдельные файлы для заголовка, нижнего колонтитула, раздела с двумя столбцами, раздела с тремя столбцами и т. Д.). Таким образом, вы можете создавать с помощью сочетания и соответствия блоков. – John

На самом деле ответ на первоначальный вопрос, вам нужно указать в Mixin, где блок должен вынести.

views/mixins/email.jade

mixin header(siteLogo) 
    div(style='margin-bottom: 20px; border: 1px solid #ddd; padding: 20px; width: 50%; margin: 0 auto 20px;') 
    div(style='text-align: center; border-bottom: 1px solid #EEE; padding-bottom: 10px;') 
     img(src='#{siteLogo}', style='text-align: center;') 
    if block 
     block

источник

2015-09-18 18:42:23 sean

Jade template не поддерживает гнездование

ответ

Смежные вопросы