Клуб пользователей блока «Поделиться»

Поделиться google, кодировка (неправильный tittle, description)

После нажатия кнопки "поделится, на g+" при создании поста внизу (там где ссылка ), вместо тайтла отображает иероглифы. С остальными кнопками всё хорошо. Менял кодировки разными способами, всеровно без толку.

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

Кодировка скрипта - utf-8, кодировка сайта тоже - utf-8

<script src="//yastatic.net/es5-shims/0.0.2/es5-shims.min.js"charset="utf-8"></script>
<script src="//yastatic.net/share2/share.js" charset="utf-8"></script>
<div class="ya-share2" data-lang="ru" data-services="vkontakte,facebook,odnoklassniki,moimir,gplus,twitter,viber,telegram"></div>

22 комментария
Ответил на StackOverflow.
Обновлено 29 октября 2017, 21:59
К сожалению, непонятно кто, где, как и кому ответил на StackOverflow. Ни ссылки, ни иной информации. У меня аналогичная проблема.

Еще раз: при нажатии кнопки "поделиться" в G+ отображается неверная кодировка. Как исправить?
seadima,
Добавил в комментарий ссылку на обсуждение. 


Можете указать там ссылку на проблемную страницу, будем посмотреть.
Роман Сидор
31 октября 2017, 12:35
Вот, допустим даже здесь http://u0409377.plsk.regruhosting.ru/index31.html
На чистом коде всё та же проблема. Возможно (скорее всего)  проблема от идёт хостера. Сайт на windows IIS. Может быть нужно что-то нужно прописать в web.config, или я чего-то не знаю...
Опять же, повторюсь .html сохранён в utf-8
Обновлено 31 октября 2017, 12:35
Такая проблема и у меня. Хорошо, что решил проверить в интернете. Вопрос открыт.
такая же проблема, проверил на десятке своих сайтов, ранее делился ими в google+ с нормальной кодировкой.
Коллеги, проверьте, какое содержимое заголовка `Content-Type` отдаёт сервер.


Есть вероятность, что он отдаёт text/html, а должен text/html; charset=UTF-8.
sameoldmadness,


Оп-па. А если сервер у меня выдает text/html; charset=WINDOWS-1251 ?
Роман Сидор
2 ноября 2017, 02:20
Да, всё верно. 
Я указал глобализацию в web.config на utf-8, и в asp.net. Сервер все равно выдает text/html. Возможно я что-то делаю не так, ибо впервые сталкиваюсь с такой проблемой.


Content-Type: 
Content-Encoding: gzip
Last-Modified: Wed, 01 Nov 2017 21:45:36 GMT
Accept-Ranges: bytes
ETag: "278b6cc05a53d31:0"
Vary: Accept-Encoding
Server: Microsoft-IIS/10.0
X-Powered-By: ASP.NET
X-Powered-By-Plesk: PleskWin
Date: Wed, 01 Nov 2017 23:04:55 GMT
Content-Length: 464
Роман Сидор
2 ноября 2017, 14:52
Всё, разобрался, спасибо за подсказку. 
В web.config прописал:


<system.webServer>
<staticContent>
<remove fileExtension=".html" />
<mimeMap fileExtension=".html" mimeType="text/html; charset=UTF-8" />
</staticContent>
</system.webServer>


И всё работает.
Все-таки, как быть, если сервер у меня выдает text/html; charset=WINDOWS-1251 ?
Ради социальных кнопок от Яндекса - менять кодировку сервера?
seadima@goon.ru,
Не ради социальных кнопок от Яндекса, а ради возможности поделиться в Google Plus. Это гугловый робот приходит к вам на страницу и забирает с неё данные.
1. Проблема с кодировкой на G+ исчезла, видимо - исправили в Яндексе. Спасибо.
2. Однако, если пользоваться блоком "поделиться" в том виде, в котором он приведен здесь на сегодняшний день: https://tech.yandex.ru/share/  (т.е. теперь - без указания кодировки), то при наведении мыши на "Яндекс-коллекции" и "ВК" -  подписи (title)  отображаются нечитаемыми символами (т.е. там, где д.б. русский шрифт).

3. Еще попутный вопрос: могу ли я вносить изменения в исходный код блока "поделиться"? В правилах использования ничего об этом не сказано. 

Дело в том, что сайт работает на XHTML. Соответственно, атрибуты вида data-services являются невалидными. Невалидных страниц на моем сайте БЫТЬ НЕ ДОЛЖНО в принципе.

