Справка:Сервис родословных
Материал из Wikipet
Данный сервис позволяет отображать родословные на других сайтах и может быть полезен для использования в статьях о кошках, на сайтах питомников, в блогах и т.п.
Чтобы далеко не ходить, сразу посмотрите пример.
Как вы видите, имена кошек оформлены как ссылки, при нажатии на которые отображается родословная этого животного. В отображаемой родословной каждое имя кошки является ссылкой на ее страницу в Wikipet. Данные загружаются только после клика мышкой по ссылке, поэтому использование сервиса не будет тормозить загрузку страницы.
Сервис постоянно совершенствуется, поэтому рады будем услышать ваши замечания и предложения на странице обсуждения сервиса.
Содержание |
[править] Как настроить сервис родословных
Итак, если вы решили использовать сервис родословных, то Вам будет необходимо вставить на страницу 2 скрипта, добавить "контейнер" и инициализировать работу сервиса. Если в процессе работы у вас возникнут вопросы или трудности, с радостью ответим на них на странице обсуждения сервиса.
Теперь подробнее:
[править] Установка скриптов и стилей
В страницу, на которой вы собираетесь отображать родословные, необходимо добавить два скрипта и файл стилей. Обращаем ваше внимание на то, что если у вас для всего сайта используется общая "шапка", то добавлять их надо именно в общую шапку - это позволит пользоваться сервисом на любой странице вашего сайта, не добавляя скрипты и стили на каждую страницу. Сейчас почти всегда у сайтов есть общая шапка.
Код, который необходимо добавить (как правило заключается внутри тегов <head></head>):
-
<script type="text/javascript" src="http://stuff.wikipet.info/utils/prototype.js"></script>
- <script type="text/javascript" src="http://stuff.wikipet.info/utils/pedigreePopup/pedigreePopup.js"></script>
- <link href="http://stuff.wikipet.info/utils/pedigreePopup/pedigreePopup.css" rel="stylesheet" type="text/css" />
[править] Добавление контейнера
Где-либо в начале страницы, к примеру, сразу после тега <body> необходимо добавить тег, внутрь которого будут подгружаться родословные. Добавлять его тоже желательно в общей шапке. Тег этот невидим и на отображение страницы никак не влияет. Код:
- <div id="wpContainer" style="display: none"><a href="http://wikipet.ru"></a></div>
[править] Инициализация
Теперь вам необходимо добавить код, который будет инициализировать работу всего сервиса.
Код:
- <script>wpPedigreePopup.process();</script>
Этот код вызывает функцию из тех скриптов, что вы добавили выше. Добавлять его необходимо где-либо в конце страницы, к примеру, перед закрывающим тегом </body>. Это важно, так как этот код должен находиться после всех текстов, в которых будут отображаться родословные. Если вам захочется отключить работу сервиса, то для этого нет надобности удалять все, что вы добавили, можно удалить только этот код и сервис будет остановлен.
[править] Как пользоваться сервисом
Предположим, что у вас все настроено и готово к работе, теперь рассмотрим, как собственно указывать животных, для которых будут загружаться родословные. Допустим, у вас есть некий текст, который вы хотите добавить в блог (на страницы сайта и т.п). К примеру текст этот такой:
- На выставке Felina Belissima, 14 марта наша кошка Zima Sueno de Pantera заняла третье место.
Вы хотите, чтобы для упомянутой кошки отображалась родословная, для этого вы должны обернуть имя кошки следующим образом:
- На выставке Felina Belissima, 14 марта наша кошка <span class="wpPedigree">Zima Sueno de Pantera</span> заняла третье место.
В приведенном примере имя кошки будет оформлено как ссылка, при нажатии на которую отобразится родословная до 3-го колена. Если вы хотите отображать родословную только до 2-го колена, то в атрибуте class у тега span замените wpPedigree на wpPedigree2.
Обращаем внимание, что имя кошки должно быть набрано полностью и правильно, именно так, как оно хранится в системе Wikipet, иначе сервис "не поймет" родословную какой кошки показывать.