To add twitter button to tweet your page URL just do the following:
* add this line to HTML to show tweet button:
<a href="https://twitter.com/share" class="twitter-share-button" data-url="YOUR PAGE URL" data-text="PAGE TITLE OR DESCRIPTION OF THE TWEET" data-lang="en" data-size="small" data-count="none" data-hashtags="HASHTAG YOU WANT TO TWEET FOR">TWEET</a>
* add the following script in master page or your page:
<script>!function (d, s, id) { var js, fjs = d.getElementsByTagName(s)[0], p = /^http:/.test(d.location) ? 'http' : 'https'; if (!d.getElementById(id)) { js = d.createElement(s); js.id = id; js.src = p + '://platform.twitter.com/widgets.js'; fjs.parentNode.insertBefore(js, fjs); } }(document, 'script', 'twitter-wjs');</script>
The result will be like this:
Notes:
- URL should be published, this means you can't share localhost or internal URL if you create javascript to get the current page URL.
- You can create javascript to get the current page title.
- You can remove the section data-hashtags if you want.
- You can change the value of data-lang to your specific language like ar for Arabic language.
- You can change the value of data-size to big to show bigger icon.
* add this line to HTML to show tweet button:
<a href="https://twitter.com/share" class="twitter-share-button" data-url="YOUR PAGE URL" data-text="PAGE TITLE OR DESCRIPTION OF THE TWEET" data-lang="en" data-size="small" data-count="none" data-hashtags="HASHTAG YOU WANT TO TWEET FOR">TWEET</a>
* add the following script in master page or your page:
<script>!function (d, s, id) { var js, fjs = d.getElementsByTagName(s)[0], p = /^http:/.test(d.location) ? 'http' : 'https'; if (!d.getElementById(id)) { js = d.createElement(s); js.id = id; js.src = p + '://platform.twitter.com/widgets.js'; fjs.parentNode.insertBefore(js, fjs); } }(document, 'script', 'twitter-wjs');</script>
The result will be like this:
Notes:
- URL should be published, this means you can't share localhost or internal URL if you create javascript to get the current page URL.
- You can create javascript to get the current page title.
- You can remove the section data-hashtags if you want.
- You can change the value of data-lang to your specific language like ar for Arabic language.
- You can change the value of data-size to big to show bigger icon.
No comments:
Post a Comment