Задать вопрос
ws17
@ws17
opengraph

Open Graph — кто внедрял, есть вопросы, как реализовывают для разных страниц сайта?

Всем привет.

Кто делал разметку Open Graph для соцсетей .
Сегодня увлекся, читал статьи разные и т.д, но они будто под копирку скопированы.
Как для главной сделать я понял, а как сделать для других стнаниц если у меня не html страницы, а сайт с админкой.

Вопросы:

1)Важно ли запихивать в html теги? вот так 
(<html lang="ru" prefix="og: http://ogp.me/ns# fb: http://ogp.me/ns/fb#">)
.

2)Насчет 
<meta property="og:title" content="<?= $title ?>"/>
и других где описание и урл страницы, я так понимаю чтобы для всех страниц сделать, надо сделать код который определяет на какой мы странице и чтобы в поле <meta property="og:url" content= " " /> подставлял автоматом урл страницы на которой нахожусь, так лучше сделать?

С титле, дискрипшионом, проблем нет, я просто код запихал, который метатеги эти выводит и все. Теперь какой титл на странице и дискрпшион, он выводит и в этих тегах для соцсетей.

3)Как быть с картинкой? <meta property="og:image" content=" "/>, допустим на главной странице нет картинки и я туда запихал ссылку, сделал картинку, а что если на других страницах есть картинки в текстах, то как с этим быть? если допустим я хочу чтобы на других страницах бралась картинка из контента.

4) Достаточно ли для твита этого? (или чего-то не хватает еще).
<meta name="twitter:title" content=" " />
<meta name="twitter:description" content=" " />
<meta name="twitter:url " content=" " />
<meta name="twitter:cart" content="summary" />


5)Насчет html, если я нахожусь в статье, то я читал что надо добавлять еще мета в html сюда, 
<html lang="ru" prefix="og: http://ogp.me/ns# fb: http://ogp.me/ns/fb#">
, это важно?

Вот думаю как все это удобно и лучше реализовать. Ну и само собой правильнее, вот допустим если я в статье нахожусь и там есть картинки, и вообще если в статье то надо менять тег <meta property="og:type" content="website" />, вместо website, там другое. Это же надо как-то определять страницу и подставлять к ней другой вариант ввода в этом поле, ну и плюс вставлять код, который будет выводить картинку в этом теге <meta property="og:image" content=" "/>, а как размеры будет определять непонятно ____), или лучше там где есть картинка, тупо убрать этот мета <meta property="og:image" content=" "/>.

Вообщем спецы, подскажите как реализовываете, что ставите, может где есть видео толковое об этом или статья. Где будет все рассжовано.
  • Вопрос задан
  • 327 просмотров
5 комментариев
Подписаться 1 Простой 5 комментариев
Пригласить эксперта
Ответы на вопрос 1
OCTAGRAM
@OCTAGRAM
чтобы в поле 《meta property="og:url" content= " " /》 подставлял автоматом урл страницы на которой нахожусь, так лучше сделать?


Там должен быть каноничный URL, и о том, как правильно формировать его, знает только вебмастер. Всяких CloudFlare-hCaptcha clearance и UTM-параметров не должно быть.

Что касается картинки, я сделал такую логику: на главной странице картинка по умолчанию и режим твиттер-карточки большой. На прочих страницах, если есть индивидуальное изображение, твиттер-карточка тоже большая, а иначе картинка по умолчанию на малой карточке.

Что касается title, в обычном title он может иметь вид «Название статьи — Название сайта», а для соцсетей это распиливается на части

менять тег 《meta property="og:type" content="website" /》, вместо website, там другое.


if URL_Pathname = "/" then
         Append
           (Response_Message_Body,
            "   <meta property=""og:type"" content=""website"" />" & LF);
      else
         Append
           (Response_Message_Body,
            "   <meta property=""og:type"" content=""article"" />" & LF);
      end if;
Ответ написан
1 комментарий
1 комментарий
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы
Вакансии с Хабр Карьеры
Второй ведущий разработчик (Fullstack, PHP, Laravel, Vue, Mysql)
Donatov.net
от 100 000 до 300 000 ₽
Продакт дизайнер в финтех
Module Agency
от 110 000 до 190 000 ₽
Golang developer middle
Posman
До 200 000 ₽
Ещё вакансии
Заказы с Хабр Фриланса
Необходимо сверстать приложение согласно макету Figma используя React
26 апр. 2024, в 22:22
1500 руб./за проект
Написать модуль подключения матрицы Sony к ПЛИС (Verilog)
26 апр. 2024, в 21:30
15000 руб./за проект
8266 f12 требуется сделать ревью и оптимизировать работу
26 апр. 2024, в 20:42
2000 руб./за проект
Ещё заказы