Поэтому я удалил атрибут data-services  из блока div, оставив там только класс. А потом вставил этот атрибут при помощи javascript (одна строчка кода) - после загрузки страницы.  Вначале все работало, как полагается, но где-то через полчаса - вместо 8 кнопок отображаются лишь 4: Яндекс-коллекции, ВК, Fb и Твиттер. Вероятно, Яндекс запрещает модифицировать блок "поделиться", потому через полчаса он заблокировал добавление атрибутов в div из блока "поделиться"?
Кроме того, я в теги script задал атрибут type="text/javascript" (для валидации, опять же). Это тоже делать нельзя было?
Обновлено 11 ноября 2017, 16:29
dmitry.html,
Добрый вечер.
> Проблема с кодировкой на G+ исчезла, видимо - исправили в Яндексе
Нет, проблема была на стороне Google. Исправили её тоже Google, мы никакой возможности повлиять на это поведение не имеем.


> при наведении мыши на "Яндекс-коллекции" и "ВК" - подписи (title) отображаются нечитаемыми символами
На этот случай у нас есть рецепт. В целом, мы рекомендуем использовать кодировку utf-8, тогда таких спецэффектов наблюдаться не будет.


> Еще попутный вопрос: могу ли я вносить изменения в исходный код блока "поделиться"?
Можете. Но в таком случае мы не можем гарантировать, что блок сохранить работоспособность при очередном обновлении. Модификация исходного кода не запрещается, но и не рекомендуется.


> Дело в том, что сайт работает на XHTML. Соответственно, атрибуты вида data-services являются невалидными.
Вы можете воспользоваться программной инициализацией и передавать все параметры в конструктор.


> Яндекс запрещает модифицировать блок "поделиться", потому через полчаса он заблокировал добавление атрибутов в div из блока "поделиться"?
Этим мы точно не занимаемся : ) Возможно, это событие совпало с каким-то другим изменением в вашем коде.


> Кроме того, я в теги script задал атрибут type="text/javascript" (для валидации, опять же). Это тоже делать нельзя было?
Можно.
В общем, хотелось бы получить добротный и расширенный ответ службы поддержки (если она теперь в Яндексе есть), чтобы снять данную тему и чтобы всем остальным вебмастерам тоже было понятно. Я всегда своим посетителям (сайтов) все разъясняю добротно и ясно, здесь жду того же.

Если нельзя модифицировать код блока "поделиться", так, может, проще тогда сделать что-то самописное или использовать блоки от других производителей? Или пользоваться старой версией (она теперь, вроде, тоже работает нормально), примерно такой:
<script type="text/javascript" src="//yastatic.net/share/share.js" charset="utf-8"></script>
<div class="yashare-auto-init" ></div>

dmitry.html,
Модифицировать код можно, но впоследствии могут возникнуть проблемы с работоспособностью блока – мы не можем гарантировать, что пользовательские изменения продолжат корректно функционировать.


Пользоваться старой версией точно не стоит. Она давно не обновляется, а социальные сети периодически меняют схемы url для поделения.


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



Благодарю Вас за развернутые ответы!
Вот, взял со своего сайта, только что доработал.  Все валидно (в XHTML) и хорошо (кодировка страницы - windows-1251). Может, кому пригодится:
<script type="text/javascript" src="https://yastatic.net/es5-shims/0.0.2/es5-shims.min.js" charset="utf-8"></script>
<script type="text/javascript" src="https://yastatic.net/share2/share.js" charset="utf-8"></script>
<div id="my-share" class="ya-share2" ></div>
<script type="text/javascript">
var share = Ya.share2('my-share', {
theme: { // параметры, относящиеся к внешнему виду блока:
services: 'collections,gplus,blogger,vkontakte,facebook,lj,telegram,viber,whatsapp,odnoklassniki,moimir,twitter', // Список идентификаторов социальных сетей, отображаемых в блоке
counter: false, // Признак того, что на кнопке соцсети отображается счетчик публикаций (true - счетчик включен, false - выключен)
lang: 'ru', // Язык - русский
limit: 7, // Максимальное количество отображаемых значков для соц. сетей после загрузки страницы (остальные появятся в pop-up по нажатии на кнопку ...)
size: 'm', // Размеры значков: большие
bare: false, // Признак того, что загрузка стилей отключена. Если добавить параметр (true), соцсети будут отображаться в виде текстового вертикального списка.
popupDirection: 'top' // Направление открытия pop-up (top - вверх)
}
});
</script>
dmitry.html,
Отлично : )


На будущее, подобные вопросы лучше задавать на StackOverflow (ссылка есть на главной странице блога). Там хорошие инструменты для разметки кода, и ваш ответ бы пригодился большему количеству разработчиков.
Абдухамид Т.
23 ноября 2017, 21:32
Проблема  с  G+ до сих пор осталась. Моя гугловская страница открывается с подсказкой "Загрузка" и  висит  без признаков жизни ...
Обновлено 23 ноября 2017, 21:34
Абдухамид Т.,
Судя по описанию, это другая проблема, а не та, что обсуждается в этой теме.


Пожалуйста, создайте отдельную тему. Также будет здорово, если вы по шагам опишите, как воспроизвести ошибку, и приложите ссылку на страницу.
Решение вопроса для битрикс https://dev.1c-bitrix.ru/community/forums/forum6/topic104055/