Triggering widgets from page elements
Samantha avatar
Written by Samantha
Updated over a week ago

To complete this process, you must have access to your website source code, be relatively comfortable with HTML (or have a developer that can help you).

It's possible to trigger widget overlays from a page element such as a link, say, in your masthead across your entire site. You can also trigger widgets from fixed elements such as an image or button that you serve (as opposed to a share button that you'd upload to your widget that is served by Friendbuy).

Here's an example of page text with a referral offer:

Step 1

The following lines need to be added under the <head></head> section of the page where you want to trigger the widget from a page element. Replace the XX-XXX shown below with the widget identifier found in the widget code (steps shown below).


  window['friendbuy'] = window['friendbuy'] || [];
  window['friendbuy'].push(['widget', 'XX-XXX', {configuration: {share_button:false}}]);

Get the widget identifier by logging into your Friendbuy dashboard and go to > Widgets > (select your widget) > Display Settings > Get the Code

Step 2

To activate the widget from any HTML element on your page, simply add the following CSS class to that element:

class=“friendbuy-XX-XXX”

Where XX-XXX is the widget identifier code.

Example

Trigger a widget from anchor text.

The "friendbuy-XX-XXX" css class on the anchor below pops up the widget when the link "View Widget" is clicked.

Did this answer your question?