В ЛК присутствует возможность интеграции с внешними сервисами посредством встраивания iframe или пользовательских шаблонов. Для этого используется виджет container.
| Note |
|---|
Предварительно следует настроить $server_client в соответствии с инструкцией: Расширение стандартной функциональностиНастройка личного кабинета для переопределения стандартных конфигурационных файлов. |
Создание страницы с интегрированным сервисом
Создайте файл $server_client/widgets/container.yml со следующим содержанием:
...
Интегрированный сервис будет доступен в ЛК по ссылке вида /external/ключ_сервиса, напр. /external/online_shop. Разместить эту ссылку можно, например, с помощью виджетов "баннер" или "Навигационные ссылки (NavigationLinks)".
Создание пользовательских шаблонов
Пользовательские шаблоны требуются в случае, если сервис встраивается не через iframe.
...
| Code Block | ||||||
|---|---|---|---|---|---|---|
| ||||||
<link rel="stylesheet" type="text/css" href="http://www.gismeteo.ru/static/css/informer2/gs_informerClient.min.css">
<div id="gsInformerID-cI23Qt8v08esfK" class="gsInformer" style="width:239px;height:90px">
<div class="gsIContent">
<div id="cityLink">
<a href="http://www.gismeteo.ru/city/daily/4368/" target="_blank">Погода в Москве</a>
</div>
<div class="gsLinks">
<table>
<tr>
<td>
<div class="leftCol">
<a href="http://www.gismeteo.ru" target="_blank">
<img alt="Gismeteo" title="Gismeteo" src="http://www.gismeteo.ru/static/images/informer2/logo-mini2.png" align="absmiddle" border="0" />
<span>Gismeteo</span>
</a>
</div>
<div class="rightCol">
<a href="http://www.gismeteo.ru/city/weekly/4368/" target="_blank">Прогноз на 2 недели</a>
</div>
</td>
</tr>
</table>
</div>
</div>
</div>
<script src="http://www.gismeteo.ru/ajax/getInformer/?hash=cI23Qt8v08esfK" type="text/javascript"></script> |
...
| Code Block | ||||||
|---|---|---|---|---|---|---|
| ||||||
%link{:href => "http://www.gismeteo.ru/static/css/informer2/gs_informerClient.min.css", :rel => "stylesheet", :type => "text/css"}/
#gsInformerID-cI23Qt8v08esfK.gsInformer{:style => "width:239px;height:90px"}
.gsIContent
#cityLink
%a{:href => "http://www.gismeteo.ru/city/daily/4368/", :target => "_blank"} Погода в Москве
.gsLinks
%table
%tr
%td
.leftCol
%a{:href => "http://www.gismeteo.ru", :target => "_blank"}
%img{:align => "absmiddle", :alt => "Gismeteo", :border => "0", :src => "http://www.gismeteo.ru/static/images/informer2/logo-mini2.png", :title => "Gismeteo"}/
%span Gismeteo
.rightCol
%a{:href => "http://www.gismeteo.ru/city/weekly/4368/", :target => "_blank"} Прогноз на 2 недели
%script{:src => "http://www.gismeteo.ru/ajax/getInformer/?hash=cI23Qt8v08esfK", :type => "text/javascript"} |
...
Далее поместим этот виджет на стену (shortcuts_wall).
Интеграция в shortcut
Для интеграции сервисов в shorcut существует специальный shortcut - container. Он определяется в файле $server_client/widgets/shortcuts.yml так же, как и другие shortcut'ы:
...
| Code Block | ||
|---|---|---|
| ||
shortcuts_wall:
main: # идентификатор стены
...
- row: 2 # строка
col: 3 # столбец
type: container
key: weather |
Использование переменных в пользовательских шаблонах
Шаблоны допускают использование языка CoffeeScript (см. описание шаблонизатора).
...