Question

I’m trying to create a popup like facebook and twitter. When you click on a like button of facebook in another website besides facebook.com and you’re not logged in, it opens a popup so you can log in, and then, when you click “login”, it closes returning authentication to the website you clicked on like button.

Same thing with twitter.

Any idea?

Their code are like this:
These examples are pointing to the website I work for.

Twitter:

<iframe frameborder="0" scrolling="no" src="http://platform.twitter.com/widgets/tweet_button.html?counturl=http://www.cromaz.com&amp;count=horizontal&amp;via=mundocromaz&amp;text=Cromaz,%20rede%20social%20pra%20vizinhos!%20100%25%20brasileira!&amp;url=http://www.cromaz.com&amp;" style="width:105px; height:20px; overflow:hidden; position:relative; left:3px;" />

Facebook:

<iframe src="http://www.facebook.com/plugins/like.php?locale=pt_BR&amp;href=http://www.facebook.com/pages/Cromaz/139676989421131&amp;layout=button_count&amp;show_faces=false&amp;width=50&amp;action=like&amp;font=verdana&amp;colorscheme=light&amp;height=21;"  scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:100px; height:21px; position:relative; left:6px;" />

Answer 1

Using your solution i added some modifications:

For Twitter Like Button:

<iframe allowtransparency="true"
src="http://platform.twitter.com/widgets/tweet_button.html?counturl=http://www.divinersystems.com
        &amp;count=horizontal
        &amp;text=PIC%20Configuration%20Tool
        &amp;url=http://www.divinersystems.com"
_mce_src="http://platform.twitter.com/widgets/tweet_button.html"
style="border: medium none; overflow: hidden; width: 80px; height: 21px;"
_mce_style="border: none; overflow: hidden; width: 80px; height: 21px;" frameborder="0" scrolling="no">
</iframe>

For Facebook Like Button:

</iframe> allowtransparency="true"
src="http://www.facebook.com/plugins/like.php?href=http%3A%2F%2Fwww.divinersystems.com
        &amp;layout=button_count
        &amp;show_faces=false
        &amp;width=400
        &amp;action=like
        &amp;font
        &amp;colorscheme=light
        &amp;height=21"
_mce_src="http://www.facebook.com/plugins/like.php?href=http%3A%2F%2Fwww.divinersystems.com
        &amp;layout=button_count
        &amp;show_faces=false
        &amp;width=400
        &amp;action=like
        &amp;font
        &amp;colorscheme=light
        &amp;height=21"
style="border: medium none; overflow: hidden; width: 400px; height: 21px;"
_mce_style="border: none; overflow: hidden; width: 400px; height: 21px;"
frameborder="0" scrolling="no">
</iframe>

For your site replace:

http://www.divinersystems.com -> your site

PIC%20Configuration%20Tool -> your text (%20 is spacebar)

If you using Joomla 1.6 create new module of type “Custom HTML”, give it your Title under “Show Title” press hide, choose “Menu Assignment” where you want it to bee seen, paste your modified code (when you in Toggle Editor mode), and save.

• Please note if code disappear go to -> “Content” -> “Options” -> “Text Filters” -> select your user type and change the “Filter Type” to “No Filtering”.

I hope this would help!