-->

четверг, 24 октября 2013 г.

Как мы вставляли гуглобэйдж на гуглосайт

Как говорится, а начиналось все так безоблачно...

В какой-то момент я понял, что в блоге Клуба нет ссылки на клубное сообщество. Ну так не проблема: нашел в гуглокартинках приличное лого Google+, сохранил и в HTML-гаджет блога вставил картинку, сопроводив его ссылкой. О чем с гордостью сообщил в сообществе. В комментариях к этому посту +Lada Breskina дала наводку на более изящное решение — как это сделать штатными средствами Гугла. Я посмотрел, сказал спасибо, сделал в блоге Клуба и остался полностью счастлив.

Но лихо настигло откуда не ждали.

Через некоторое время — чат с +Maria Sonina:

Maria Sonina: пытаюсь понять, как на сайт поставить такой же красивый значок, как ты в клубном блоге сделал, и не могу, тупая...
Yuri Eelmaa: значок?
Maria Sonina: да, сижу на этой странице и ни черта не понимаю. на пенсию, срочно!
Yuri Eelmaa: сообщества?
Maria Sonina: да. на сайт проекта добавить значок проекта
Yuri Eelmaa: на сайт или в блог?
Maria Sonina: на сайт проекта добавить значок сообщества проекта. сейчас у нас просто картинка кликабельная
Yuri Eelmaa: в режиме HTML страницы вставляешь
<script src="https://apis.google.com/js/plusone.js" type="text/javascript"></script>
<g:community href="https://plus.google.com/communities/{communityId}"></g:community>
вместо https://plus.google.com/communities/{communityId} вставляешь ссылку на свое коммьюнити в гуглоплюсе. все
Maria Sonina: мне пишет, что недопустимый HTML. и сносит весь скрипт целиком.
Yuri Eelmaa: вижу. щас

Через 15 минут экспериментов пришлось признать:

Yuri Eelmaa: да, задачка лихая... но я ее победю


Сперва покопался в Рунете — ноль эмоций. Т.е. вообще, даже вопроса такого ни у кого не возникало, сплошное зимбабве. Полез в импортный, вражеский Инет. Проблема оказалась какая? Указанные скрипты бэйджей для отображения сообщества отлично работают на сайтах на Joomla, на WordPress (либо просто вставляются, либо есть плагины для этих систем), на рукописные сайты, на ресурсы на Blogger. А на гуглосайты — не вставляются. Причина в том, что движок гуглосайтов не позволяет вставлять тег <script> (который, как известно, идет до <head>) — наверное, из соображений безопасности (хотя Blogger это делать умеет:))) На англоязычных гуглофорумах народ тоже с этой проблемой сталкивался, но единственным решением было — писать свой гаджет для гуглосайта. Хммм, это мне не подходит по причине врожденной или благоприобретенной серости.

Параллельно начал писать ахтунги: в сообщество «Учимся с Гугл» написал пост, то же самое сделал в англоязычном сообществе "Google Sites".

В итоге люди помогли. Спасибо +Elliott Shafii, который написал свой гаджет для этой цели. Еще большее спасибо +Andrey Korhonen за его более функциональный гаджет.

Параллельно +Сергей Катальников опубликовал ссылку «Как создать свой гаджет для Google Sites» — может, кому-то будет полезно, я с этой кухней разобрался ранее, пока шастал по вражеским форумам. Механизм-то понятен, но вот гаджеты писать не умею:))

Что в итоге. Рассказываю, как вставлять бэйдж сообщества в страницу гуглосайта.

Заходим на страницу гуглосайта. Редактируем страницу. Ставим курсор на место, где будет отображаться бэйдж. Меню Вставка → Дополнительные гаджеты. В открывшемся поле выбираем слева «Добавить гаджет по URL». Вставляем XML-файл, например, от +Andrey Korhonen: http://hosting.gmodules.com/ig/gadgets/file/109550275381665698292/gpluscompagebadge.xml В поле «Вставьте код страницы сообщества в G+: https://plus.google.com/communities/_код страницы сообщества_ (обязательно)» указываем ID сообщества: в случае моего Клуба —
105209146084721880162. Нажимаем ОК, сохраняем страницу.

Наслаждаемся! На гуглосайте возникает вот такое чудо:


Спрашивается, стоило мучиться? Конечно!

1. Разобрался, как добавляются в гуглосайты гаджеты по URL. При анализе XML-кодов гаджетов, в принципе, понял, как они устроены.

2. От +Andrey Korhonen поступило заманчивое предложение: «Предлагаю устроить хэнгаут, где я поделюсь своими знаниями по гаджетам и использовании их на Google Sites. Нужно только определиться с датой и временем». Кому интересно — давайте соберемся и назначим время (отмечаемся в комментах!). Правда, не очень понятен требуемый IT-уровень для этого...

3. И Самое вкусное. Пока копался в куче источников — насохранял себе массу интересных ссылок на всякие кунштюки с гуглосайтами. Просто балдел. Делюсь. Естессно, все на английском, но опцию «Перевести на русский» в контексном меню Chrome никто ведь не отменил, правда?:))
  • Mary Fran's Getting Started with Google Sites — хороший сайт для новичков, подробно про все функции + как вставлять в гуглосайт массу всего
  • Google Sites Examples — миллионы примеров использования того, как в гуглосайт вставляется все, что есть на свете, как делать свои шаблоны, что можно делать, если вы понимаете HTML и CSS
  • Страница по теме на Annuaire du Vin — разные хаутусы, хоть про то, как в гуглосайт блог встраивать!
  • philridout's Google Sites help site — тут я завис надолго, автор — Google Sites Top Contributor (в общем — крутой мэн); навигация по самому вкусному выведена на длиннющую первую страницу. Полный musthave!
  • Google Sites Help by K80MS — еще одни бездонные недра «на покопаться»
  • Google Sites Best Practices - Tips&Tricks — список занятных кунштюков
  • Google Sites Web Design — живой блог по сабжу, что говорить, в RSS его тащить надо!
  • Mori79 — масса ссылок всюду на этого иранского паренька, который, по его словам, "Google Sites Guru" — брат мой, то бишь:) Тут тоже некоторое количество хаутусов
  • Steegle for Tutorials — ну и под конец просто Мекка гуглосайтовода! Откройте страницу и придержите разбегающиеся глаза! Меня особенно впечатлил гаджет, вставляющий презентацию-слайдшоу из гуглодоков: красотища какая!
В общем, на неделю я вам ежевечернее занятие обеспечил. Ну если не вам — то себе уж точно. А то ведь не хватает на планете же гуглосайтогур, придется исполнять мессию миссию!