Как поместить заполнители для динамического содержимого в html email?

Question

У меня есть скрипка (в основном html-письмо), которое я скопировал, следуя определенному дизайну.

В html-электронном письме есть некоторое динамическое содержимое , в которое я хочу поместить заполнитель , поскольку он будет меняться для разных клиентов.

Фрагменты HTML-кода из скрипки, где я использую динамическое содержимое:

<tr>
   <td>
      <table cellpadding="0" cellspacing="0" border="0" width="100%" style="font-size:20px; padding-right: 23%;">
         <tr>
            <td style="padding-bottom: 3%;text-align:right;">type:</td>
            <td style="padding-bottom: 3%;padding-left: 10%;">availability check request</td>
         </tr>
         <tr>
            <td style="padding-bottom: 3%;text-align:right;">estimated total:</td>
            <td style="padding-bottom: 3%;padding-left: 10%;">$250.00</td>
         </tr>
         <tr>
            <td style="padding-bottom: 3%;text-align:right;">what</td>
            <td style="padding-bottom: 3%;padding-left: 10%;">Radio</td>
         </tr>
         <tr>
            <td style="padding-bottom: 3%;text-align:right;">how many</td>
            <td style="padding-bottom: 3%;padding-left: 10%;">2</td>
         </tr>
         <tr>
            <td style="padding-bottom: 3%;text-align:right;">when:</td>
            <td style="padding-bottom: 3%;padding-left: 10%;word-wrap: break-word;
               width: 300px;">March 28/18 @ 7:00pm to March 30/18 @ 7:00pm</td>
         </tr>
         <tr>
            <td style="padding-bottom: 3%;text-align:right;">who:</td>
            <td style="padding-bottom: 3%;padding-left: 10%;color:#FF8D58;">Mike</td>
         </tr>
      </table>
   </td>
</tr>

Постановка задачи:

Мне интересно, как я могу поместить заполнитель в HTML-код выше, где я использую динамическое содержимое, такое как $250.00, Radio, 2, March 28/18 @ 7:00pm to March 30/18 @ 7:00pm

Answer 1

Один из возможных маршрутов - использовать шаблонизатор . В этом решении вы бы заменили каждый элемент, который хотите заменить, общим тегом. В примере, который я включил, этот тег просто {{...}}.

Как только вы это сделаете, вы предоставите свой вновь созданный шаблон движку шаблонов. Затем механизм обработает ваш шаблон, заменив каждый из тегов соответствующими данными.

/* It was a little hard to read with all of the inline CSS */

table {
  font-size: 20px;
  padding-right: 23%;
}

table tr td {
  padding-bottom: 3%;
}

table tr td:first-child {
  text-align: right;
}

table tr td:last-child {
  padding-left: 10%;
}

<table cellpadding="0" cellspacing="0" border="0" width="100%">
  <tr>
    <td>type:</td>
    <td>{{type}}</td>
  </tr>
  <tr>
    <td>estimated total:</td>
    <td>${{total}}</td>
  </tr>
  <tr>
    <td>what</td>
    <td>{{what}}</td>
  </tr>
  <tr>
    <td>how many</td>
    <td>{{count}}</td>
  </tr>
  <tr>
    <td>when:</td>
    <td style="word-wrap: break-word;
               width: 300px;">{{date_from}} to {{date_to}}</td>
  </tr>
  <tr>
    <td>who:</td>
    <td style="color:#FF8D58;">{{name}}</td>
  </tr>
</table>

Тогда, если вы предоставите в шаблон следующие данные ...

let data = [
    {
        id: 123, // A "key" for the user to have a way to reference the data
        name: "Mike",
        type: "availability check request",
        total: 250.00,
        what: "Radio",
        count: 2,
        date_from: new Date(3-28-2018),
        date_to: new Date(3-30-2018)
    }
];

... таблица, аналогичная той, которую вы указали, будет получена после обработки шаблона.

Это, очевидно, очень обобщенно и не может быть применено к каждому сценарию, но должно ответить на ваш вопрос. Не стесняйтесь обновлять свой пост или комментарий, предоставляя дополнительную информацию, и я постараюсь обновить, чтобы соответствовать вашему примеру.

---

Edit:

Чтобы добиться того же с Laravel Blade, нам нужно будет создать файл [FILE NAME].blade.php. Это будет файл, который содержит наш шаблон. Laravel имеет довольно много документации, касающейся синтаксиса, на странице их шаблонов . Это должен быть грубый перевод предыдущего шаблона.

<table cellpadding="0" cellspacing="0" border="0" width="100%">
  <tr>
    <td>type:</td>
    <td>{{ $type }}</td>
  </tr>
  <tr>
    <td>estimated total:</td>
    <td>${{ $total }}</td>
  </tr>
  <tr>
    <td>what</td>
    <td>{{ $what }}</td>
  </tr>
  <tr>
    <td>how many</td>
    <td>{{ $count }}</td>
  </tr>
  <tr>
    <td>when:</td>
    <td style="word-wrap: break-word;
               width: 300px;">{{ date("F j/s @ g:ia", $dateFrom) }} to {{ date("F j/s @ g:ia", $dateTo) }}</td>
  </tr>
  <tr>
    <td>who:</td>
    <td style="color:#FF8D58;">{{ $name }}</td>
  </tr>
</table>

Функция {{ date("F j/s @ g:ia", $date) }} берет заданную временную метку и форматирует ее в заданный формат. Документацию можно найти здесь , но просто:

• F: Март 28/18 @ 7:00 вечера
• j: март 28 / 18 @ 7:00 вечера
• с: 28 марта / 18 @ 7:00 вечера
• г: 28/18 марта @ 7 : 00 вечера
• я: 28/18 марта @ 7: 00 вечера
• a: 28/18 марта @ 7: 00 вечера