Create landing page and share with FacebookSDK's Share Dialog
#AppSocially Tutorial: Creating Landing Pages and Sharing with Facebook
The AppSocially iOS SDK can be used to create unique landing pages every time a user invites or shares with a friend. Having unique landing pages gives us the ability to track performance results separately for each different event, and to run A/B tests across different landing page designs with different embedded content for different users.
Below is an example of how to create a landing page with AppSocially's iOS createPageFrom:to:shareInfo:via:completionHandler: method and then post that landing page to Facebook with the with Facebook iOS SDK.
##Step one: Log in to your AppSocially Dashboard and edit the default landing page template.
Below is a example code from the
portion of the default landing page template.Note the variables in Ruby Syntax {% %} and {{}} - this data will come from the sharing event when you create your unique landing page.
<body>
<header>
<h1 id="title area">Invitation</h1>
</header>
<div id="main">
<div class="container">
<div class="wrapper">
<h2>Hi {% if receiver.name %}{{receiver.name}}{% endif %},</h2>
{% if sender.profile_image_url %}
<p id="profile" style="text-align:center;"><img class="center" src="{{sender.profile_image_url}}" width="117" height="117" /></p>
{% endif %}
<p id="first_comment">{% if sender.name %}{{sender.name}}{% else %}Your friend{% endif %} invite you to {{app.name}}.</p>
{% if message %}
<p id="original_comment">"{{message}}"</p>
{% if sender.name %}
<p id="name"> - {{sender.name}}</p>
{% endif %}
{% endif %}
</div>
<div id="letter">
<p id="app_icn"><img class="center" src="{{app.icon_url}}" alt="" width="77" height="77" /></p>
<p id="btn_dl"><a href="{{app.app_store_url}}"><img class="center" src="{{img_base_url}}/btn_dl.png" alt="download now" width="194" height="50" /></a></p>
<p id="btn_appstore"><a href="{{app.app_store_url}}"><img class="center" src="{{img_base_url}}/btn_appstore.png" alt="App store" width="173" height="57" /></a></p>
</div>
</div>
<!-- container end below -->
</div><!-- /#main -->
<div id="footer">
<p>Send via <a href="https://appsocial.ly">AppSocially</a></p>
</div><!-- /#footer -->
</body>
Follow the simple installation procedure here
To increase conversion, it's important for the landing pages to be as personalized as possible for each user. For that reason, we give you the ability to pass variables from within the app, over to the landing page.
We also recommend you use a tool like !(MaxMind GeoIP 2 city database)[http://dev.maxmind.com/geoip/geoip2/javascript/] to show location information.
All of the data we accessed in the html from within the ruby syntax should be inside an NSDictionary object called *shareinfo.
####In iOS:
NSDictionary *shareInfo = @{thingToShare: ThatThing,
thingToShareURL: kImageURL};
####And in the template:
<p>Your {{sender.name}} shared {{ thingToShare }} with you. Here's a picture:</p>
<img src="{{img_base_url}}/{{kImageURL}}"/>
receiver.name message: STRING: img_base_url -- STRING: the base url for your images - usually a string like "http://www.appsocially.com/"
###If you are sharing to Facebook or Twitter, you will have several additional variables available: sender.name sender.profile_image_url sender.username sender.account_url
You can add additional Data to your landing page when the event is fired by adding it to the NSDictonary *shareInfo
Depending on how you structure your app, the following code could go anywhere, however, we suggest you put it in its own class.
Example:
NSDictionary *shareInfo = @{kDataPropertyMessage: kPresetMessage,
kDataPropertyContentURL: kImageURL};
// Create a landing page with the AppSocially SDK
[ASSharer createPageFrom:@{@"id": @"facebook_id", @"name": @"dummy_sendername"}
to:nil
shareInfo:shareInfo
via:@"facebook"
completionHandler:^(NSDictionary *result, NSError *error) {
if (error) {
NSLog(@"error:%@", error);
return;
}
// Retrieve the URL of the landing page
NSDictionary *pageInfo = result[@"page"];
NSString *urlStr = pageInfo[@"url"];
// Share with the Facebook SDK's Share Dialog
FBAppCall *appCall = [FBDialogs presentShareDialogWithLink:[NSURL URLWithString:urlStr]
handler:
^(FBAppCall *call, NSDictionary *results, NSError *error) {
if(error) {
NSLog(@"Error: %@", error.description);
}
else {
NSLog(@"Success!");
}
}];
if (!appCall) {
NSLog(@"The Facebook Share Dialog is not available.");
}
}];
ShareSample and shareWithFacebookSDK method in the sample are useful for the reference.