miniBB ® miniBB®
miniBB Support Forums
 | Forums | Register | Reply | Search | Statistics | Manual |
Custom Tutorials and Modifications miniBB Support Forums / Custom Tutorials and Modifications /   

Adding Facebook Twitter icons to Forum Topic Titles

Author Bluesplayer
Registered
#1 | Posted: 14 Jan 2013 10:09 | Edited by: Bluesplayer 
Social Bookmarking scripts normally use the page url and title from within the title tag, whereas with a little work they can be made to work off the topic title and topic url. This is how I achieved this:

I added the code below right at the top above <table class="tbTransparent"> to both the main_last_discuss_cell.html and main_topics_cell.html:

<table>
<tr><td>
<div style="margin-top: 7px; width: 60px;">
<a rel="nofollow" style="text-decoration: none;" href="http://www.facebook.com/" onclick=" window.open('http://www.facebook.com/sharer.php?u={$linkToTopic}+&amp;t={$topicTitle}');return false;" title="Bookmark to: Facebook"><img style="padding-bottom: 1px;" src="/images/facebook.png" alt="Bookmark to: Facebook" name="Facebook" id="Facebook" border="0"></a><a rel="nofollow" style="text-decoration: none;" href="http://www.twitter.com/" onclick=" window.open('http://twitter.com/home?status={$topicTitleCut}+%20{$linkToTopic}');return false;" title="Bookmark to: Twitter"><img style="padding-bottom: 1px;" src="/images/tweet.png" alt="Bookmark to: Twitter" name="Twitter" id="Twitter" border="0"></a>
</div>
</td><td>

and this right at the bottom:

</td></tr></table>

This has the effect of moving the initial display over to the right allowing room for the new icons. This might well not suit your display so you will have to figure out how you like your icons to be shown. You can see the code you will need to add above - the code within the div.

The Facebook code should work fine with {$linkToTopic} and {$topicTitle}. These are already present in the minibb files. The Twitter code will also work fine in most cases when using the same but will fail if your titles have certain type of characters. You can check this by attempting to post to Twitter. With my own forum I post titles using currency symbols and dashes etc which will cause the Twitter post to fail. To overcome this I added this code underneath if($topic_title=='') $topic_title=$l_emptyTopic; within both the bb_func_ldisc.php and bb_func_vtopic.php files:

$topicTitleCut=$topic_title;
$topicTitleCut=str_replace('%', '', $topicTitleCut );
$topicTitleCut=str_replace('£', '', $topicTitleCut );
$topicTitleCut=str_replace('!', '', $topicTitleCut );

You can add your own lines above to remove any characters that cause Twitter post failures.

As mentioned I placed the above code below if($topic_title=='') $topic_title=$l_emptyTopic; but whether that is absolutely the right place for it I am not sure. It should well be placed in a different place or in a different file maybe but it does work for me so presumebly it is ok where it is.

To add just Facebook and Twitter icons to the post page uderneath {$postText}</textarea> I added this code:

<div style="float: right;">
<a rel="nofollow" style="text-decoration: none;" href="http://www.facebook.com/" onclick=" window.open('http://www.facebook.com/sharer.php?u='+encodeURIComponent(location.href)+'&amp;t='+encodeURIComponent(docum ent.title));return false;" title="Bookmark to: Facebook"><img style="padding-bottom: 1px;" src="/images/facebook.png" alt="Bookmark to: Facebook" name="Facebook" id="Facebook" border="0"></a><a rel="nofollow" style="text-decoration: none;" href="http://www.twitter.com/" onclick=" window.open('http://twitter.com/home?status='+encodeURIComponent(document.title)+'%20'+encodeURIComponent(location.href) ); return false;" title="Bookmark to: Twitter"><img style="padding-bottom: 1px;" src="/images/tweet.png" alt="Bookmark to: Twitter" name="Twitter" id="Twitter" border="0"></a>
</div>

The icons you use are obviously up to you but there are many here:

Google Social Icons

Facebook Icons

Twitter Icons

Or you can download the icons off my own forum here.
(check out the how the icons show on my own forum above)

Please bear in mind the above code is specific for my own forum so you will probably have to make design alterations to suit your own site.

Author Paul
Lead Developer
#2 | Posted: 14 Jan 2013 12:40 
Thanks, but... if you would build a non-destructive solution, in the similar style of all the solutions miniBB currently has, I would say you did a great job. But putting such modifications under script's core files means you did not achieve anything so far.

It's very bad approach in terms of upgrading the forum and in terms of putting the same modification on multiple forums. As you may know, none of the official miniBB add-ons or solutions offers to modify the core file to achieve something. It's not the proper approach.

At least, this solution needs to show to all users, what exactly should be done in a non-destructive way for any miniBB version, not just the current. Because social networks often change their codes and icons, providing a direct code for 2013 of their versions is a bit lame. Then this solution will expire in a year or so - not an ideal approach for the "software for ages".

Author Bluesplayer
Registered
#3 | Posted: 14 Jan 2013 12:46 
Paul:
Thanks, but... if you would build a non-destructive solution, in the similar style of all the solutions miniBB currently has, I would say you did a great job. But putting such modifications under script's core files means you did not achieve anything so far.

Yeah. I keep facing this problem because I don't understand the minibb code. I am not a coder and only code when I have to or when I have some idea or other. I am used to ripping pages apart quickly and rebuilding them in the case of upgrades and so on but as you mention many others are not. Oh well all I can do is to make sure people are very aware of the limitations of my code and in the meantime I will try and learn how to code in the 'non-destructive way' as you mentioned.

Author Peter_Lustig
Guest
#4 | Posted: 27 Feb 2013 15:18 
Wow this is so cool!

Custom Tutorials and Modifications miniBB Support Forums / Custom Tutorials and Modifications / Adding Facebook Twitter icons to Forum Topic Titles Top

Your Reply Click this icon to move up to the quoted message

 Short link for this topic:

 ?
Only registered users are allowed to post here. Please, enter your username/password details upon posting a message, or register first.


Before posting, make sure your message is compliant with our forum posting rules. If not, it may be locked or deleted with no explanation.
 
miniBB Support Forums Powered by Forum Software miniBB ® Features  Requirements  Demo  Download  Showcase  Gallery of Arts
Compiler  Premium Extensions  Premium Support  License  Contacts
Proceed with the Captcha add-on: protect your miniBB-forums from the automated spam and flood.
Captcha Addon for miniBB