Display fb and twitter share page on a lightbox - twitter

I need some help, is it possible to display fb or twitter share page on the lightbox instead of new popup window ?
I would like to open the url something like this on the lightbox:
twitter:
https://twitter.com/share?text=Check%20out%20Trinity%20Web%20Tech%20-%20http%3A%2F%2Fbit.ly%2FzwYo0C%20via%20#bwg%20http%3A%2F%2Fbit.ly%2Fz6Rc0b
facebook:
http://www.facebook.com/sharer.php?u=http%3A%2F%2Fstaging.creativisite.com%2Fbwg%2F2012%2F03%2F05%2Ftrinity-web-tech%2F&t=Trinity%20Web%20Tech
Currently, when its opened on the lightbox, its display white box.
I think it's because twitter or fb doesn't allow to open in an iframe.
Any workaround would be nice ?
Thanks all

You can use this lightbox with this code :
<a title="This is an Inception ! zoombox inside a zoombox inside a zoombox" href="http://grafikart.fr/zoombox" class="zoombox">Iframe</a>
The final code would give this:
<a title="Twitter" href="https://twitter.com/share?text=Check%20out%20Trinity%20Web%20Tech%20-%20http%3A%2F%2Fbit.ly%2FzwYo0C%20via%20#bwg%20http%3A%2F%2Fbit.ly%2Fz6Rc0b" class="zoombox">Twitter</a>
<a title="Facebook" href="http://www.facebook.com/sharer.php?u=http%3A%2F%2Fstaging.creativisite.com%2Fbwg%2F2012%2F03%2F05%2Ftrinity-web-tech%2F&t=Trinity%20Web%20Tech" class="zoombox">Facebook</a>

Related

Embed Twitter Percent-encoding

I was trying to copy the same method to my website by using the below code, but when I implement other twitter user or account, it is not working. Can anyone check if the code format is still working in other Twiiter account?
<iframe border=0 frameborder=0 height=250 width=550 src="https://twitframe.com/show?url=https%3A%2F%2Ftwitter.com%2Fjack%2Fstatus%2F20"></iframe>
I created a JSFiddle and looks like the code is working fine! Tested with two other users and both are loading fine. You have to check if your URL is properly encoded and if you have any adblockers that blocks social media features.
Link: https://jsfiddle.net/ftcz6pdu/4/
Sample code:
<iframe border=0 frameborder=0 height=250 width=550 src="https://twitframe.com/show?url=https%3A%2F%2Ftwitter.com%2FItsSkyLOL%2Fstatus%2F1011166507257270273"></iframe>
<iframe border=0 frameborder=0 height=250 width=550 src="https://twitframe.com/show?url=https%3A%2F%2Ftwitter.com%2FPoppyHarlowCNN%2Fstatus%2F1010899818955333632"></iframe>
The online URL encoder that I used: https://meyerweb.com/eric/tools/dencoder/

On click of anchor tag , I want to close the current tab and redirect to a new url

On click of anchor tag I want to close the current tab and redirect to a new URL in new tab. I want this functionality to work for IE,mozilla,firefox and safari .Can anyone please provide me the javasciprt for the same . The reason i am trying something like this because i donot want users to click back button of the browser and get back into the site . Thanks
This code utilizes jquery to accomplish the task; it can be done in plain vanilla javascript as well. It should work across all (at least the more modern) browsers.
<script>
$(function(){
$("#open").click(function(){
window.open(window.location.href);
});
$("#openandclose").click(function(){
window.open(window.location.href);
window.close();
});
});
</script>
<a id="open">Open New Window</a><br />
<a id="openandclose">Open New Window and Close Old Window</a>

trying to customize Facebook posts within my rails app, like it does on Stackoverflow site

At the bottom of questions on stackoverflow it says:
'Know someone who can answer? Share a link to this question via email, Google+, Twitter, or Facebook.'
It's the Facebook part I'm interested in. When the user clicks 'Facebook' they get something like:
The cursor is in the 'Write Something' box, exactly where you want it to be, there's a banner underneath drawing attention to the stackoverflow site...perfect.
In my rails app I can link to Facebook with:
<div class ="centre_text">Maybe
you'd like to <%= link_to 'ask your friends on Facebook',
"http://www.facebook.com/mypage", :target => "_blank" %> for what
you're looking for? </div>
It goes to the user's page, where they can write a post. But how do I have it like Stackoverflow's, where the 'Write Something' takes up most of the screen, with a 'Share link' button, and how can I put in a banner/detail, like Stackoverflow does?
Any pointers in the right direction would be greatly appreciated.
I am giving you a simple html example, so that you can get idea and customize it according to your need:
Like I want to share a link on facebook, then what I will do is as following:
First create a link:
<img class="fShare" data-url="http://google.com/" data-title="luxury sedan" src="facebook.png" width="5" height="11" alt="facebook" />
add some javascript for this link:
$(document).ready(function() {
$(".fShare").click(function() {
window.open(
'https://www.facebook.com/sharer/sharer.php?u=' + $(this).attr("data-url") + '&t=' + $(this).attr("data-title"),
'facebook-share-dialog',
'width=626,height=436');
return false;
});
});

URL redirection in jquery mobile

I have 2 pages page1.html and page2.php. I am sending user information (GET) like page2.php?new_user=true. In page 2 the first page has id="Welcome". In page2.php I am redirecting the request to a <div datarole="page" > with id="NewUser"(inside page2.php). I am using javascript to do this $isnew= '<?php echo $_GET["new_user"]; ?>';. Currently I am redirecting using an if condition
if($isnew=="true")
{
window.location.href="#NewUser"
}
The problem is I want to display #NewUser as a dialog and NOT a page. Can anyone give any other possible solution to this?
Thanks in advance.
To show a page as a dialog:
$.mobile.changePage('#NewUser', { role:'dialog'});
jQuery Mobile API - Dialog Widget

IFrame Like Button gives Suspicious URL error

I created a Google Sites site and added a Like button using the IFrame option.
The button looks fine but when a user clicks Like, they receive the following error:
"Sorry, this post contains a suspicious URL: Unknown error".
It looks like a Facebook like issue, since the error message is displayed in a Facebook branded pop-up window.
My site: https://sites.google.com/site/wheresthezbfairlane/
How do I fix this ?
Help!
Thanks
Nick
If you copy pasted the code from the facebook plugin site you might have to remove the 'amp;'s that separate the query strings right after the href attribute.
<iframe src="//www.facebook.com/plugins/like.php?
href=http%3A%2F%2Fwww.facebook.com&width=450&height=80&colorscheme=light&layout=standard&action=like&show_faces=true&send=true"
scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:450px; height:80px;" allowTransparency="true"></iframe>
So, in the code above just replace '& amp;' with '&'

Resources