OpenGraph разметка на сайте под управлением 1С-Битрикс
На сайте одного из наших клиентов нужно было внедрить микроразметку OpenGraph. Сделать это нужно было не только на статических страницах сайта, но и на страницах с динамической информацией.
В этой заметке я расскажу, как я это реализовал. На самом деле это было несложно, хотя когда эта задача была мне поставлена, мне казалось иначе.
Как известно, OpenGraph разметка используется для отображения анонса страницы при размещении ссылки на нее в социальных сетях. Обычно для внедрения данной микроразметки использовать основные метаданные:
- og:title – заголовок страницы без названия сайта (брать из тега );
- og:type – тип мультимедиа, к которому относятся материалы, по умолчанию использовать значение website ;
- og:url – канонический URL страницы без переменных сеанса, параметров для идентификации пользователей и счетчиков;
- og:description – краткое описание страницы (брать из meta-описания description );
- og:image – URL изображения, описывающего объект.
С полным руководством на английском языке можно ознакомиться перейдя по ссылке .
Также можно почитать документацию на русском .
Для проверки результатов работы по внедрению можно с помощью сервиса Яндекса . Также существует сторонний сервис для проверки .
Для статичных страниц нам нужно добавить свойство страницы для хранения ссылки на изображение ( og:image ). Делаем это в административной части в разделе Настройки модуля «Управление структурой».
Теги og:title и og:description будут заполняться значениями стандартных свойств страницы («Заголовок» и «Описание»).
Значение og:type в данном случае зависит от информации, которая будет выводится на странице если это новости, статьи или описание товаров, оно будет равно article . Иначе – website .
Далее добавляем код для вывода разметки в файл header.php шаблона сайта. Он будет работать на страницах и со статической, и с динамической информацией.
В самом начале фрагмента кода мы вычисляем url текущей страницы, чтобы вывести его в атрибуте content свойства og:url .
Также обращу ваше внимание на значение og:locale и og:site_name , вывод которых размещен в конце описываемого фрагмента кода. Значение этих свойств одинаковое на всех страницах.
Для og:locale это ru_RU , а для og:site_name — $_SERVER[‘SERVER_NAME’] .
Также уточню, что на демо-сайте, шаблон которого мы редактируем существуют следующие разделы, содержащие динамическую информацию: /news , /catalog и /can_buy .
В указанных выше разделах на страницах размещены компоненты для вывода динамической информации. Например, bitrix:news , bitrix:catalog и другие. Если на статических страницах значения тега og_image бралось из свойства страницы, то сейчас его будем получать из поля изображения для анонса элементов соответствующих инфоблоков. Нам нужно кастомизировать шаблоны простых компонентов (в каталоге – список товаров и карточку товара, для новостей – детальную новость). Добавляем в шаблоны компонентов 2 файла ( result_modifier.php и component_epilog.php ) со следующим содержанием:
Для показа корректных значений og:title и og:description не забудем указать значение параметров ‘SET_META_DESCRIPTION’=>’Y’ и ‘SET_TITLE’=>’Y’ в вызовах компонентов catalog.section и news.list .
Больше никаких настроек не требуется. Теперь можно переходить к проверке. Если вы все сделали правильно, то при размещении ссылки в соцсети на страницу вашего сайта, в сниппете вы увидите изображение, название и описание страницы, которые вы вывели в шаблоне сайта в соответствующих тегах микроразметки OpenGraph.
Источник
Open Graph разметка в 1С-Битрикс
Open Graph — это стандарт метатегов, разработанный соц.сетью Facebook для передачи информации различным сервисам о содержании страницы.
Стандартной разметкой Open Graph пользуется большинство популярных социальных сетей Facebook, Вконтакте, Google+, Twitter, LinkedIn, Pinterest и другие.
Данные добавляются в секцию в виде метатегов:
В качестве свойств данной разметкой могут передаваться следующие параметры:
- og:url — ссылка на страницу
- og:type — тип передаваемого объекта
- og:title — заголовок страницы или объекта
- og:description — описание страницы или объекта
- og:image — превью изображение
Как же добавить данные параметры в шапку шаблона 1С-Битрикс, чтобы они автоматически отображали информацию текущей страницы, которой делится в соц.сети пользователь?
Для начала определим некоторые параметры, которые так же пригодятся для дальнейшего использования на сайте, в самом начале файла header.php вашей темы добавляем код:
Затем в секции добавляем наши метатеги с параметрами для вывода Open Graph разметки:
Для вывода og:url воспользовались конструкцией, которая формирует полную ссылку на текущую страницу:
Параметр og:type в нашем случае принимает значение website.
Для вывода заголовка og:title и описания og:description воспользовались функцией 1С-Битрикс $APPLICATION->ShowProperty, которая является отложенной функцией и позволяет выводить информацию выше того места, где она была задана. Т.е. при формировании страницы из блока новости, в заголовок будет попадать информация из title и description текущей новости, а не стандартные параметры раздела.
Остается последний очень важный параметр — превью нашей записи. Изображение можно создать из детальной картинки записи, обрезав его под размер 1200х630 px и передать в параметр og:image. Но при включенном автокешировании данные перестанут передаваться, когда страница будет загружена из кеша и вся конструкция развалится. Для этого необходимо сделать следующее:
1. В папке с шаблоном детальной страницы создать файл result_modifier.php и в нем добавить параметры, которые будут передаваться после кеширования:
2. Далее добавляем файл component_epilog.php, который формируется уже после вывода информации из кеша и в нем добавляем код, задающий изображение:
Вот таким способом мы можем добавить информацию о разметке Open Graph в шапку шаблона 1С-Битрикс.
Поделимся еще полезной ссылкой, которая позволяет проверить вид ссылок, которые будут публиковаться в Facebook и устранить ошибки:
Нам будет приятно
Еще интересное в блоге
Автоматическое переключение раскладки клавиатуры в поисковике 1С-Битрикс
Как сделать название раздела инфоблока заголовком страницы
Будем рады работать именно с вами
Политика конфиденциальности персональных данных
- Общие положения.
- Настоящая Политика конфиденциальности персональных данных (далее — Политика) действует в отношении всех персональных данных, которую компания Keengo (далее – Компания), может получить от пользователя (лица, заполнившего форму обратной связи, использующего другие сервисы официального сайта keengo.ru (далее – Сайт)), в частности в ходе: отправки отзывов или вопросов, заказа услуг, участия в рекламных и/или маркетинговых кампаниях или акциях и/или ином взаимодействии (далее – Услуги).
- Заполняя форму обратной связи и нажимая кнопку «Согласен/на», расположенную на странице Сайта, на которой размещена форма обратной связи, а равно указывая свои персональные данные при использовании других сервисов Сайта, пользователь выражает согласие с настоящей Политикой и указанными в ней условиями обработки и передачи его персональных данных. Согласие Пользователя на предоставление, обработку и передачу его Персональных данных Компании в соответствии с Политикой является полным и безусловным.
- Посетителям Сайта следует воздержаться от заполнения формы и/или от использования других сервисов Сайта в случае несогласия (полного или частичного) с Политикой, а равно несогласия предоставить персональные данные.
- Согласие, даваемое пользователем, включает в себя согласие на сбор, систематизацию, накопление, хранение, уточнение (обновление, изменение), использование, занесение в базы данных (в том числе электронные) Компании, передачу внутри Компании другим отделам и подразделениям или поставщику услуг, обязующегося выполнять условия договора о защите персональных данных, в целях рассылки информационных материалов и/или в рекламных целях (в том числе рассылку приглашений на мероприятия, проводимые/организованные Компанией), трансграничную передачу, блокирование, обезличивание, уничтожение персональных данных.
- Согласие, даваемое пользователем, распространяется на следующие персональные данные: фамилия, имя, отчество, адрес электронной почты, должность, наименование организации, в которой работает пользователь, контактный телефон.
- Срок действия согласия пользователя является неограниченным, однако, пользователь вправе в любой момент отозвать настоящее согласие путём направления письменного уведомления на адрес электронной почты: info@keengo.ru, с пометкой «отзыв согласия на обработку персональных данных».
- Персональные данные пользователей, которые получает и обрабатывает Компания.
- В рамках настоящей Политики под персональными данными пользователя понимаются персональные данные, которые пользователь предоставляет о себе самостоятельно при заполнении формы обратной связи на Сайте, при использовании других сервисов Сайта, при регистрации (создании учётной записи) на Сайте или в процессе использования услуг, предоставляемых Компанией. Соответствующая информация явно обозначена, к ней, в частности отнесены: фамилия, имя, отчество, адрес электронной почты, должность, наименование организации, в которой работает пользователь, контактный телефон. Иная информация предоставляется пользователем на его усмотрение.
- Компания исходит из того, что пользователь представляет достоверные персональные данные, а также, что пользователь имеет право предоставить персональные данные.
- 1С Битрикс.
- Компания использует средство 1С Битрикс для сбора сведений об использовании Сайта, таких как частота посещения Сайта пользователями, посещенные страницы и сайта, на которых были пользователи до перехода на данный Сайт. 1С Битрикс собирает только IP-адреса, назначенные пользователю в день посещения данного Сайта, но не имя или другие идентификационные сведения.
- 1С Битрикс размещает постоянный cookie-файл в веб-браузере пользователя для идентификации в качестве уникального пользователя при следующем посещении данного Сайта. Этот cookie-файл не может использоваться никем, кроме 1С Битрикс. Сведения, собранные с помощью cookie-файла, будут храниться на серверах, находящихся в Российской Федерации.
- Компания использует сведения, полученные через 1С Битрикс, только для обработки и хранения персональных данных.
- Цели обработки персональной информации пользователей.
- Компания обрабатывает только те персональные данные, которые необходимы для оказания услуг.
- Персональную информацию пользователя Компании может использовать в следующих целях:
- Идентификация стороны в рамках оказания услуги.
- Рассылка рекламных и/или маркетинговых материалов Компании, рассылка приглашений на мероприятия, конференции, выставки, проводимые и/или организуемые Компанией, проведение телемаркетинговых компаний.
- Проведение статистических и иных исследований, на основе обезличенных данных.
- Передача персональных данных пользователя третьим лицам.
- В отношении персональных данных пользователя сохраняется ее конфиденциальность, кроме случаев обработки персональных данных, доступ неограниченного круга лиц к которым предоставлен пользователем либо по его просьбе.
- Компания вправе передать персональную информацию пользователя третьим лицам в следующих случаях:
- Пользователь предоставил свое согласие на такие действия.
- Передача персональных данных организациям, которые оказывают услуги Компании по рассылке рекламных и/или маркетинговых материалов, организации и проведению мероприятий, конференций, выставок, телемаркетингу, обзвону потенциальных клиентов Компании.
- Передача необходима для достижения целей, осуществления и выполнения функций, полномочий и обязанностей, возложенных законодательством Российской Федерации на Компанию.
- Меры, применяемые для защиты персональных данных пользователей.
- Компания принимает необходимые и достаточные организационные и технические меры для защиты персональных данных пользователя от неправомерного или случайного доступа, уничтожения, изменения, блокирования, копирования, распространения, а также от иных неправомерных действий с персональными данными третьих лиц.
- Права и обязанности пользователя.
- Компания предпринимает разумные меры для поддержания точности и актуальности, имеющихся у Компании персональных данных, а также удаления устаревших и других недостоверных или излишних персональных данных, тем не менее, Пользователь несет ответственность за предоставление достоверных сведений, а также за обновление предоставленных данных в случае каких-либо изменений.
- Пользователь может в любой момент изменить (обновить, дополнить, блокировать, уничтожить) предоставленную им персональную информацию или её часть, а также параметры её конфиденциальности путем обращения в Компанию.
- Пользователь вправе в любой момент отозвать согласие на обработку Компанией персональных данных путём направления письменного уведомления на электронный адрес: info@keengo.ru с пометкой «отзыв согласия на обработку персональных данных», при этом отзыв пользователем согласия на обработку персональных данных влечёт за собой удаление учётной записи пользователя с Сайта и баз данных Компании, а также уничтожение записей, содержащих персональные данные, в системах обработки персональных данных Компании.
- Пользователь имеет право на получение информации, касающейся обработки его персональных данных Компанией.
Keengo · Web Design & Development
© 2010–2021 Все права защищены
Источник
Модуль OpenGraph для Битрикс. Быстрая и автоматическая интеграция
На неделе команда Dev2Fun выпустила новое обновление (1.1.0), которое сильно усовершенствовало модуль.
Всем кто использует версию 1.0.7 и младше, рекомендуем обновиться.
Миграция с 1.0.x на 1.1.x
Миграция происходит при обновлении автоматически.
Внимание ! В модуле закончена поддержка php5.3 и младше.
- Добавлен функционал страниц исключений вывода OpenGraph
Теперь вы можете указать страницы на которых не нужно выводить теги OpenGraph.
Пути до страниц указывать от корня.
Задача:
Нужно запретить вывод мета-тегов OpenGraph для страницы «/catalog/auto/audi/a8/», а также запретить вывод для главной страницы.
Решение:
Указываем в поле «catalog/auto/audi/a8/», а в другом поле «index» (index, от корня, это ключевое значение, которое модуль воспримет за главную страницу).
- Добавлена возможность указать OpenGraph в элементах инфоблока
[IMG >
Выводятся все поля, которые указаны в настройках модуля.
Поле description — выводится как textarea
Поле image- выводится как fileinput
Все остальные поля выводятся, как input
Поля которые не выводятся, но значения проставляются автоматически:
- url — текущая отображаемая страница
- image:width — ширина картинки, которая сейчас в og:image
- image:type — тип картинки (png,jpg, etc.), которая сейчас в og:image
- image:height — высота картинки, которая сейчас в og:image
- site_name — название сайта из настроек сайта
- Добавлена возможность указать OpenGraph в разделах инфоблока
[IMG >
Выводятся все поля, которые указаны в настройках модуля.
Поле description — выводится как textarea
Поле image- выводится как fileinput
Все остальные поля выводятся, как input
Поля которые не выводятся, но значения проставляются автоматически:
- url — текущая отображаемая страница
- image:width — ширина картинки, которая сейчас в og:image
- image:type — тип картинки (png,jpg, etc.), которая сейчас в og:image
- image:height — высота картинки, которая сейчас в og:image
- site_name — название сайта из настроек сайта
- Добавлена настройка вывода OpenGraph полей в элементах и разделах
Как интегрировать поддержку OpenGraph
Мы сделали автоматический вывод Open Graph для:
- title — из заголовка страница
- description — из описания страницы
- url — текущая страница
- site_name — название из настроек сайта
- type — по умолчанию website
Для всего остального и собственных полей мы сделали 2 способа интеграции
Указать на нужных страницах названия полей добавляя впереди «og:»
Переписать поле og:title
Установить значение в og:image
Установить любое своё свойство, допустим og:custom
Предварительно нужно проверить добавлено ли поддержка custom в настройках модуля, если нет, то добавить
Если нужно сделать установку значений из элементов и разделов, то необходимо прописывать в result_modifier.php используемого шаблона.
После чего сбросить кэш.
Этот способ наиболее проще первого, но, в данной версии, представляет меньше гибкости.
Этот способ мы сделали для более удобной интеграции Open Graph в компонентах.
Необходимо в result_modifier.php или component_epilog.php прописать вызов метода:
Где $refIf — идентификатор элемента или раздела
Где $type — тип объекта element или section.
element — вывод для элементов инфоблока
section — вывод для разделов инфоблока
Источник