Скрыть слово «подписчики» в кнопке «Твиттер» - PullRequest
1 голос
/ 03 октября 2019

Twitter предлагает следующий код для отображения кнопки «следовать» на вашем сайте.

<a href="https://twitter.com/twitter" class="twitter-follow-button" data-size="large" data-show-screen-name="false" data-dnt="true" data-show-count="true"></a>

<script async src="https://platform.twitter.com/widgets.js" charset="utf-8"> 
</script>

На кнопке отображается имя пользователя, за которым следует значок с числом подписчиков и словом «подписчики». enter image description here

Я хочу упростить кнопку, удалив слово «последователи». Было CSS решение 7 лет назад, которое включало использование overflow:hidden и затем рисование фиктивной границы, где пузырь был обрезан. Однако это решение работает не очень хорошо, как описано в комментариях к этому ответу.

Есть ли сегодня более элегантное решение? CSS был бы лучшим, но также был бы приемлем JavaScript / jQuery.

Ответы [ 2 ]

2 голосов
/ 03 октября 2019

К сожалению, я не думаю, что есть практическое решение для того, чего вы пытаетесь достичь.

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

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

Редактировать: для полноты эта страница перечисляет параметры, которые вы можете передатьAPI виджета. На момент написания этой статьи не было никаких параметров, кроме "show_count", относящихся к отображаемому количеству подписчиков.

1 голос
/ 03 октября 2019

Я бы предложил сделать следующее:

  • Сначала , добавить кнопку follow следующим образом:
<iframe
  src="//platform.twitter.com/widgets/follow_button.html"
  style="width: 88px; height: 20px;"
  allowtransparency="true"
  frameborder="0"
  scrolling="no">
</iframe>
  • Второй , используйте Документация по API Twitter и используйте его конечные точки GET followers/list, чтобы отобразить число счетчиков без слова.
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...