My single page website has some products, and product details appear as simple pop-up when clicked. For each product there is Facebook share. But when I Facebook-share the url say www.example.com#product1
in the shared url the #product1
get stripped.
FB.ui({
method: 'share',
href: 'http://example.com/#product1',
}, function(response){});
When I share it comes as only http://example.com/ , not http://example.com/#product1. I want the full URL to be shared like http://example.com/#product1. Its getting stripped off somehow.
How to avoid this?
Like CBroe mentions, Facebook indexes URLs and the #
is not considered part of the URL.
A solution is to use "hashbang" #!
notation instead. Facebook follows the Google Ajax Specification to allow indexing of, in this case, Ajax websites.
The effect is that http://www.example.com/#!/product1
will be rewritten and instead the query to your server becomes http://www.example.com/?_escaped_fragment_=/product1
. In turn, you can catch that on your server and reply with a page dedicated to that product.
You can read a more elaborate answer here: https://stackoverflow.com/a/15024853/561485
The most important part is that your website should be able to provide dedicated pages for each product; if you only have index pages, using the #
notation will always share the same url.
Now Facebook and Twitter doesn't allow sharing of URL's containing #
tag. However you can share URL by using %23
instead of #
<a class="twitter-share" href="https://twitter.com/intent/tweet?url=http://www.goparties.com/%23/party/{{id}}" target="_blank">
You can also escape the url with encodeURIComponent
FB.ui({
method: 'share',
href: encodeURIComponent('http://example.com/#product1'),
}, function(response){});
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With