I have a website and I would like to include a PayPal button so clients can purchase directly on the site, the only problem is that I need the same button to appear differently (with different prices & currencies) in different countries.
How do I do this?
PayPal will do currency conversion for you, but if you need to set different prices in different countries (ala mobile app stores), then you will have to create the different buttons yourself - one for each country/currency you wish to target. Then, based on locale or requesting URL, you will present the proper button's code.
I'd recommend using a Geolocation JavaScript code. However, the user would have to give permission when they load the page. You can have a look here: http://www.w3schools.com/html/html5_geolocation.asp
Or see example code:
<p id="demo">Click the button to get your coordinates:</p>
<button onclick="getLocation()">Try It</button>
<script>
var x=document.getElementById("demo");
function getLocation()
{
if (navigator.geolocation)
{
navigator.geolocation.getCurrentPosition(showPosition);
}
else{x.innerHTML="Geolocation is not supported by this browser.";}
}
function showPosition(position) {
x.innerHTML="Latitude: " + position.coords.latitude +
"<br>Longitude: " + position.coords.longitude;
}
</script>
You could then pass the lat and long data to an api to find the city/country they live in.
Hope it helps!
Related
Is possible to set custom data on a DFP ad creative, in the console panel, and then reuse them on the front end of your web site?
For example let say I have an ad, that have a list of creatives.
Depending on the creative it is displaying, which has a custom field with a number. With javascript I want to read this number on my web page, and do different actions depending on (change title of document or activate an app related to the DFP).
More over is possible to display in an Ad a custom js application (ex. a calculator) which the user can interact with it?
I didn't manage to find a way to extract creative's custom fields via javascript. Most likely it's not exposed on the page because it's been designed for a slightly different purpose:
These optional fields can be used to organize objects in reports. They're created in the "Admin" tab. They don't affect ad serving or delivery
But you can do it differently in a number of ways:
bind to creative IDs - if a particular creative id is shown do some actions of your choice. These IDs are available in your DFP 'creatives' grid.
if you're not limited to image creatives you can use 3rd party creatives with a js code that would communicate to the parent page and pass some data to your js handler installed on the parent page. As DFP uses friendly iframes (http://www.iab.net/media/file/rich_media_ajax_best_practices.pdf) you do have access to the parent page from inside your ad
A dirtier approach - you can put some service data into the alt field which is reachable inside the ad from the parent page
There's also an attribute event.labelIds available in the event handler but it's empty despite some labels associated with my testing creative
Here's the code illustrating p.1 and p.3:
googletag.pubads().addEventListener('slotRenderEnded', function(event) {
if (!event.isEmpty) {
var slotId = event.slot.getSlotElementId();
var iframe = document.querySelector('#' + slotId + ' iframe');
var iframeDoc = iframe.contentDocument || iframe.contentWindow.document;
var img = iframeDoc.querySelector('img');
if (img && img.alt) {
console.log('Got alt: ' + img.alt);
}
if (event.creativeId) {
console.log('Got creative id: ' + event.creativeId);
}
}
});
Here it is live: https://jsfiddle.net/50b4npw8/
You can find some additional info on GPT events here
I search a solution for the problem highlighted in this question.
Unfortunately, the accepted solution (which dates back to 21/11/2012) doesn't work anymore, as you can this in this demo.
Does someone know why?
Body
<div id="fb-root"></div>
<script src="http://connect.facebook.net/en_US/all.js"></script>
<script>
FB.init({
appId : '179378788777832',
status : true,
cookie : true,
xfbml : true
});
</script>
<div id="login">
You are not logged in to FB, Please click here to login.
</div>
<div id="container_notlike">
YOU DONT LIKE
</div>
<div id="container_like">
YOU LIKE
</div>
JS
var hideLogin = function(){
$("#login").hide();
}
var showLogin = function(){
$("#login").show();
}
var doLogin = function(){
FB.login(function(response) {
if (response.session) {
hideLogin();
checkLike(response.session.uid)
} else {
// user is not logged in
}
});
}
var checkLike = function(user_id){
var page_id = "40796308305"; //coca cola
var fql_query = "SELECT uid FROM page_fan WHERE page_id = "+page_id+"and uid="+user_id;
var the_query = FB.Data.query(fql_query);
the_query.wait(function(rows) {
if (rows.length == 1 && rows[0].uid == user_id) {
$("#container_like").show();
//here you could also do some ajax and get the content for a "liker" instead of simply showing a hidden div in the page.
} else {
$("#container_notlike").show();
//and here you could get the content for a non liker in ajax...
}
});
}
$(document).ready(function(){
FB.getLoginStatus(function(response) {
if (response.status === 'connected') {
hideLogin();
checkLike(response.authResponse.userID)
} else {
showLogin();
}
});
$("#login a").click(doLogin);
});
CSS
body {
width:520px;
margin:0; padding:0; border:0;
font-family: verdana;
background:url(repeat.png) repeat;
margin-bottom:10px;
}
p, h1 {width:450px; margin-left:50px; color:#FFF;}
p {font-size:11px;}
#container_notlike, #container_like, #login {
display:none
}
I search solution for hours but I didn't find anything what works.
Thank you for help.
Like Gating is not allowed anymore, that´s why it is not possible. The only reliable way to get that information is by authorizing a user with the user_likes permission and using /me/likes/[page-id]. But you will not get that permission approved for like gating in the Login Review.
People need to like something because they really want to, not because they get something for it:
Only incentivize a person to log into your app, enter a promotion on your app’s Page, or check-in at a place. Don’t incentivize other actions
Source: https://developers.facebook.com/policy/
Btw, you can also subscribe to the edge.create event to find out if a user just clicked your like button, but you can´t find out if the user liked it before: https://developers.facebook.com/docs/reference/javascript/FB.Event.subscribe/
The problem on that code is that FQL is deprecated .
You can't do what you want to, and thats why changes are necessary .
Your code would work if your app is old, created before changes that turns like gating not allowed, but anyway, you cannot use that for show content. You can use that kind of implementation for creating an interactive experience, where you can for example changing the content, saying "Thanks for liking".. Or "Connect with us, liking our page.." ..
You can also think about interfaces, where you show up the page plugin, and just after user likes, you say Thank you ... and hide the page plugin ... But user must always be able to close without liking .
For checking if user likes a page, you need use :
FB.api get on '/me/likes', and with the response ...
if (response.data[likes].name == "Coca-Cola")
or... better
if (response.data[likes].id == "40796308305") {
}
I repeat, One thing has nothing to do with another ..
You can check if user likes a page, but you cannot restrict content, based on this kind of resource .
There are other ways to check it, for exaple :
Get api call to userid/likes/pageid returns page info if user likes the page, and returns nothing if user does not like the page .
You will waste time trying do that for controlling content consumption .
Your app must be aprooved for asking user_likes permission, and its better you think about creating another experience for users, instead of submitting something like that .
I also think that content with good open graph for sharing, commenting and optional liking is very much more efetive, because i noticed that many people used to like and dislike the page after getting the content .
If you just... Prompt a FB.UI for sharing after 1 minute, for example, you will have much more results .. Aways positioning the page plugin in strategic places, people will naturally like your page ..
Than you can say change the page plugin element :
Thank you for liking, please share with your friends ....
Who would also like ...
Or use a callback for triggering the share dialog ..
OLD SCHOOL API CALL
The method FB.Event.subscribe() allowed apps to subscribe to a range of events, and define callback functions for when they fire, is deprecated .
Also FQL Query is deprecated .
For checking if user likes a page, you need user.likes permission, so you can try :
FB.api get on '/me/likes', and with the response ...
if (response.data[likes].name == "Coca-Cola")
or... better
if (response.data[likes].id == "40796308305") { }
There are other ways to check it, for exaple :
Get api call to userid/likes/pageid returns page info if user likes the page, and returns nothing if user does not like the page .
You can check if user likes a page using this call, but you cannot restrict content, based on this kind of resource .
2018 UPDATED SOLUTION
But nowadays, in 2018 the best method for is setting Webhooks .
Webhooks are a subscription based system between Facebook and your server. Your app subscribes to receive updates from Facebook via a specified HTTPS endpoint .
This allows your to app to receive notifications whenever there are updates to a chosen set of topics and their fields, so, you can track changes to most sections of the user's profile, such as About, Photos, Posts, Friends, and Likes.
Webhooks update notifications are sent as POST requests to a callback URL that you supply. Notifications can be lightweight, indicating only that a field has been updated, or can include the newly updated value .
webhooks user reference
Full list of user profile fields that you can subscribe to, such as About, Photos, Posts, Friends, and Likes.
webhooks page reference
The easiest way to set up your app to receive Webhooks updates is to use the App Dashboard's, check out Facebook Platform documentation for more info .
Webhooks documentation
I created a web app using jquery mobile 1.1.1
As part of my app I built password retrieval functionality. If a user needs to reset their password, they fill out a form and receive an e-mail with a link that includes the address of the password reset page and two other parameters as such:
www.mywebapp.com/demo.html#resetPassword?x=123&y=123
The Initial Problem:
When the user clicks on the link, they see the home page of the web app even though the URL in the address bar says: www.mywebapp.com/demo.html#resetPassword?x=123&y=123 I understand that jQuery mobile does not support passing parameters after the hash, so I came up with the following solution.
A Solution with a small inconvenience:
I put together the following code, which reads the URL, captures my two parameters and redirects the user to the password reset page:
$( document ).bind( "pagebeforeshow", function() {
//cpe("parameter") will check whether the specified URL parameter exists
if(cpe("x") && cpe("y")){
//gpv("parameter") captures the value of the specified URL parameter
recovery.username=gpv("x");
recovery.token=gpv("y");
$.mobile.changePage("#resetPassword");
}
})
The Inconvenience, and thus my current problem:
When the user clicks on the link in the e-mail the browser fires up and opens the main page of the app, and then it quickly displays the #resetPassword page. I understand that this happens because I'm changing the page
$.mobile.changePage("#resetPassword");
But, how do I modify the above code so that the user won't see the main page at all, and go straight to the #resetPassword page?
Use an empty initial page with no content. By default do a changePage to what was your initial page, but in other cases, like the resetPassword case, you changePage to that instead.
I followed Raymond Camden's suggestion and added the following to my html:
<pre>
<!--Start of blank initial page: #initPage-->
<div data-role="page" id="initPage">
<div data-role="content"></div>
</div>
<!-- /page -->
</pre>
I also added the following to my javascript:
//init page -> path control hub
$( document ).bind( "pagebeforeshow", function() {
var pageid=$.mobile.activePage.attr('id');
if(pageid=="initPage"){
if(cpe("x") && cpe("y")){
recovery.username=gpv("x");
recovery.token=gpv("y");
$.mobile.changePage("#resetPassword");
}else{
$.mobile.changePage("#info");
}
}
})
It's working now.
I have created several custom LIKE buttons for different pages of my website. I need to trace back how many daily click / LIKEs for last month.
Is there any APIs/ FB Insights that support display of such statistics / analytic data?
When the user clicks a like button, in addition to sending the request to Facebook through whatever SDK you are using, you can also send an Ajax request to a page on your own server. This page would contain code to increment a counter of the clicked like button in a database.
For example, let's say you have this code on your page:
<script>
function sendToDatabase(id)
{
xmlhttp.open("GET", "handler.php?id="+id, true);
xmlhttp.send();
}
</script>
<a onclick="sendToFacebook(); sendToDatabase(this.id);" id="like23">LIKE</a>
Then, the contents of handler.php:
<?php
$db = sqlite_open("db.sqlite");
$query = "UPDATE likes SET count=count+1 WHERE id='".$_REQUEST['id']."'";
sqlite_query($db, $query);
?>
This is assuming you are using JavaScript, PHP, SQLite, and you already have a table set up in the SQLite database, "db.sqlite". Your table could be as simple as two columns - id and count.
Is there an easy way to design a website to facilitate an iphone user providing gps coordinates to the site?
I am wondering if there might be a naming convention for form fields for example, to let the user input in an automated way.
I am considering building a location based website and would like to tailor it for iphone (and other mobile users). I realize an iphone app could do this but I'm not equipped to create one.
Here's a snippet on how to read location from the iPhone. Looks like it requires 3.0:
navigator.geolocation.getCurrentPosition(foundLocation, noLocation);
function foundLocation(position)
{
var lat = position.coords.latitude;
var long = position.coords.longitude;
alert('Found location: ' + lat + ', ' + long);
}
function noLocation()
{
alert('Could not find location');
}
See: http://mapscripting.com/how-to-use-geolocation-in-mobile-safari
By the way, if you want to use web code on the iPhone, there are a couple middle-ground solutions you could try that don't force you to create a native app but allow you to wrap your site in an app and get access to GPS and other native features.
PhoneGap: http://phonegap.com/
Appcelerator: http://www.appcelerator.com/products/titanium-mobile/
Check out the app SendLocation under navigation by Jouni Erola.
Its a simply app that will send out the lat & lon of the iPhone to YOUR server.
Simply enter your server url to receive the location as HTTP-GET methid
I've don this without any programming. You can:
Download the iPhone app "Basic GPS" from iPhone Store.
Start an account at Twitter.com (if you don't already got one).
Start an e-mail-to-twitter account at Twittermail.com.
In Basic GPS settings use your secret e-mail address from Twittermail.
At Twitter.com/widgets click "Other" to get your HTML-code for publishing your Tweets elsewhere.
Put this HTML code on your homepage.
In Basic GPS you just click the blue "I" (on) button, "Email" and "Send" to send your position to Twittermail, which publish it on Twitter. And Twitter will automaticly publish it on your homepage.
See a working axample at http://CharlieBloom.com. Only the 3 latest (customizeable) Tweets are visible, click on "Follow me on Twitter" to se "My position ....." and a Google Maps-link. Positions are updated on my website 2-3 minutes after I have sent them.
Best regards,
Charlie Bloom
Yes, but the accuracy is pretty bad. I just built a web form that posts GPS settings from the watchPosition() function to my database and then maped the results. While paddling down a local river it got only two of seven posts correct. The rest were outside the river, and two of those were about a mile away! I'm now looking for a better solution.
Here's the code I use to update the form fields:
<script type="text/javascript">
function getGPSLocation()
{
if(navigator.geolocation)
{
navigator.geolocation.watchPosition(onGeoSuccess);
} else {
alert("Your browser or device doesn't support Geolocation");
}
}
function onGeoSuccess(position) {
document.getElementById("Latitude").value = position.coords.latitude;
document.getElementById("Longitude").value = position.coords.longitude;
}
</script>
And this is the form. Update to suite your needs.
<form>
<img src="spacer.gif" OnLoad="getGPSLocation();">
<input type="Text" name="Latitude" id="Latitude" value="">
<input type="Text" name="Longitude" id="Longitude" value="">
</form>