Урок 3. Табличный дизайн рассылки для “чайников”

Верстать таблицы в Блокноте - удел Избранных. Для абсолютного большинства этот путь неприемлем. И тут нам на помощь приходит любимый до слез HomeSite.

Отверстать табличный дизайн в этом замечательном редакторе - дело, с которым справится как пятилетний ребенок так и семидесятилетняя бабушка.

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

За сим, приступим, засучив рукава...

Запускаем HomeSite. В блоке панелей инструментов выбираем Table (Таблицы), где смело нажимаем на первую же кнопку  Table Wizard.

И является нашему взору чудо-чудное, диво-дивное - визуальный табличный редактор.

Где:

1. Объединить ячейки по горизонтали
2. Добавить столбцы
3. Объединить ячейки по вертикали
4. Добавить строки

Все просто, как дважды один. Воспользуемся любезным предложением и добавим еще строку и столбец. И, раз уж все так хорошо получается, еще и объединим в средней строке все ячейки. Получилась вот такая песня:

Ай, да мы! Нажимаем кнопку Next (Далее). Спокойно! Голова не кружится, паниковать рано! Видим вот такой расклад:

Ха! В действительности, если присмотреться, не все так уж страшно: выбираем расположение таблицы на странице, отступы в ней, ее ширину (рекомендую указывать в процентах - это даст возможность таблице расширяться и сжиматься в зависимости от разрешения экрана Вашего подписчика), общий цвет таблицы, цвет ячейки сможете указать отдельно, если не хотите, чтобы все было одним цветом и ширину границ таблицы (я рекомендую ноль)

Жмем Next (Далее). Боже!!! Что ЭТО?!!! Спокойно! Без паники, мы начинаем КВН - сообщаем HomeSite что и в какой ячейке у нас будет жить. В частности в крайней слева будет жить название нашей рассылки. А потому в поле Content мы вставим такую фразу:

рассылка новостей<br><b>"[ SUBSCRIBE list_name ]" (выделите, скопируйте и вставьте).

Сделано? Отлично! В поле Width (ширина) поставьте 33%, выберите горизонтальную ориентацию center .

Теперь не нажимая Next, кликаем мышкой в среднюю верхнюю ячейку.

Можете сделать так, как написано на картинке. А можете выделить, скопировать и вставить в поле Content следующий текст:

<img src="http://subscribe.ru/catalog/код_Вашей_рассылки/logo.png" border="0" width="100">

Замените код_Вашей_рассылки на собственно код, который дала Вам служба Subscribe.

Кстати, если Вы еще не украсили свою рассылку логотипом, сделать это можно в Вашем аккаунте на SubScribe в меню "Конфигурации" -> "Отображение в каталоге".

В поле Width (ширина) поставьте 33%, выберите горизонтальную ориентацию center .

Кликаем мышкой в следующую ячейку.

Здесь у нас будут жить дата выпуска, его номер и, до кучи, его название. В поле Content вставляем:

выпуск No [ SUBSCRIBE issue_number ]&nbsp;от [ SUBSCRIBE issue_date ]<br><b>&laquo;[ SUBSCRIBE issue_name_add ]&raquo;</b>

Выставляем ширину ячейки, центрируем - все, как обычно.

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

Ширину мы здесь не проставляем, однако указываем, что текст нам крайне желателен по левому краю а по вертикали привязываться к верху ячейки, а не к ее середине.

В поле можно просто вставить __ISSUE__, а можно сделать еще удобнее - сразу и поздороваться со всеми:

<p>Добрый день, друзья. С вами [ SUBSCRIBE list_author_name ] с очередным выпуском рассылки "[ SUBSCRIBE list_name ]".
<p>__ISSUE__
<br><br>

Брейки в конце для того, чтобы между последней строчкой и краем таблицы был хоть какой-то приятный зазор.

Идем далее... Видите? Все легче и легче

Дерзко копируем и вставляем в поле Content:

<center><b>Контакты</b>:<br><a href=[ SUBSCRIBE list_url ]>[ SUBSCRIBE list_url ]</a><br> <a href=mailto:[ SUBSCRIBE list_author_email ]>[ SUBSCRIBE list_author_email ]</a></center>

В нижних ячейках уже не обязательно указывать ширину - она будет по умолчанию 33%

В средней ячейке у нас будут жить оценки Ваших выпусков:

[ SUBSCRIBE list_votebar_email ]

Разумеется - по центру.

Ну и в конце можно добавить что-то лично от себя: пожелания, просьба рекомендации и т.д. Например так:

Если Вам нравится эта рассылка, будет здорово, если Вы порекомендуете своим друзьям и коллегам. Спасибо!

Вот теперь самое время нажать Finish (Конец). Вот что Вы увидите в окне HomeSite:

Все это безобразие нужно выделить (лучше использовать комбинацию клавиш Ctrl+A), скопировать и вставить в поле Шаблон HTML-письма в разделе "Шаблоны оформления"

Кстати, чуть не забыла. Если Вы не хотите, чтобы вся Ваша таблица была одним цветом, а хотите, чтобы внутри ячейки были, скажем, белыми, просто добавьте вот такой код в каждую ячейку:

bgcolor="#ffffff"

Т.е., выглядеть это будет так: открывающая скобка, td или th (если это ячейка с заголовками), пробел, цвет,  ну и  код, который лучше не менять

<td bgcolor="#ffffff" align="center">

Всего-то делов! Только не забудьте сохранить изменения в Вашем шаблоне на Subscribe.

И скажите после этого, что это не просто!