Если вам необходимо отслеживать статистику через Яндекс метрику, убедитесь, что вы установили Яндекс счетчик у себя на странице. Скопируйте ID счетчика, в дальнейшем вам нужно будет вставить этот ID в переменную counter в части кода ниже.

Вариант #1

Вы можете вставить этот код отслеживания в любом месте на вашей странице. Когда произойдет одно из действий (поделиться, мне нравится, подписаться и т.д.) данные сразу же попадут в метрику.

Для просмотра статистики в Yandex Metrika необходимо в панели управления выбрать раздел «Отчеты» — «Стандартные отчеты» — «Содержание» — «Параметры визитов».

Yandex metrika панель управления

Теперь перед вами будет пустой график, а под ним находиться список ваших страниц, на котором установлен наш код. Возле интересующей вас страницы нажмите на значок «+», перед вами расскроется меню со всеми доступными социальными сетями. Вы можете отметить, те которые вам необходимы. Так же если нажать соответствующий значок возле социальной сети можно узнать, какое именно действие произвел с данной социальной сетью.

После того, как вы выберите необходимые социальные сети, в графе «Количество параметров визитов» вам необходимо нажать на значок диаграммы, после чего выше сгенерируется график в соответствии с теми параметрами, которые вы выбрали.

Вариант #2

Работа с целями в Яндекс метрике. Для начала вам нужно создать цели с такими названиями:

timer — это событие сработает, когда замок будет открыт по таймеру, cross — это событие сработает, когда замок будет открыт через кнопку закрыть. click_sociallocker, click_signinlocker, click_send_form — сработают, когда пользователь откроет замок через одну из социальных кнопок, кнопок авторизации или email форму.

Также вы можете создать события для определенных кнопок. И создать свои условия, как в примере ниже.

Подробнее про создание целей в яндекс метрике, можете почитать тут.

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


Пример работы:

Ваш скрытый контент.

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

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

 

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

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

Функция может быть установлена в любой части страницы, последующее объявление этой функции перезапишет ранее объявленные функции.

Подписка на события

Допустим, нам нужно реализовать какое-то действие, когда социальный замок будет разблокирован. Для этого нам нужно подписаться на событие opanda-unlock.

Пример (нажмите на крестик или социальную кнопку, чтобы открыть замок):

Скрытый контент пример #1

Если вам необходимо выполнить действие, когда замок скроет контент на странице, используйте для этого событие opanda-lock. Метод используется в различных модификациях плагина, в основном для добавление элементов в контейнер замка.

Пример (нажмите сюда, чтобы продемонстрировать работу этого метода):

Скрытый контент пример #2

 

Событие opanda-cancel будет вам полезным, когда нужно будет определить, открывал ли пользователь замок ранее. Если замок к которому привязано это событие, раньше открывался пользователем и данные об этом сохранены в cookie пользователя, то будет вызвано событие opanda-cancel.

 

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

text.header
тип данных: string/html
по умолчанию: null
Необязательно. Устанавливает заголовок замка.

Пример:

text.message
тип данных: string/html
по умолчанию: null
Необязательно. Устанавливает описание замка.

Пример:

content
тип данных: string/html
по умолчанию: null
Необязательно. Устанавливает контент, который должен быть показан после открытия замка, по умолчанию
установлен css селектор.

Пример:

theme
тип данных: string
по умолчанию: ‘default’
Необязательно. Устанавливает тему замка. Возможные значения: default, secrets, flat, dandyish, glass.

Пример:

cssClass
тип данных: string
по умолчанию: null
Необязательно. Добавляет CSS к замку.

Пример:

lang
тип данных: string
по умолчанию: ‘ru_RU’
Необязательно. Устанавливает язык социальных кнопок. Смотрите полный список поддерживаемых языков здесь:
https://www.facebook.com/translations/FacebookLocales.xml

Пример:

buttons.order
тип данных: array
по умолчанию: [«facebook-like», «twitter-tweet», «google-plus»]
Необязательно. Устанавливает сортировку кнопок, в порядке установленных id.
Возможнные значения: twitter-tweet, twitter-follow, facebook-like, facebook-share,
google-plus, google-share, linkedin-share, youtube-subscribe.

Пример:

buttons.counters
тип данных: bool
по умолчанию: true
Необязательно. Если true, устанавливает счетчик для социальный кнопок (Twitter кнопка не поддерживает
счетчик).

Пример:

overlap.mode
тип данных: string
по умолчанию: ‘full’
Необязательно. Если включена эта опция, на спрятанное содержимое будет наложен прозрачный или размытый слой.
В Internet Explorer размытие поддерживается в версии 10-11 и Edge.
Возможные значения: full, transparence, blurring.

Пример:

overlap.position
тип данных: string
по умолчанию: ‘top’
Необязательно. Позиция замка относительно размытого содержимого…
Возможные значения: middle, top, scroll.

Пример:

overlap.intensity
тип данных: integer
по умолчанию: 5
Необязательно. Устанавливает интенсивность размытия для режима наложения blurring (от 0 до 10).

Пример:

demo
тип данных: bool
по умолчанию: false
Необязательно. Если true, замок будет появляться всегда. Без запоминания в cookie.

Пример:

highlight
тип данных: bool
по умолчанию: true
Необязательно. Если true, открытие замка запоминаться не будет и при обновлении страницы, замок снова
закроет контент..

Пример:

googleAnalytics
тип данных: bool
по умолчанию: false
Необязательно. Если true, плагин будет генерировать события
для Google аналитики, когда замок будет разблокирован.
Внимание:
перед включением этой функции, пожалуйста убедитесь, что на вашем сайте установлен код Google аналитики, чтобы отслеживать данные.

Пример:

locker.close
тип данных: bool
по умолчанию: false
Необязательно. Если true,в углу замка появляется кнопка закрыть, при нажатии на нее, замок разблокируеются..

Пример:

locker.timer
тип данных: bool/integer
по умолчанию: false
Необязательно. Интервал таймера, через который замок будет разблокирован.

Пример:

locker.mobile
тип данных: bool
по умолчанию: true
Необязательно. Если true, замок будет показан на мобильных устройствах. По умолчанию, true.

Пример:

locker.useCookies
тип данных: bool
по умолчанию: false
Необязательно. Плагин будет вынужден использовать cookies вместо Local Storage.

Пример:

locker.scope
тип данных: bool/string
по умолчанию: false
Необязательно. Позволяет объеденить замки в одну группу.
Если один замок с установленной группой будет открыт, то все остальные замки сделают тоже самое.

Example:

Пример скомбинированных настроек:


Как это выглядит:

Ваш скрытый контент.

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

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