EZ Share
EZ Share a Program to Create Custom Share Buttons
This program will create 10 custom share buttons to add to your webpages.
Do you want to add easy access to sharing on Facebook, Twitter, LinkedIn, Email, Tumbler and more? If so use this program to create Custom Share Buttons on your Webpages.
HTML and Javascript
<!DOCTYPE html>
<html>
<head>
<center><title>EZ Share</title>
<style>
body {
font-size:18px;
background-color:lightblue;
}
input{
font-size:16px;
}
</style>
</head>
<body>
<h2>EZ Share</h2>
Just enter your information to create custom Share Buttons </center><br>
Page Name: <input id=pname type="text"placeholder="My Website"><br>
Page URL: <input id=purl type="text"placeholder="https://yoursite.com"><br>
Hashtag: <input id=hash type="text"placeholder="awesome"><br><br>
<button type="button" onclick="strReplace();">Create</button><br><br>
Click new code to Copy to Clipboard<br><br>
<div id="a" onclick="copyDivToClipboard()"> <p id="myText"></p></div>
<script> function copyDivToClipboard() { var range = document.getSelection().getRangeAt(0); range.selectNode(document.getElementById("a")); window.getSelection().addRange(range); document.execCommand("copy") } </script>
Example:
<h3>Share with Friends</h3> <!-- Twitter --> <a href="https://twitter.com/share?url=https://freecodeexamples.blogspot.com&text=Free Code Examples&hashtags=Amazing" target="_blank"> <img src="https://simplesharebuttons.com/images/somacro/twitter.png" alt="Twitter" /> </a> <!-- Facebook --> <a href="http://www.facebook.com/sharer.php?u=https://freecodeexamples.blogspot.com" target="_blank"> <img src="https://simplesharebuttons.com/images/somacro/facebook.png" alt="Facebook" /> </a> <!-- Google+ --> <a href="https://plus.google.com/share?url=https://freecodeexamples.blogspot.com" target="_blank"> <img src="https://simplesharebuttons.com/images/somacro/google.png" alt="Google" /> </a> <!-- LinkedIn --> <a href="http://www.linkedin.com/shareArticle?mini=true&url=https://freecodeexamples.blogspot.com" target="_blank"> <img src="https://simplesharebuttons.com/images/somacro/linkedin.png" alt="LinkedIn" /> </a> <!-- Email --> <a href="mailto:?Subject=Free Code Examples&Body=I%20saw%20this%20and%20thought%20of%20you!%20 https://freecodeexamples.blogspot.com"> <img src="https://simplesharebuttons.com/images/somacro/email.png" alt="Email" /> </a> <!-- Pinterest --> <a href="http://pinterest.com/pin/create/button/?url=https://freecodeexamples.blogspot.com&media=https://freecodeexamples.blogspot.com&description=Free Code Examples"> <img src="https://simplesharebuttons.com/images/somacro/pinterest.png" alt="Pinterest" /> </a> <!-- Reddit --> <a href="http://reddit.com/submit?url=https://freecodeexamples.blogspot.com&title=Free Code Examples" target="_blank"> <img src="https://simplesharebuttons.com/images/somacro/reddit.png" alt="Reddit" /> </a> <!-- StumbleUpon--> <a href="http://www.stumbleupon.com/submit?url=https://freecodeexamples.blogspot.com&title=Free Code Examples" target="_blank"> <img src="https://simplesharebuttons.com/images/somacro/stumbleupon.png" alt="StumbleUpon" /> </a> <!-- Tumblr--> <a href="http://www.tumblr.com/share/link?url=https://freecodeexamples.blogspot.com&title=Free Code Examples" target="_blank"> <img src="https://simplesharebuttons.com/images/somacro/tumblr.png" alt="Tumblr" /> </a>
<a href="https://api.whatsapp.com/send?text=https://freecodeexamples.blogspot.com" data-action="share/whatsapp/share">
<img border="0" height="70" src=" http://www.stickpng.com/assets/images/580b57fcd9996e24bc43c543.png" width="70" />
</a>
<script>
function strReplace(){
var myStr = '<h2>Share with Friends</h2><br> <!-- Twitter --> <a href="https://twitter.com/share?url=URL&amp;text=NAME&amp;hashtags=HASH" target="_blank"> <img src="https://simplesharebuttons.com/images/somacro/twitter.png" alt="Twitter" /> </a> <!-- Facebook --> <a href="http://www.facebook.com/sharer.php?u=URL" target="_blank"> <img src="https://simplesharebuttons.com/images/somacro/facebook.png" alt="Facebook" /> </a> <!-- Google+ --> <a href="https://plus.google.com/share?url=URL" target="_blank"> <img src="https://simplesharebuttons.com/images/somacro/google.png" alt="Google" /> </a> <!-- LinkedIn --> <a href="http://www.linkedin.com/shareArticle?mini=true&amp;url=URL" target="_blank"> <img src="https://simplesharebuttons.com/images/somacro/linkedin.png" alt="LinkedIn" /> </a> <!-- Email --> <a href="mailto:?Subject=NAME&amp;Body=I%20saw%20this%20and%20thought%20of%20you!%20 URL"> <img src="https://simplesharebuttons.com/images/somacro/email.png" alt="Email" /> </a> <!-- Pinterest --> <a href="http://pinterest.com/pin/create/button/?url=URL&media=URL&description=NAME"> <img src="https://simplesharebuttons.com/images/somacro/pinterest.png" alt="Pinterest" /> </a> <!-- Reddit --> <a href="http://reddit.com/submit?url=URL&amp;title=NAME" target="_blank"> <img src="https://simplesharebuttons.com/images/somacro/reddit.png" alt="Reddit" /> </a> <!-- StumbleUpon--> <a href="http://www.stumbleupon.com/submit?url=URL&amp;title=NAME" target="_blank"> <img src="https://simplesharebuttons.com/images/somacro/stumbleupon.png" alt="StumbleUpon" /> </a> <!-- Tumblr--> <a href="http://www.tumblr.com/share/link?url=URL&amp;title=NAME" target="_blank"> <img src="https://simplesharebuttons.com/images/somacro/tumblr.png" alt="Tumblr" /> </a><a href="https://api.whatsapp.com/send?text=URL" data-action="share/whatsapp/share"> <img border="0" height="70" src=" http://www.stickpng.com/assets/images/580b57fcd9996e24bc43c543.png" width="70" /> </a>';
var newStr = myStr.replace(new RegExp("URL", 'g'), document.getElementById("purl").value).replace(new RegExp("NAME", 'g'),document.getElementById("pname").value).replace(new RegExp("HASH",'g'),document.getElementById ("hash").value);
document.getElementById("myText").innerHTML = newStr;
}
</script>
</body>
</html>
Comments
Post a Comment