Панорамный тур из Google Maps на вашей странице Facebook

Кажется все уже знают, как можно опубликовать на странице Facebook панорамное фото, которое будет показываться именно как панорама 360°. Но можно сделать так, чтобы в страницу на Facebook был вставлен именно тур целиком, со стрелками переходов из локации в локацию.

Такой тур будет показываться как запись в панели слева и при переходе отображаться в ленте на странице. Так как же это сделать?

В итоге выглядит это вот так:

Страница в Facebook
Страница с туром

Для того, чтобы можно было размещать дополнительные материалы, нужно подключить стороннее приложение Static Tabs от WOOBOX — woobox.com Оно «умеет» еще очень много всего, но сейчас нас интересует пока только возможность работы с турами Google (на самом деле, это работа с iframe — кусками другого сайта в данном сайте, если упрощать) на нашей станице.

Переходим по ссылке, чтобы установить приложение Woobox Static Iframe на страницу (если не понравится, его можно удалить).

Страница WOOBOX
Устанавливаем приложение для Facebook

Приложение установилось и оно теперь прикреплено к вашей станице. Теперь слева, кроме тех пунктов, которые нам уже известны (Главная, Публикации, Отзывы etc.), мы видим еще один — Wellcome (сразу лучше сказать — название можно менять так, как захочется).

Названия вкладок
Подпись Wellcome я заменил на названия туров

Если нажать на него, справа откроется окно, в котором мы сможем увидеть настройки для этой вкладки. Все на английском! В зависимости от браузера (или настроек, которые установили администраторы сервиса), можно начать настраивать вкладку прямо сейчас, или перейти на страницу сервиса (где все выглядит несколько более понятно).

Перейдя на страницу сервиса, видим вот такое окно:

Окно сервиса
Окно сервиса WOOBOX

В окне, озаглавленном Page Source — практически полноценный HTML редактор. Но его возможности в нашем случае мы будем использовать по минимуму — только для вставки кода iframe, который выдаст нам Google Maps.

Далее, нам необходимо получить код непосредственно тура. Открываем наш тур в Google Maps, и копируем ссылку. Лучше выбрать формат «Большая» — так окно будет открываться по всей ширине фрейма на Facebook.

Код ссылки Google
Берем код со страницы Google Maps

Далее, полученный код вставляем (если не получается по правой кнопке мыши, нажмем CTRL+V) в окно Page Source, нажимаем кнопку SAVE SETTINGS (зеленая внизу).

Все, можно смотреть, что получилось на нашей станице в Facebook.  теперь панорамный тур целиком доступен во вкладке, которая пока еще называется Wellcome.

По идее, можно все так  и оставить и не трогать остальные настройки этой вкладки, если нет необходимости вставлять еще туры. Но при желании можно  кое что изменить.

Например, название ссылки на тур (название вкладки) — название тура, которое будет показываться на странице. Следующий пункт меню — настройки окна, которое увидит посетитель страницы в случае, если решит поделиться этим туром в пределах Facebook.

Нзвание вкладки
Смена названия вкладки на свое

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

В сфере социальных сетей все весьма динамично меняется, при этом не всегда в сторону упрощения и удобства для пользователя. Поэтому некоторые пункты, описанные выше, могут быть изменены. Но смысл и общая концепция работы со сторонним статичным html кодом сохраняется уже довольно давно.

Вот, как это должно выглядеть в итоге: страница на Facebook

Подготовил Константин Володин

 

 

 

 

 

Добавить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *