MyBB Community Forums

Pages: 1 2 3

add font awesome in header include templete

<link rel="stylesheet" href="https://use.fontawesome.com/b57b7189ce.css">

add this code in Posbit template and postbit classic templete after {$post['subject_extra']}

For Facebook

	<a href="https://www.facebook.com/sharer/sharer.php?u={$mybb->settings['bburl']}/{$post['postlink']}" class="fb-share-button" onclick="javascript:window.open(this.href,  '', 'menubar=no,toolbar=no,resizable=yes,scrollbars=yes,height=600,width=600');return false;"><i class="fa fa-facebook-square" style="font-size:18px;color:#3B5998"></i></a>

for google + add after above code

into postbit classic and posbit

<a href="https://plus.google.com/share?url={$mybb->settings['bburl']}/{$post['postlink']}" onclick="javascript:window.open(this.href,
  '', 'menubar=no,toolbar=no,resizable=yes,scrollbars=yes,height=600,width=600');return false;"><span class="g-share-button"><i class="fa fa-google-plus-square" style="font-size:18px;color:#d34836"></i></span></a>

for twitter

<a href="https://twitter.com/intent/tweet?text={$thread['subject']} &url={$mybb->settings['bburl']}/{$post['postlink']}"onclick="javascript:window.open(this.href,'', 'menubar=no,toolbar=no,resizable=yes,scrollbars=yes,height=600,width=600');return false;"><span class= "t-share-btn"><i class="fa fa-twitter-square" style="font-size:18px;color:#0084b4"></i></span></a>

add this code to global.css

.fb-share-button {
	float:right;
	margin-right:10px;
}

Google+ sharing button css

.g-share-button {
	float:right;
	margin-right:5px;
}

for twitter

.t-share-btn {
float:right;
	margin-right:5px;}

preview

BR
Mujeeb

(2017-01-08, 12:29 PM)mujeebdgk Wrote: [ -> ]add this code in header include template

<div id="fb-root"></div>
<script>(function(d, s, id) {
  var js, fjs = d.getElementsByTagName(s)[0];
  if (d.getElementById(id)) return;
  js = d.createElement(s); js.id = id;
  js.src = "//connect.facebook.net/en_GB/sdk.js#xfbml=1&version=v2.8";
  fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>

................

I guess you have to paste this code part into showthread template after the <body> tag

(2017-01-08, 03:05 PM)SvePu Wrote: [ -> ]
(2017-01-08, 12:29 PM)mujeebdgk Wrote: [ -> ]add this code in header include template
<div id="fb-root"></div>
<script>(function(d, s, id) {
  var js, fjs = d.getElementsByTagName(s)[0];
  if (d.getElementById(id)) return;
  js = d.createElement(s); js.id = id;
  js.src = "//connect.facebook.net/en_GB/sdk.js#xfbml=1&version=v2.8";
  fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
................
I guess you have to paste this code part into showthread template after the <body> tag

after stylesheet codes

Instruction from Facebook developer page:

Quote:Step 2: Include the JavaScript SDK on your page once, ideally right after the opening <body> tag
.....

soon i ll try and will update post

thanks for suggestion , i update tutorial

Works like a charm, thanks!

Good job! What about Twitter? Is possible to make a sahre popup window for Facebook (same as Google+ has)?

(2017-01-15, 01:55 PM)Eldenroot Wrote: [ -> ]Good job! What about Twitter? Is possible to make a sahre popup window for Facebook (same as Google+ has)?

Facebook also have popup , but it loads slowly you have to wait until Facebook scripts load completely will try to improve this and soon i ll add twitter : Smile

may be tonight

No, facebook is opened in new tab (there is target="_blank")

Very nice tutorial please add google icon square as facebook .

Pages: 1 2 3

mujeebdgk

SvePu

mujeebdgk

SvePu

mujeebdgk

Team-Visionz

Eldenroot

mujeebdgk

Eldenroot

iturdu