You can use page-builder’s social networking tools to insert buttons into your campaign so that your supporters share your content on Facebook and Twitter, potentially bringing in new supporters.
Setting your social networking share content
The content that your share links will post is set at the campaign level. In the toolbar, under Social details, click Settings.
You will be shown a new screen where you can add your settings. We’ll go through them one-by-one.
Setting the landing page
By default ‘Is this the “landing page” of the action?’ is set to “Yes” – i.e. it will share the first page of the action you are currently editing the social settings for.
However, in some circumstances you may actually want the links to share a different action. For example, you may have chained pages together so that a petition thank you page is actually a redirection to a donation campaign, asking them to support the campaign financially. You wouldn’t want to the have your supporters share the donation page, instead you might want them to share the petition page. In this case, you would select “No” and then choose the petition instead. It will then use the social settings of that campaign.
The two dropdowns (Facebook and Twitter) allow you to optionally add tracking parameters to the links your supporters share. In this way you’ll be able to find out how many submissions came from social shares. For example, you may create and assign the tracking of “Facebook share”.
Advanced option: The checkbox “Track referrers of Facebook and Twitter?” gives you even more information about which of your supporters’ shares are generating new submissions. If you tick this box, it will add the sharing supporter’s unique ID to the URL that is being shared. This will then be shown in the transactional export under “Campaign Data 31” for anyone taking action as a result. For example if SupporterID 2259636 signed your petition and shared it on Twitter and their friend then took action as a result, their friend will have the value tw.2259636 in their petition transaction under Campaign Data 31.
This is in two sections, the top half allows you add the content for your supporters’ Facebook posts, and the bottom half sets the tweet.
“Image” is the URL of the image that you want to show when they post. “Title” and “Description” form the text of the post (see example below)
This allows you to set the default text of the tweet that will be shown when they click the Twitter icon. Note that your supporters are able to amend this. You can include your own @handle in there, or a #hashtag of your campaign, or even the @handle of the target of the action. Be sure to include the URL, including the tracking value, of your action so that friends of your supporters can also take action.
You can include a Short URL if you wish which will be automatically appended to your URL.
Testing and troubleshooting
It is important to test that when clicking the social sharing buttons that they generate the correct posts with the content you expect.
Note that when the page is in demo mode, you are sharing the “demo” URL of the page. This isn’t the live URL, and as far as Facebook is concerned is entirely different. Therefore, you may want to test that the live URL is also generating the correct post. To do this you can submit the live pages as if you were a supporter, or if you want to “skip” to the thank you page you can adjust the live URL to force that page to show (by changing the last number 1 to the page number of the thank you page, e.g. 2).
Facebook caches URLs which means that once a URL is processed it will semi-permanently store a post against a URL. This is to speed up its software. But, if you go on to change your social settings, Facebook will not immediately pick this up and might show your old post. Therefore you need to tell Facebook to re-cache it, so it takes another look.
To do this you can click the “Debug” button in the social tools which will open up Facebook’s sharing debugger. You need a Facebook account to do this. On this page you can “Scrape again” the URL and it will take another look at your page and display a sample post. Sometimes you need to press this a couple of times for it to show properly.
Check if Facebook’s debugger is showing any errors, for example perhaps the image is too small or not available. Otherwise you should find it working correctly.
Still having problems? It could be that the URL you are re-scraping is not exactly the one being shared. Remember, Facebook treats each variation of a URL differently. If you are using tracking IDs then ensure you take that into account and scrape them as well.
Also our sharing tools can add additional tags to the end of the URL which are similar to this (amend this to use your own default locale):
Again, this can make the URL unique and that’s the one you need to scrape.
If you are using Twitter cards, then check this document for troubleshooting them.
Open graph tags
If you are interested in how our social tools work, they add “open graph” tags to your page. These tags are read by social networks to determine your page’s title, description, associated image and so on.
The following is an example of the types of tags that might be added to the area of your page by page-builder:
code class="html"><meta name="title" content="Tell your MP you want to save the whales"/> <meta property="og:title" content="Tell your MP you want to save the whales"/> <meta property="og:description" content="Email your MP and let them know that whales and dolphins need our help"/> <meta name="description" content="Email your MP and let them know that whales and dolphins need our help"/> <meta property="og:image" content="http://example.com/whale.png"/> <link rel="canonical" href="https://actnow.e-activist.com/page/12345"/> <meta property="og:url" content="https://actnow.e-activist.com/page/12345"/> <link rel="image_src" href="http://example.com/whale.png"/>
The title is taken from your page’s title, the URL from your page’s URL, but the other tags are inserted by the social tools.
When you post the link to Facebook, for example, it will take the og:title, og:description and og:image tags and use them to construct a post. This is why it is important not to hard-code these into your HTML template yourself.