Table of Contents
This document describes how to create a "Referral" web widget that allows your audience to refer you and share your content in the social media
Create a web widget to allow your audience to refer you and your work through the social media. Reach more audience and build a mailing list.
The code snippet will create a button, when the audience clicks in the widget will be displayed with a textarea and three buttons to share on Twitter, Facebook and Email.
When someone clicks it an API Call ("twitter_share") will be sent to Conducttr so you can track your audience behaviour, and a Twitter pop-up will appear so they can post it to their timelines.
When someone clicks it an API Call ("facebook_share") will be sent to Conducttr so you can track your audience behaviour, and a Facebook pop-up windoe will appear so they can post it to their wall.
When someone clicks it, a new form will appear. They can fill the "FROM" and the "To" email address and send an email to sometone.
When they click an API Call ("email_share") will be sent to Conducttr, registering them in your project and sending an email to them.
Each recipe has the following sections:
- Ingredients - what you need to complete this project
- Preparation - how to prepare
- Method - step-by-step guide
You will need:
- A website. This recipe will work with any website including free website builders like Wix.com
- The Conducttr widget addon code snippet (found it on GitHub)
- Basic text-ending software to edit the code such as Notepad
- An email account.
Before following the Method section, please do the following:
- Create a Conducttr project using the Template "Referral Widget"
- Create new API entry inside Conducttr (call it Website)
- If you are using the template just enter the "Website" API entry, go to the Authentication tab and click "Reset my Consumer Key and Consumer Secret"
- Configure the Narrator's email account.
Now you have all the ingredients and you’ve followed the preparation, you’re now ready to configure the project. The steps are:
- Grab the code (found it on GitHub)
- Create the logic to send the email.
- Count the clicks (optional)
- Update the Referral Widget code snippet with details from your project
- Embed the code at the website
- Check log to see that video is calling Conducttr as expected
The code is here
Create a new API Call trigger with the matchphrase :
unauth/email_share ( 3rdparty_email |parse('email_address') into audience.3rdparty.accounts.email| ) && ( email_body |parse('all_chars') as email_body|)
This will parse the API Call from the widget, registering the sender and the 3rdParty and it will parse the text type into the widget's body
Then attached to this trigger create a new Email. In the Content Details panel, go to the Header tab and in the To drop-down menu select Referenced Audience(3rdParty)
In the Body tab write the content of your email. You can use the following smartwords
|audience.sender.accounts.email| = the email of the sender/referrer
|email_body| = the content of the message write by the audience using the widget
If you want to count the number of clicks you can do it easily storing the value inside an attribute and increment it each time someone clicks
Create the attributes
Go to the Attibutes panel, select Project as the entity.
Create three integer attributes call them
"Facebook Share Clicks count"
"Email Share Clicks count"
"Twitter Share Clicks count"
Create the API triggers.
Create two unauth API Call trigger (the email one is already created) with the matchphrases
Create the Logic Actions
Then attached to each trigger ( the email_share trigger as well) create a new Logic Action to increment our Project attributes by 1 each time someone clicks
When you open the code snippet, the area that you edit is between two comment lines. The start of the editable area says “Edit the information below” – as shown in the image.
You need to update the following information:
- CONSUMER KEY – you’ll find this in the Authentication section of the API pop-up
- PROJECT ID – this is found in the top header bar
You can change all the style and texts of the widget. These are some of them and the lines you have to find and change to customize your widget.
- FACEBOOK_LINK: the url for the Share to Facebook.
- TITLE: The Title of the widget.
- IMAGE_URL: the path for the image to be displayed in the widget
- SUBTITLE: The subtitle of the widget, displayed below of the image
- TEXT: The default text for the text area
- SUCCESS_TEXT: The text to be displayed after sending the email
Don't forget to also upload your image