I want to display LinkedIn popup in a small new window, but the share popup keeps opening as a new full screen tab.
This is the piece of HTML I'm using:
<div class="share-block">
<a
href="#"
onclick="window.open('http://www.linkedin.com/shareArticle?mini=true&url=' + encodeURIComponent(document.URL) + '&title=Excellent review on my website reviews', '_blank, width=500, height=500, resizable=yes, scrollbars=yes'); return false;"
><i class="fa fa-fw fa-linkedin"></i> LinkedIn</a>
</div>
I'm using the same code for Facebook and Twitter which opens up the popup in a new small window as it should. This is the Twitter HTML for example:
<div class="share-block">
<a
href="#"
onclick="window.open('https://twitter.com/intent/tweet?text=Excellent review on my website:%20' + encodeURIComponent(document.URL), '', '_blank, width=500, height=500, resizable=yes, scrollbars=yes'); return false;"
><i class="fa fa-fw fa-twitter"></i> Twitter</a>
</div>
I can't figure out why doesn't it work with LinkedIn. This is what I want to achieve
How to display LinkedIn share in new window like shown on the image?
The second argument in the window.open is for title. You missed that in your linked in popup. So that it treat as all the _blank, width=500..... everything as title. That is the reason it is not following any property width and height and etc. Add that empty string as the second parameter ''.
Fiddle DEMO
The options for the window.open are in the third parameter instead of in the second, where they should be.
Related
This one has had me stumped for a while.
I have the following code in CodePen:
<a class="twitter-share-button color-change"
href="https://twitter.com/share" target="_blank"
data-size="large"
data-text="Never doubt that a small group of thoughtful, committed citizens can change the world; indeed, it's the only thing that ever has. - Margaret Mead"
data-hashtags="RuairiMcN">
<i id="twitter" class="fa fa-twitter-square fa-3x" aria-hidden="true"></i></a>
It's a Twitter share button, it should open a Twitter page where you can make a tweet with the content of "data-text". However, if you follow it, the Tweet box is populated with something different:
"https://s.codepen.io/boomerang/iFrameKey-b5c36245-7638-5a23-0a1b-4b5fab51692a/index.html"
No idea where that's coming from. Re-read the parameters for this button from the Twitter Dev area with no success.
You probably haven't loaded the Twitter widget Javascript properly. (This is step 4 in "How to add a Tweet button to your website".) Without that Javascript loaded, the only information that Twitter has is the referrer -- in this case, that's something internal to Codepen.
I have a working whatsapp <a> tag in this way:
<a class="whatsapp share-local-button
data-action="share/whatsapp/share"
target="_blank" href="whatsapp://send?text=link#withMark" >
<i class="fa fa-whatsapp"></i>
</a>
This works, but what is in href is simply the shared text, not the url, which is the current....
I tried with
data-href="link#withMark"
But no different results...
How can I share my customized url and not the current one?
Try adding something like a bit of PHP if you are able to. if you want to keep it clean html then just ignore this.
in php u define the link u want to set in a variable, then just add <?php $yourvariable ?> to the whatsapp://send?text= INSERT HERE
Add a JavaScript code as I did to dynamically add the link.
Also it is reusable and can be used in any page.
Here, we set the href of the element having class=whatsapp to it's href+ the site link.
Try running the code
document.getElementsByClassName('whatsapp')[0].href+=window.self.location;
<a class="whatsapp share-local-button
data-action="share/whatsapp/share"
target="_blank" href="whatsapp://send?text=">
<i class="fa fa-whatsapp">whatsapp</i>
</a>
I am trying to implement facebook share button in my webpage. Here is my code:
<a class="btn btn-social-icon btn-facebook" href="https://www.facebook.com/sharer/sharer.php?u=test.com" target="_blank">
<i class="fa fa-facebook"></i>
</a>
What are my options if I want to share just a simple text, not an URL ? Is there some kind of text param ?
Facebook allows meta tags to specify some parameters to pass over.
See facebooks developer page for more info.
I have a font awesome icon <i> item inside a a href with a target='_blank' — yet only the text is clickable; clicking on the icon opens a new tab with about:blank, not the actual link.
<a href="..." class="not-light" target="_blank" style="display: block; ">
<i class="fa fa-android"></i> »
</a>
How do I make the icon clickable as well?
For example, click the lightbulb in the footer of the http://ambieye.com/ site's footer.
The <li> is a list. The list must be on the outer and the text in the inner like this :
<li style="display: block; ">
<a href="..." class="not-light" target="_blank">
<i class="fa fa-android"></i> » The text
</a>
</li>
Try it.
The issue was in the javascript handler, not the css/html; the way to find these issues is in Chrome's handlers section, under 'click handler' -
function handleSystemLink(a) {
var url = a.target.href;
The argument a was the i element which did not have href, thus openning a bad link.
Do anyone know how to make a facebook share button with 2 actions ? similar like this , I got a html page with an IQ question ,when you click to share and link to answer pages .
Here are the question page look like :
Here is the code of share button:
<a class="btn-u btn-u-lg btn-block btn-u-dark-blue" href="###" target="_blank">
<i class="fa fa-facebook"></i> Facebook
</a>
Thanks for help