Is there any way to add a Facebook Share Button to a static HTML page? I've implemented a simple web site with no server side, just a bunch of html pages and I was abble to add a Like button because it is implemented with iFrame element.
I have searched for a solution regarding the Share Button before posting here, but can't really find anything.
(Example of a share button can be seen on a youtube web site, on share section of each video.)
Any help is appreciated.
This should solve your problem: FB Share button/dialog documentation
Genereally speaking you can use either normal HTML code and style it with CSS, or you can use Javascript.
Here is an example:
<a href="https://www.facebook.com/sharer/sharer.php?u=https%3A%2F%2Fparse.com" target="_blank" rel="noopener">
<img class="YOUR_FB_CSS_STYLING_CLASS" src="img/YOUR_FB_ICON_IMAGE.png" width="22px" height="22px" alt="Share on Facebook">
</a>
Replace https%3A%2F%2Fparse.com, YOUR_FB_CSS_STYLING_CLASS and YOUR_FB_ICON_IMAGE.png with your own choices and you should be ok.
Note: For the sake of your users' security use the HTTPS link to FB, like in the a's href attribute.
You should be able to generate your own button code here: http://developers.facebook.com/docs/reference/plugins/like/
<a name='fb_share' type='button_count' href='http://www.facebook.com/sharer.php?appId={YOUR APP ID}&link=<?php the_permalink() ?>' rel='nofollow'>Share</a><script src='http://static.ak.fbcdn.net/connect.php/js/FB.Share' type='text/javascript'></script>
Replace <url> with your own link
<script>function fbs_click() {u=location.href;t=document.title;window.open('http://www.facebook.com/sharer.php?u='+encodeURIComponent(u)+'&t='+encodeURIComponent(t),'sharer','toolbar=0,status=0,width=626,height=436');return false;}</script><style> html .fb_share_link { padding:2px 0 0 20px; height:16px; background:url(http://static.ak.facebook.com/images/share/facebook_share_icon.gif?6:26981) no-repeat top left; }</style><a rel="nofollow" href="http://www.facebook.com/share.php?u=<;url>" onclick="return fbs_click()" target="_blank" class="fb_share_link">Share on Facebook</a>
<div class="fb_share">
<a name="fb_share" type="box_count" share_url="<?php the_permalink() ?>"
href="http://www.facebook.com/sharer.php">Partilhar</a>
<script src="http://static.ak.fbcdn.net/connect.php/js/FB.Share" type="text/javascript"></script> </div> <?php } }
add_action('thesis_hook_byline_item','fb_share');
In a very simple way, you can achieve this
Facebook Share
*replace your_page_link.com with your desired URL or page link
Example
Facebook Share
Related
I have created a link to YouTube using tag in HTML, but it doesn't work when I click on the text. Here is the code:
<div>
<p>Source to <a href="https://www.youtube.com/">
<span style="color:red">Youtube</span></a>.</p>
</div>
Thanks for any help for the answers
It must be href not “herf”. Just a normal syntax error or typo.
Find the difference :D
<a herf="https://www.youtube.com/">Youtube</a>
Youtube
Click here
to view my YouTube video.
Click hereto view my YouTube video.
This will helpful to you
https://www.w3schools.com/tags/tag_a.asp
Is there any way to make a button linked to a document (PDF) on HTML?
As additional data, this button would be an image.
PS: I am using Notepad++.
Thank you.
Yes. Simply use a regular link:
<a href="http://example.com/myPDF.pdf">
<img src="http://example.com/myImage.jpg">
</a>
And if you want it to open in a new window as to not divert traffic...
<a href="http://example.com/myPDF.pdf" target="_blank">
<img src="http://example.com/myImage.jpg">
</a>
Also, I should mention that the text editor you use is irrelevant in this question, because Notepad++ is just want you use to write the HTML. It's not specific to any one editor.
Something like this
<img src="yourImage.jpg"></img>
And yes this also works with Notepad++ ;-)
If you have a button-looking image foo.png and the PDF document has the URL hyps.pdf and the title “Hypsology”, you can use a link like the following:
<img alt="Hypsology (PDF)" src="foo.png">
What happens when a user clicks on the image depends on his browser and its settings.
I coded some basic share buttons in HTML and CSS. I want to place these buttons on 300 different pages on a simple HTML website.
Is there a easy way to ask for the current link of the website instead of typing in the website URL manually?
Example:
Page 1 www.site.com/home.html
<a class='share-facebook' href="http://www.facebook.com/sharer.php?u= www.site.com/home.html" target="_blank">
This will now share the home page through Facebook:
Page 2 www.site.com/info.html
<a class='share-facebook' href="http://www.facebook.com/sharer.php?u=[current website url-tag or code?]" target="_blank">
What do I type in at "current website URL tag or code" to get the desired outcome? (share www.info.html without actually manually typing in the URL)
Is it even possible with only HTML? If not, how should the JS look like?
No, this isn't possible with pure HTML. In fact, this is often done server-side using languages such as PHP:
<a class='share-facebook' href="http://www.facebook.com/sharer.php?u=<?="http://$_SERVER[HTTP_HOST]$_SERVER[REQUEST_URI]"?>" target="_blank">
In JavaScript, you'll probably have to assign an id to your link first.
HTML:
<a class='share-facebook' href="http://www.facebook.com/sharer.php?u=[current website url-tag or code?]" target="_blank" id="facebook-button">
JavaScript:
document.getElementById("facebook-button").href="document.URL";
Sooo.. I've got this navigation on the frontpage. I'm trying make it link to an anchor on another page.
www.oddfuse.com
This is the anchor link:
<a class="hover" title="Skills" href="/page#skills">
As you can see, it does not redirect to the specified page.
However it does work when typed directly into the address bar:
www.oddfuse.com/page#skills
This also works:
<a class="hover" title="Skills" href="/page">
But with the hash, I get no response whatsoever.
Any ideas on how I fix this?
Okay, so it turned out that it was the jQuery Mobile somehow messing with the anchor tags.
I needed to put data-ajax="false" in the link, and it now works perfectly. TMYK.
Found the solution here
can you try including the file extension?
i.e.
<a class="hover" title="Skills" href="/page.html#skills" />
I'm wondering if it thinks the # is part of a file name that can't be found.
If you want a link to jump a specific location on a different page, you'll need to replace #anchor with the full URL for the target page, similar to:
<a class="hover" title="Skills" href="http://oddfuse.com/page/#skills">
I am using the facebook share url but having trouble displaying the image parameter of the url, can anyone advise where I may be going wrong with this?
HTML
<a title="Share this on Facebook"
href="http://www.facebook.com/sharer.php?
s=100
&p[url]='http://www.test.com'
&p[images][0]='http://www.meandmrsjoneshotel.com/wp-content/themes/child-theme/img/fb-thumbs/home.png'
&p[title]='This is the title'
&p[summary]='This is the share description'"
target="_blank" class="fb ir">
Share this page on Facebook
</a>
JS Fiddle http://jsfiddle.net/pUMZb/
Thanks
try to remove the apostrophes. Your code should be look like this
<a title="Share this on Facebook"
href="http://www.facebook.com/sharer.php?
s=100
&p[url]='http://www.test.com'
&p[images][0]=http://www.meandmrsjoneshotel.com/wp-content/themes/child-theme/img/fb-thumbs/home.png
&p[title]='This is the title'
&p[summary]='This is the share description'"
target="_blank" class="fb ir">
Share this page on Facebook
</a>