Укажите изображение при обмене с помощью кнопки Google +1

По этой ссылке я научился указывать URL для кнопки Google +1.

укажите пользовательский URL для gplus одной кнопкой.

Могу ли я также указать конкретное изображение?

отредактированный

Мне не нужно менять gif кнопки Google plus или фон кнопки Google plus. Мне нужно указать изображение, которое пользователь хочет поделиться в социальной сети.

Возможно?

Источник

2 ответа

Решение

Да, это возможно.

Вы имеете в виду, что вы хотите указать изображение, которое будет отображаться в фрагменте, который создается при публикации в Google+. Кнопка +1 делает две вещи: 1) добавляет 1 к счетчику при нажатии и 2) опционально позволяет пользователю поделиться вашим URL в Google+ и комментировать его.

То, о чем вы спрашиваете, является второй частью этого взаимодействия и задокументировано по адресу https://developers.google.com/+/plugins/snippet/

На этой странице есть инструмент, который может помочь вам сгенерировать HTML-код, который вам нужно вставить на свою страницу. Вы также можете выбрать один из трех способов указания информации о фрагменте.

Пример использования разметки schema.org:

<!-- Update your html tag to include the itemscope and itemtype attributes. -->
<html itemscope itemtype="http://schema.org/Article">

<!-- Add the following three tags inside head. -->
<meta itemprop="name" content="My Cool Article">
<meta itemprop="description" content="This is the greatest site ever">
<meta itemprop="image" content="http://example.com/mycoolimage.png">
Источник

Чтобы указать пользовательское изображение, которым вы хотите поделиться с помощью кнопки "Поделиться":

К сожалению, это невозможно. Вы можете настроить только URL и язык; см. документацию

Изменить: это на самом деле возможно, см . Ответ Бретта.

Чтобы использовать собственное изображение для кнопки "+1":

Поскольку Google хочет, чтобы кнопки +1 выглядели одинаково, это невозможно с официальным Google +1 JavaScript. Однако с помощью такого трюка можно настроить изображение.

Хитрость в том, чтобы установить непрозрачность CSS в 0, как это:

.myCustomButton *{
    /*Hide real +1 button*/
    opacity:0;
    -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";  
    filter:alpha(opacity=0);
}

.myCustomButton{
  display:inline-block;

  /*The width and height of your image. Not bigger than the Like button!*/
  width: 10px;
  height: 10px;

  /*Your image*/
  background:url(gplus.png);
}
Источник
Другие вопросы по тегам