I'm attempting to put a named anchor on a part of our Facebook tab and add "#anchor" to the shared URL so when users click the shared link it will take them directly to the proper content on the tab.
I added to my tab and then recoded the FB Feed Dialog URL so
link=http://www.facebook.com/mybhg?sk=app_279723102083145#quiz
and
actions={name:'name',link:'http://www.facebook.com/mybhg?sk=app_279723102083145#quiz'}
In testing the dialog displayed an error saying both of these were invalid links:
Requires valid redirect URI
actions should be a JSON-encoded dictionary with "name" and "link" keys
So I bit.ly'd them which Facebook accepted and you can share the short URL. When users click the shared link though, the correct URL is used (with "#quiz") but the browser does not snap to the anchor location.
Since FB failed on the original URL, I suspect they aren't set up to parse #named anchors in their URLs, but I wanted to put it out to the community and see if someone has made it work (or confirmed it doesn't.)
Thanks!
URL fragments (the #) can't be read on the server side.
What you can do is use the app_data parameter, which is forwarded to you on the signed_request parameter, parse it accordingly, and have some Javascript to force the jump yourself.
Related
I am compiling a lead generation landing page and, in the form I have inserted a hidden field which collect whatever is written in the url bar after
"?rel=".
This is done in order to track where the leads come from (Facebook ads, direct linking etc).
To be more clear if this is the url: www.mywebsite.com/form.html?rel=fbads
the hidden field will be fill with "fbads" and this is working.
In the landing page I have a link to another page with more details and in this webpage I have the same form.
My idea is to run campaings on the first page with the rel link, but then if the user clicks on the link and go to the detailed page (and then compile the form from there), I am losing the rel field.
How can I pass the rel field to the url of the second page?
Thanks
You may refer the this stackoverflow page. Once the HTTP GET request comes, traverse in HTTP headers in your controller and look for Referer field but it is not always set and the client can change the header value. May be using google analytics is the better option.
If you just want to know that whether if they came to your form page from your landing page or not, you may add fix HTTP URL parameter prior to HTTP redirect.
If you save your rel in a variable, you can add it on your link to detailed page, for example in case of =fbads just once variable is set up, add it: <a href="http://myDetailedPage.com/detailed/?=<?php $rel;?>"</a>
I'm not aware of link designing strategies, so I am not sure why my link gets chopped off when someone clicks on from sources like Facebook etc.
I have a 'share feature' on my platform, which lets a user create a link to their listing and share it with people.
The link I generate for the listing in my backend has parameters, which reads the listing id and the type and displays content over HTML
Here's a sample link for a listing
https://www.fayvors.com/Share.html?hash=5eccccaa-7b8d-42bd-af8c-08d50da0c867?type=lessons/
However, when I share the link on facebook and click it, the browser redirects to a link that's cut off
https://www.fayvors.com/Share.html?hash=5eccccaa-7b8d-42bd-af8c-08d50da0c867%3Ftype%3Dlessons
I'm not aware of link designing principles, so I'm a bit lost here!
Thanks!
Your URL contains “special characters” (like a second question mark inside the query string), but you neglected to apply proper URL encoding when putting this URL as a parameter value into another URL:
javascript:window.location.replace('https://www.facebook.com/sharer/sharer.php?u='+window.location)
Use encodeURIComponent on the value you are concatenating to the sharer URL here.
I am attempting to use the standard Facebook share button to share a deep link into my iframe page tab of the form:
https://www.facebook.com/YourPage?v=app_1234567890&app_data=any_string_here
where app_data content is a deep link relative path into my iframe page tab app content
(e.g. /path/to/page_that_I_shared_from).
Just to be clear, there is a Share button on my iframe app page, and I am trying to generate the link back to that page to be shared.
I place the absolute URL above into the data-href parameter per the Share Dialog documentation, and when I click the Share button, the url in the share dialog is of the form:
https://www.facebook.com/sharer/sharer.php?app_id=my_app_id&sdk=joey&u=url_encoded_version_of_the_absolute_url_above&display=popup
but when the post is rendered, the query string is stripped completely.
Note that if I use a non-Facebook URL, the query string is preserved.
I do notice that app_id parameter in the share dialog URL - perhaps the fact that this is coming from inside the page tab iframe makes a difference.
Initial testing with the feed dialog looks promising, but I'd like to use the share button since it provides more flexibility as to the destination of the post.
The final solution was to generate the link like so:
https://www.facebook.com/pages/<page id>/<page id>?id=<page_id>&sk=app_<FB_app_ id>&app_data=<deep link>
where deep_link is a relative URL with a query string that starts with a '?' and has the '&' characters replaced with '|' characters (poor man's encoding that I decode on the way in).
I saw several suggestions (mostly here on SO) to double or even triple encode the app_data URL - none of these worked, and usually they resulted in links that could not be posted by the sharer.php script.
I would like to build a customized Facebook page tab for other page owners to instal onto their Facebook pages. Each page tab will need to have its own ID in the links that lead out of the page tab in order for us to track that page activity.
For example each page tab will have a list of products that link to the relevant product pages on an external website. Each of those links will have a unique ID parameter to we can track clicks and purchases. [e.g http://www.mydomain.com/products/product123.aspx?userid=12345]
So I need to create the userid variable in the link. Possibly using GET (or Request.QueryString for asp) to receive from the initial page tab installation.
From what i can see I might be able to use the app_data parameter to pass data over to the page, but when i tried it, it didn't work.
This is what i am using to install the page tabs
[https://www.facebook.com/dialog/pagetab?app_id=YOUR_APP_ID&app_data=12345]
I thought that this will pass the userid over to the new page tab, but it doesnt seem to work.
If anyone could point me in the right direction i would be very grateful.
Cheers
From what i can see I might be able to use the app_data parameter to pass data over to the page, but when i tried it, it didn't work.
This is what i am using to install the page tabs [https://www.facebook.com/dialog/pagetab?app_id=YOUR_APP_ID&app_data=12345]
But you are aware, that appending &app_data=12345 does not mean you will get a GET parameter by the name 'app_data', right …?
The app_data will be passed as a property inside the signed_request parameter – so you’ll have to decode that one, and inside you’ll find your app_data value.
Why does 'each page tab' need to have an ID?
The Page ID should be enough for you to determine which content to show (and it's passed to your app on each page load via the signed_request, and the page ID is also passed back to your app in the callback to the pagetab dialog
You could also request manage_pages Permission from the user to determine the list of pages they administer and if your app is installed on each
I'm coding a "one page" app inside facebook (using the canvas app approach). While the user moves inside the app I'm changing the location like: apps.facebook.com/my-app#current_location and loading stuff via AJAX.
Unfortunetely, when someone loads http://apps.facebook.com/my-app#current_location in their browser, the canvas app doesn't see the url fragment #currrent_page.
How can I get around this limitation?
Although I cannot answer properly your question, (and as I think it's kind of old already) the info below should help other people understand better these # (hash) things. They are called URL Fragments.
http://blog.httpwatch.com/2011/03/01/6-things-you-should-know-about-fragment-urls/
Any URL that contains a # character is a fragment URL. The portion of
the URL to the left of the # identifies a resource that can be
downloaded by a browser and the portion on the right, known as the
fragment identifier, specifies a location within the resource:
Fragments Are not Sent in HTTP Request Messages
If you try using fragment URLs in an HTTP sniffer like HttpWatch,
you’ll never see the fragment IDs in the requested URL or Referer
header. The reason is that the fragment identifier is only used by the
browser – it doesn’t affect which resource is returned from the
server.Here’s a screen shot of HttpWatch showing the traffic generated
by refreshing a fragment URL:
The URL fragment is only read on the client-side (users' browsers), so Facebook won't and can't sent that on the POST request it makes to your server.
What you can do is catch all URLs with the same route, regardless of the server-side language of your choice, encode them somehow, and send them to the client to be read by client-side Javascript which would then be responsible for navigating.
Example: the user loads http://apps.facebook.com/my-app/current_location (notice the / instead of the #). You serve your single page, where you'll have something like (ERB):
<script>MyApp.navigate("<%= request.path %>");</script>
Your navigate function could do the following:
function navigate(path) {
window.location.href = "#" + path;
}
Yeah, the Hash urls are nice to use for navigation within your site, however, not so good when sharing the url. The solution is to create canonical URLs for each of your objects.
So, when someone can access specific information like http://yoursite.com/#artists/styx, you also have a way for your server to serve content from http://yoursite.com/artists/styx. This way someone can share http://apps.facebook.com/yoursiteapp/artists/styx and then get to the correct content within your site.