iPingvo

создать свойство в разделе инфоблока, на вкладке "Доп.поля"

Добрый день!
1) Делаете TV (например для отметки Хит), называете - hit - Тип: Переключатели (radio), назначаете его нужных шаблонам, указываете возможные значения -
Нет==0||Да==1
2) В нужных товарах переключаете на Да.

3) В выводе вставляете условие:

<div class="item" title="lorem ipsum">
 [[*hit:is=`1`:then=`<div class="hit"></div>`:else=``]]
  <div class="img"><a href="/" title="lorem upsum"><div class="skoro"></div><img class="parent" src="img/content/1.png" alt="" border="0" width="230" height="230"></img></a></div>
  <div class="name"><a href="/" title="lorem upsum">title</a></div>
  <div class="price"><span class="catalog-price">price</span></div>
</div>

ps по этому примеру можно сделать оставшиеся поля

На примере Google Chrome
1) Нажмите [правый клик]>[Просмотр кода элемента] или F12
2) В открывшемся инструменте разработчика в коде текущей страницы (gmail) найдите куда вставить код письма и нажмите [правый клик]>[Edit as HTML]
3) Вставьте Ваш HTML код и нажмите Ctrl+Enter

Пробуйте таким способом подключить шрифт, он меня пока не подводил

@font-face {
font-family: "PT Serif";
  src: url("../fonts/ptserif-normal.eot");
  src: local('☺'), 
  url("../fonts/ptserif-normal.eot?#iefix") format("embedded-opentype"), 
  url("../fonts/ptserif-normal.woff") format("woff"),
  url("../fonts/ptserif-normal.ttf") format("truetype"), 
  url("../fonts/ptserif-normal.svg#PT Serif") format("svg");

  font-weight: normal;
  font-style: normal;
}

UPD: Данный вариант устарел подробнее здесь Как осуществить подключение нескольких шрифтов в css?