Как «привязать» к главной логотип для соцсетей?

Question

Rezonatorrr @Rezonatorrr

Как «привязать» к главной логотип для соцсетей?

Есть сайт, но при добавлении ссылки на его главную страницу в соцсетях логотип не прикрепляется автоматически. А если в сайдбарах есть картинки, то вот они подтягиваются почему-то. Кто знает как решить проблему? Разметка сайта Schema если что

Вопрос задан более трёх лет назад
118 просмотров

Комментировать

Подписаться 1 Простой Комментировать

Помогут разобраться в теме Все курсы

Яндекс Практикум

Профессиональная вёрстка на HTML и CSS

3 месяца

Далее
Stepik

Основы HTML и CSS

2 недели

Далее
OTUS

HTML/CSS

3 месяца

Далее

Пригласить эксперта

Ответы на вопрос 1

17 комментариев

Rezonatorrr @Rezonatorrr Автор вопроса

пробовал просто прописывать этот og:image, но не действует

Написано более трёх лет назад
iBird Rose @iiiBird Куратор тега CSS

Rezonatorrr, там как бы еще кэш есть самих соц. сетей. он сразу и не начнет работать

Написано более трёх лет назад
Rezonatorrr @Rezonatorrr Автор вопроса

iBird Rose, ну проверяю на телеграме

Написано более трёх лет назад
iBird Rose @iiiBird Куратор тега CSS

Rezonatorrr, ну из того что нагуглил - этот бот телеги @webpagebot обновлять ссылки должен. но сам не проверял

Написано более трёх лет назад
Сергей Яковлев @sergeyakovlev

Ещё тег (meta rel="icon" href="…" sizes="…") надо попробовать. Возможно, дело в этом.
По хорошему, поставить их оба (вместе с og:image) и всё будет норм.

Написано более трёх лет назад
Rezonatorrr @Rezonatorrr Автор вопроса

Сергей Яковлев, как именно они должны выглядеть в полном варианте?

Написано более трёх лет назад
Сергей Яковлев @sergeyakovlev
<head> <meta property="og:image" content="/og.png"> <meta rel="icon" href="/icon.png" sizes="192x192" type="image/png"> </head>

icon.png — квадратный
og.png — прямоугольный
Написано более трёх лет назад

Rezonatorrr @Rezonatorrr Автор вопроса

Сергей Яковлев, не вставляется - пишет "Невозможно соединиться с сайтом для проверки кода на ошибки, был сделан откат изменений в PHP-коде. Вам нужно загрузить измененный PHP файл другим способом, например через FTP или SFTP."

или в конце названий файлов обязательно должно быть og и icon?

там полный код такой этого места:

<head>
	<meta charset="<?php bloginfo( 'charset' ); ?>">
	<?php if( ! penci_get_theme_mod( 'penci_disable_reponsive' ) ): ?>
	<meta name="viewport" content="width=device-width, initial-scale=1">
	<?php endif; ?>
	<link rel="profile" href="http://gmpg.org/xfn/11">
	<?php wp_head(); ?>
	<style>
		a.custom-button.pencisc-button {
			background: transparent;
			color: #D3347B;
			border: 2px solid #D3347B;
			line-height: 36px;
			padding: 0 20px;
			font-size: 14px;
			font-weight: bold;
		}
		a.custom-button.pencisc-button:hover {
			background: #D3347B;
			color: #fff;
			border: 2px solid #D3347B;
		}
		a.custom-button.pencisc-button.pencisc-small {
			line-height: 28px;
			font-size: 12px;
		}
		a.custom-button.pencisc-button.pencisc-large {
			line-height: 46px;
			font-size: 18px;
		}
	</style>
	<script charset="UTF-8" src="//web.webpushs.com/js/push/9690bff07354bbe571ab8a1b6ab025bf_1.js" async></script>
</head>

Написано более трёх лет назад

Сергей Яковлев @sergeyakovlev
Немного спутал:

<head> <meta property="og:image" content="/og.png"> <link rel="icon" href="/icon.png" sizes="192x192" type="image/png"> </head>

Ну и изображения, конечно же, должны лежать на своих местах. И мена файлов могут быть любыми.
Написано более трёх лет назад
Rezonatorrr @Rezonatorrr Автор вопроса

Сергей Яковлев, а если только первый вставить, то работать не будет в любом случае?

Написано более трёх лет назад
Сергей Яковлев @sergeyakovlev

Если ссылка на сайт в ленте соцсети, то будет с первым тегом работать.
Я спутал с блоком «Ссылки» в ВК. Там, возможно, второй тег нужен.

Написано более трёх лет назад
Rezonatorrr @Rezonatorrr Автор вопроса
Сергей Яковлев, не знаю, в таком виде не хавает:

<meta charset="<?php bloginfo( 'charset' ); ?>"> <?php if( ! penci_get_theme_mod( 'penci_disable_reponsive' ) ): ?> <meta name="viewport" content="width=device-width, initial-scale=1"> <?php endif; ?> <link rel="profile" href="http://gmpg.org/xfn/11"> <?php wp_head(); ?> <meta property="og:image" content="https://....info/wp-content/uploads/2020/03/logo2-small.png">

пишет то же самое про невозможно соединиться. Или он тупо просит, чтоб только через фтп менять этот файл
Написано более трёх лет назад
Сергей Яковлев @sergeyakovlev

1. Функцию wp_head() лучше подключать в самом конце, перед закрытием head.
2. Картинку желательно делать в пропорциях 2x1. Например, 960x480px. У каждой соцсети свой формат, но так получается вполне норм (за исключением ВК).
3. Кто просит? Где просит? Если строки уже добавлены в файл, зачем FTP? Где и как меняешь код?

Написано более трёх лет назад
Rezonatorrr @Rezonatorrr Автор вопроса

Сергей Яковлев, админка просила, изменил через фтп. Нужно какое-то время для кеширования, чтобы это заработало, или нет?

Написано более трёх лет назад
Сергей Яковлев @sergeyakovlev

Открой исходный текст открытой страницы (Ctrl+U в браузере). Если в коде есть нужный тег и картинка, указанная в нём открывается нормально, то всё ок.
Ну или вот: developers.facebook.com/tools/debug (есть кнопка «Повторить скрапинг»).

Написано более трёх лет назад
Rezonatorrr @Rezonatorrr Автор вопроса

Сергей Яковлев, тег в коде есть, картинка открывается, а в телеге не прикрепляется если вставлять ссылку на главную

Написано более трёх лет назад
Сергей Яковлев @sergeyakovlev

Вот теперь хз, должно работать. Повтора тега с другим значением нет? Фейсбук Девелоперс что показывает?

Написано более трёх лет назад