ForumD.ru - Design for forums and technical support

Layout for detailed design Mass Effect

mybb@mybb.ru (Gerda) — Tue, 26 Jun 2018 10:34:05 +0300

[html]
<div id="port-block1" class="forsale">

<div id="cover-block">
Creators: <a href="http://forumd.ru/profile.php?id=6784" target="_blank">Bruksa</a><br>
Cost: 86$ *<br>
Design for sale!<br>
Description: Layout for detailed design Mass Effect<br>
<br>

* The design will be sold exclusively (in one hand). <br>
** List of included in the price in description.

</div>

Detailed description

INCLUDED IN THE PRICE:
� Adjusting the layout: replacing the logo "Stronghold" with your project logo
� CSS coding for the platform MyBB.ru
� Archive with PSD-layout, all sources and codes
� Installation and configuring the style and scripts
� Other adjustments, changes and scripts are also possible

GRAPHICS
Detailed layout - almost every element of the forum will be stylized and framed.
All design details (except the header and background) are drawn manually without using clipart.

LAYOUT & SCRIPTS
We will make a detailed CSS-code with outlines for forum's tables, posts & userprofiles on the topic page, and also all forum pages.
In addition, the design will be equipped with a container with tabs and a stylized list of links in the announcement of the forum.

Text wrap (MyBB) [Deff, Romych]

mybb@mybb.ru (Zyindy) — Sat, 23 Jun 2018 21:58:53 +0300

Text wrap in posts by means of css
Adds the buttons to the form of reply next to the button of pictures uploading. They allow setting the position of a text in the right/left of image.

Author: Deff
Platform: MyBB

Put the link, mark it out and push the right button.
Additional advantages: doesn�t add buttons to the form of reply, additional buttons appear only if you point to the icon of picture uploading.

To HTML-top (Admin > Options: 1st form)

Code:

    <!--// CSS-version of text wrap in posts //-->
    <style>.postimg[alt="float:right"]{float:right;padding-left:12px;pointer-events:none}.postimg[alt="float:left"]{float:left;padding-right:12px;pointer-events:none}
    #add_float{position:absolute;padding:2px;top:-8px;left:50%;margin-left:-29px!important;width:57px!important;background: url("http://savepic.ru/7021157.png") no-repeat 50%!important;}
    #button-image #add_float img{display:block;position:relative;z-index:4;}
    #button-image>img{position:relative;z-index:2;}
    #button-image>center{opacity:0;visibility:hidden; transition-duration: .8s;}
    #button-image:hover>center{opacity:1; visibility:visible;}
    </style>
    <script>$(function(){$('.postimg[title="float:right"],.postimg[title="float:left"]').mouseover(function(e){e.preventDefault();});
    var a ='<center style="position:relative;"><table id=add_float><tr><td id="text-left" title="Text wrap: text in the left">@@</td><td></td><td id="text-right" title="Text wrap: text in the right">##</td></tr></table></center>',b3="]'";
    var b1 = '<img onclick="bbcode(\'[img=float:right'+b3+',\'[/img'+b3+')" src="/i/blank.gif"/>',b2 = '<img onclick="bbcode(\'[img=float:left'+b3+',\'[/img'+b3+')" src="/i/blank.gif"/>';
    a = a.replace('@@',b1).replace('##',b2);
    $('#post #button-image').prepend(a);});
    </script>

* ATTENTION! Replace the link in the style with your own picture of button and set the code for YOUR style.

Text wrap. � Romych
Adds the buttons to the form of reply next to the button of pictures uploading. They allow setting the position of a text in the right/left of image.

Author: Romych
Platform: MyBB

to html-bottom (if it doesn�t work, put it to the form of reply):

Code:

<!�text wrap 2.4.4-->
<script language="javascript">
$(function(){
$('td#button-link').before('<td id="floatbut" style=\'background-image:url("http://s002.radikal.ru/i198/1009/43/f183caeae434.gif")\'></td>');
$('#floatbut, .vibor').click(function(){
$('div#float').toggle();});
  });
elm=document.getElementsByTagName("div")
for(x in elm) if(elm[x].className=="post-content") 
{
post = elm[x].innerHTML;
if(post.indexOf("[/float]") != -1) {
floats = /\[float=(.*?)\]([^\[]{1,11000})\[\/float\]/gi
elm[x].innerHTML = elm[x].innerHTML.replace(floats, "<span style='float: $1; margin: 15px; text-align: $1;'>$2</span>")
}}
</script>
<div id="float" style="display:none;background:#FFFFCC;border:1px solid black; width:auto; padding:8px; position:absolute; margin-top:-32%; margin-left:35%; z-index:20">
<div><strong>Position of text wrap</strong></div><br>
<div align="center">
<img class="vibor" src="http://s001.radikal.ru/i193/1009/96/695abc799ddb.png" title="left" onclick="bbcode('[float=left]', '[/float]')" />
<img class="vibor" src="http://s002.radikal.ru/i199/1009/ac/95c10fcc7d82.png" title="right" onclick="bbcode('[float=right]', '[/float]')" />
</div></div>

Romych wrote:

you will get this button in the form of reply -
If you push it, you get the choice of right/left text wrap

Thanks for helping and testing: mkusher� and rps

New fonts in the form of reply (MyBB) [rps]

mybb@mybb.ru (Zyindy) — Sat, 23 Jun 2018 21:31:25 +0300

New fonts in the form of reply.
Adds new fonts to the form of reply.

Author: rps
Platform: any

Put to HTML-bottom (Admin > Options: 2nd form).

Code:

 <script type="text/javascript">
if (document.URL.indexOf("/viewtopic.php?id")!=-1 || document.URL.indexOf("/post.php?tid")!=-1 || document.URL.indexOf("/messages.php?action")!=-1 || document.URL.indexOf("/messages.php?box")!=-1 || document.URL.indexOf("/post.php?fid")!=-1 || document.URL.indexOf("/edit.php?id")!=-1) {
var ft; var i; var ft_f; var j = "";
ft = document.getElementById("font-area");
 
var ft_f = new Array();
ft_f.push('Bebas Neue');
 
for (i in ft_f) {
j = "<div><span style='font-family:" + ft_f[i] + ";'>" + ft_f[i] +  "</span><img src='/i/blank.gif' onclick=\"bbcode('[";
j += "font=" + ft_f[i];
j += "]','[/font]')\" /></div>";
ft.innerHTML += j;
}}</script>

Multiply the line

ft_f.push('Segoe print');

by as many fonts you need.

Package of tags to the form of reply (MyBB) [Deff]

mybb@mybb.ru (Zyindy) — Sat, 23 Jun 2018 21:21:51 +0300

Marking-out of quotes in roleplay forums
Adds your own package of bb-tags for marking-out a text to the form of reply.

Author: Deff
Platform: MyBB

To HTML-bottom (Admin > Options: 2nd form)

<div id=Hide><div class="container" id="meny_My_replic" style="display:none" onclick="changeVisibility('meny_My_replic')">
<p>1. *My remark<span>left part of BB-code,right part of BB-code</span></p>
<p>2. *My thoughts<span> left part of BB-code,right part of BB-code</span></p>
<p>3. *Someone�s remark<span> left part of BB-code,right part of BB-code</span></p>
<p>4. *Someone�s thoughts<span> left part of BB-code,right part of BB-code</span></p>
</div></div>

<style>#My_replic_meny{background-image:url(http://savepic.net/469555.gif);}
#meny_My_replic span{
display:none;
}
#meny_My_replic p::first-letter{
color:red;
}
#meny_My_replic p{
font-weight:bold;
color:blue;
}
#meny_My_replic {
border: #fff outset 3px;
padding:15px!important;
width:120px;
position:absolute;
margin-right:-140px;
right: 1%;
top: 43px;
}
</style>

<script>
var str='<img src="/i/blank.gif" title="Marking-out of remarks" onclick="changeVisibility(\'meny_My_replic\')"/>';
if(document.URL.indexOf("/viewtopic.php?id")!=-1 || document.URL.indexOf("/post.php?fid")!=-1 || document.URL.indexOf("/post.php?tid")!=-1 || document.URL.indexOf("/edit.php?id")!=-1)$("#form-buttons #button-keyboard").after("<td id=My_replic_meny>"+str+"</td>")
$("#keyboard-area").after($("div.#Hide").html())
$('#meny_My_replic p').click(function(){
var L=$(this).find("span").html();
var P=L.split(',');
bbcode(P[0],P[1])
return false;
});
</script>

Put your BB-codes for the remark instead of red phrases
For example:

Code:

[color=red][i][b],[/b][/i][/color]

(*Left and right parts of BB-tags should be separated by commas.

Points 1.,2,3,4, - you can add your own or replace these with your own

We�ve got a request-suggestion: - replace the text in menu with the icon.
In this case the code of menu (the upper part of script) would look like that:

<div id=Hide><div class="container" id="meny_My_replic" style="display:none" onclick="changeVisibility('meny_My_replic')">
<p>1. <img src="img/smilies/MyBB/dark/crazyfun.gif" title="Comment"/><span>left part of BB-code,right part of BB-code</span></p>
<p>2. <img src="http://forums.0pk.ru/img/smilies/MyBB/dark/blink.gif" title="Comment"/><span> left part of BB-code,right part of BB-code </span></p>
<p>3. <img src="http://forums.0pk.ru/img/smilies/MyBB/dark/offtop.giff" title="Comment"/><span> left part of BB-code,right part of BB-code </span></p>
<p>4. <img src="img/smilies/MyBB/dark/crazyfun.gif" title="Comment"/><span> left part of BB-code,right part of BB-code </span></p>
</div></div>

Button for justified text alignment (MyBB) [Deff]

mybb@mybb.ru (Zyindy) — Sat, 23 Jun 2018 20:54:39 +0300

Justified text alignment
Adds a button with text positioning style justify to the form of reply

Author: Deff
Platform: MyBB

To HTML-bottom (Admin > Options: 2nd form)

Code:

    <style type="text/css">
    #button-justify { background:url(http://savepic.net/6701397.png) center no-repeat!important;}
    </style>
    <script type="text/javascript">
    $(document).ready(function(){
    $("#post #button-center").after('<td id=button-justify align=center valign=center title="Justified text alignment"><img onclick="bbcode(\'[align=justify]\',\'[/align]\')" src="/i/blank.gif"/></td>');});
    </script>

* ATTENTION! Replace this link in the style to the picture for your button.

Text background fill with colour (MyBB) [Alex_63]

mybb@mybb.ru (Zyindy) — Sat, 23 Jun 2018 19:45:30 +0300

BB-code of colour fill
Adds tags for choosing a colour of marking text to the form of reply

Author: Alex_63
Platform: MyBB
Analogue: Fill for message text (MyBB) [kolobdur74]

To HTML-bottom (Admin > Options: 2nd form):

Code:

    <!-- BB-code of colour fill / � Alex_63 --><style>
    #button-mark{background:url(https://forumstatic.ru/files/0015/92/70/15526.png);}
    #mark-area{width:auto;position:absolute;right:6px;top:43px}
    #mark-area *{border:0}#mark-area table{width:320px;height:20px;padding:0;margin:0}
    #mark-area td{margin:0; padding:0; line-height:0}
    #mark-area td img{width:20px;height:20px;cursor:pointer!important}
    </style>
    <script type="text/javascript">
    $('#button-color').after('<td id="button-mark"><img src="/i/blank.gif" onclick="$(\'#mark-area\').toggle();" title="Background fill"/></td>');
    $(function(){var area=$('#color-area').html();if(area)area=area.replace(/color([\=\'\]])/mgi,'mark$1');
    area='<div class="container" id="mark-area" onclick="$(this).toggle()" style="display:none">'+area+'</div>';
    $('#color-area').after(area);});
    $('.post-content:contains("[mark")').each(function(){var sp='<span style="background-color:$1">$2</span>';
    $(this).html($(this).html().replace(/\[mark=(.*?)\](.*?)\[\/mark\]/mgi,sp));});
    </script>

Layout for simple light design Bleach

mybb@mybb.ru (Gerda) — Fri, 22 Jun 2018 12:40:21 +0300

[html]
<div id="port-block1" class="forsale">

<div id="cover-block">
Creators: <a href="http://forumd.ru/profile.php?id=6784" target="_blank">Bruksa</a><br>
Cost: 27$ *<br>
Design for sale!<br>
Description: Layout for simple light design Bleach<br>
<br>

* The design will be sold exclusively (in one hand). <br>
** List of included in the price in description.<br>
Additional adjustments and technical equipment according to your preferences are paid separately!<br>

</div>

detailed description

INCLUDED IN THE PRICE:
� CSS coding for the platform MyBB.ru
� Archive with PSD-layout, all sources and codes
� Installation and configuring the style and scripts

Additional adjustments, replacement of graphics, etc. paid separately!

GRAPHICS, LAYOUT, SCRIPTS
Simple design with fixed layout.
In design, the minimum number of images, most of the interface is code-based, which allows the design to be quickly loaded from both the PC and the mobile Internet.

The design will contain:
� unusual menu in the forum header
� Two containers for your content in the forum header

Expanding pictures in posts to full size (MyBB) [satsana]

mybb@mybb.ru (Gerda) — Sat, 16 Jun 2018 14:01:37 +0300

Expanding pictures in posts to full size
By clicking on the picture, it unfolds to full size, a second click returns to the post.

Autor: satsana
Platform: any

- does not require changes to the page code;
- automatically processes images compressed by forum style.
HTML �� (Admin > Options: 2nd form):

Code:

    <!-- Expanding pictures -->
    <script type="text/javascript">
     function postimgOnhover (img) {if (img.offsetWidth != 0  && img.naturalWidth > img.offsetWidth) {
      img.style.cursor = 'zoom-in'; img.onclick = function () {
       var imgHeight = img.naturalHeight, winHeight = window.innerHeight; var topShift = (winHeight>imgHeight ? (winHeight-imgHeight)/2 : 0);
       $('body').append('<div class="lightbox" style="position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.9); overflow: auto; text-align: center; z-index: 1000;">' + '<img class="lightimg" src="' + img.src + '" onclick="this.parentNode.remove()" style="position: relative; top: ' + topShift + 'px; cursor: zoom-out;">' + '</div>');}}}
      var postimges = document.getElementsByClassName('postimg');
      for (var i=0; i<postimges.length; i++) {postimges[i].onmouseover = function () {postimgOnhover (this)};}
    </script><!-- Expanding pictures (END) -->

PS:
The script works not only on the MyBB.ru platform for post images, but also on any other sites and html-pages.
It is enough to add to the picture the class postimg:

<img width="200px" src="http://gerda.moy.su/_bl/0/40006864.jpg" class="postimg">

The post counting script for the FRPG Istore

mybb@mybb.ru (Gerda) — Sat, 16 Jun 2018 13:49:24 +0300

[html]
<div id="port-block1" class="saled">

<div id="cover-block">
Author: <a href="http://forumd.ru/profile.php?id=6774" target="_blank">satsana</a> <br>
Platform: MyBB<br>
Description: Game account counting script in separate sections for Istore FGPG<br>
<a href="http://istore.rusff.me" target="_blank">Costumer's site</a>
</div>

</div>

Detailed description
� setting the code on a separate page;
� the opportunity to independently indicate the necessary forums;
� displaying a list of forums for the user depends on whether he has access to view the forums;
� first post of the topic and the attached post on the following pages are not included (optional);
� counting algorithm "from the end" does not look at pages with dates before the specified interval, which significantly speeds up data processing.

Scripts for uploading data to user profile from player's topics

mybb@mybb.ru (Gerda) — Sat, 16 Jun 2018 13:42:48 +0300

[html]
<div id="port-block1" class="forsale">

<div id="cover-block">
Author: <a href="http://forumd.ru/profile.php?id=6774" target="_blank">satsana</a> <br>
Platform: MyBB<br>
Costs: ~32$ *<br>
Description: Scripts for automatically uploading data to user profile from player's topics<br>
<a href="http://enitest.8bb.ru/viewtopic.php?id=31&p=3" target="_blank">Demo</a><br>
<br>
* The cost is calculated individually, depending on your preferences for design and settings. <br>
<br>
<a href="http://forumd-eng.ru/viewtopic.php?id=9" target="_blank" id="store">To Order</a>

</div>

Capabilities
� in the additional profile field, only the link to the topic is entered;
� the script automatically searches for the necessary data in the player's topic;
� in the topic, the data is filled by using a simple template, without using table tags, etc.
� the template also converts the template text into a table;
� both the same and different display of the game mechanics in the topics and the mini profile are possible.
� individual design of the script for your project according to your preferences;
� it is optionally possible to add spoilers, pop-ups, hover effects, etc.
� design according to your layout or custom design of the module from our designers

Cost and Options
The cost of the script and its design depends on your preferences for setting up the script and its design.
Information in the profile and a template in the post is developed individually, depending on what you want to see there.
The basic package includes a simple design of the script for your project (colors / borders).
It is possible to develop an individual detailed design of the template information from the post with edging and graphic style.
Also we can design the module by using your layout.
There are a variety of options for an additional fee: animation, spoilers, the appearance of some information blocks when hovering, etc.

Dice throw for MyBB.ru forums

mybb@mybb.ru (Gerda) — Sat, 16 Jun 2018 13:30:38 +0300

[html]
<div id="port-block1" class="saled">

<div id="cover-block">
Author: <a href="http://forumd.ru/profile.php?id=6774" target="_blank">satsana</a> <br>
Platform: MyBB<br>
Description: Dice throw �� various systems of game mechanics for FRPG on the platform MyBB.ru<br>
<a href="http://enirin.ru" target="_blank">Costumer's site</a>
</div>

</div>

Detailed description
Dice throw �� various systems of game mechanics for FRPG on the platform MyBB.ru
� convenient forms of data entry;
� customizable functions for displaying the maximum, minimum value and sum;
� individual development for a specific role-playing system;
� interpretation of the results of the throw from the point of view of the system.

Image Gallery

mybb@mybb.ru (Gerda) — Sat, 16 Jun 2018 13:19:00 +0300

[html]
<div id="port-block1" class="forsale">

<div id="cover-block">
Author: <a href="http://forumd.ru/profile.php?id=6774" target="_blank">satsana</a><br>
Platform: any<br>
Cost: from 18$ *<br>
Description: Photo Gallery<br>
<a href="http://moscg.com" target="_blank">DEMO</a><br>
<br>
<a href="http://forumd-eng.ru/viewtopic.php?id=9" target="_blank" id="store">To order</a>
</div>

</div>

Detailed description
� it is established by connecting an external script and style;
� does not require changes to the page code;
� automatically finds images with links;
� there is a function of photo numbering;
� Supports keyboard control.

Cost and Options
The original cost includes customizing the appearance of the photo viewer
For an additional fee, the following options are available:
� adding names to photos (+8$)
� slideshow (+13,5$)
� effects and slide show animation (from 9,5$ depending on the complexity)

New script changing the image for the forums MyBB.ru

mybb@mybb.ru (Gerda) — Sat, 16 Jun 2018 13:11:11 +0300

[html]
<div id="port-block1" class="saled">

<div id="cover-block">
Author: <a href="http://forumd.ru/profile.php?id=6774" target="_blank">satsana</a> <br>
Platform: MyBB<br>
Description: New script changing the image for the forums MyBB.ru<br>
<a href="http://enirin.ru" target="_blank">Customer's site</a>
</div>

</div>

</div>

Detailed description
� convenient form of data entry;
� avatar preview;
� tags compatible with other similar scripts;
� inserting tags into the beginning of the message with the removal of similar tags added earlier;
� Replace data for scripts accessing the user and quotes.

hello!!!

mybb@mybb.ru (Siya) — Sat, 16 Jun 2018 11:20:51 +0300

Hello,
I'am Siya from India.
Exploring yourself to different places is the best part of the life.Communicating with new people learning their culture,language,life style and many more.We get to learn many things.And Visiting different places refresh's your mind.I love exploring myself to different places.It also hences your knowledge.
Anybody here to welcome me.

regards,
siya

CMA Training Institutes in Bangalore

Adding smilies to the standard window (MyBB) [Kosha-san]

mybb@mybb.ru (Zyindy) — Sat, 16 Jun 2018 01:40:57 +0300

Adding smilies to the standard window
Script replaces smilies in the block of standard ones.
Code adds smilies to the standard ones, but does not delete standard smilies.
Author: Kosha-san
Platform: MyBB

To html-bottom (Admin > Options: 2nd form).

Code:

<!--additional smilies-->
<script language="javascript">
$(function(){
$('#smilies-block').append($('.asmile'));});
</script>
<span style="display:none">
<img class="asmile" src="http://" onclick=smile('[img]'+$(this).attr('src')+'[/img]') />
<img class="asmile" src="http://" onclick=smile('[img]'+$(this).attr('src')+'[/img]') />
<img class="asmile" src="http://" onclick=smile('[img]'+$(this).attr('src')+'[/img]') />
<img class="asmile" src="http://" onclick=smile('[img]'+$(this).attr('src')+'[/img]') />
<img class="asmile" src="http://" onclick=smile('[img]'+$(this).attr('src')+'[/img]') />
<img class="asmile" src="http://" onclick=smile('[img]'+$(this).attr('src')+'[/img]') />
</span>

Put a smilie link instead of http://. If you want to add more smilies, you should just add this line to the code:

Code:

<img class="asmile" src="http://" onclick=smile('[img]'+$(this).attr('src')+'[/img]') />

Add as many lines of code, as many additional smilies you want.

(Kosha-san)

Additional sets of smilies in standard�s window (MyBB) [Romych]

mybb@mybb.ru (Zyindy) — Sat, 16 Jun 2018 01:37:45 +0300

Additional set of smilies in the window of standard ones
Adds additional tabs with your own pictures in the smilies window.
Author: Romych
Platform: MyBB

Put the style of a window in html-top (Admin > Options: 1st form)

Type 1:

Code:

<style type="text/css">
#wrapper {width: 600px;}
/* additional smilies inserts */
ul.tabs {height: 25px;line-height: 25px;margin: 0 0 3px;list-style: none;}
ul.tabs li {float: left;margin-right: 1px; cursor:pointer;}
ul.tabs li a {display: block;padding: 0 13px 1px;margin-bottom: -1px;color: #444;text-decoration: none;cursor: pointer;background: #F9F9F9;border: 1px solid #EFEFEF;border-bottom: 1px solid #F9F9F9;position: relative;}
* html ul.tabs li a {float: left}
*+html ul.tabs li a {float: left}
ul.tabs li a:hover {color: #F70;padding: 0 13px;background: #FFFFDF;border: 1px solid #FFCA95;}
ul.tabs li.tab-current a {color: #444;background: #EFEFEF;padding: 0px 13px 2px;border: 1px solid #DDD;border-bottom: 1px solid #EFEFEF;}
div.t2,div.t3 {display: none;width: 450px;}
</style>

Type 2:

Code:

<style type="text/css">
#wrapper {width: 600px;}
/*  additional smilies inserts */
ul.tabs {height: 25px;line-height: 20px;margin: 0 0 3px;list-style: none;}
ul.tabs li {float: left;margin-right: 1px; cursor:pointer;}
ul.tabs li a {background: url("http://flowplayer.org/img/global/tabs.png") no-repeat scroll -652px 0 transparent;color: #444444;cursor: pointer;display: block;margin-bottom: -1px;padding: 0 14px 1px;position: relative;text-decoration: none;width: 84px;}
ul.tabs li a:hover {color:#EFEFEF;padding: 0 14px;background: url("http://flowplayer.org/img/global/tabs.png")no-repeat scroll;background-position: -652px -31px; text-decoration:none;}
ul.tabs li.tab-current a {color: #444;padding: 0px 14px 2px;border:medium hidden;line-height: 22px;background-position: -652px -62px;}
ul.tabs li.tab-current a:hover {color: #6A5ACD;}
div.t2,div.t3 {display: none;width: 450px;}
</style>

Put this script in html-bottom (Admin > Options: 2nd form):

Code:

<script type="text/javascript">
var nabor2 = ['http://savepic.net/428106.gif',  
'http://savepic.net/426058.gif',
'http://savepic.net/433226.gif',
'http://savepic.net/419914.gif',
'http://savepic.net/420938.gif',
'http://savepic.net/424010.gif',
'http://savepic.net/422986.gif',
'http://savepic.net/416842.gif',
'http://savepic.net/402506.gif',
'http://savepic.net/396362.gif',
'http://savepic.net/453709.gif',
'http://savepic.net/451661.gif',
'http://savepic.net/454733.gif',
'http://savepic.net/455757.gif',
'http://savepic.net/445517.gif',
'http://savepic.net/448589.gif',
'http://savepic.net/446541.gif',
'http://savepic.net/437325.gif',
'http://savepic.net/440397.gif',
'http://savepic.net/428109.gif',
'http://savepic.net/426061.gif',
'http://savepic.net/432205.gif',
'http://savepic.net/430157.gif',
'http://savepic.net/419917.gif',
'http://savepic.net/427084.gif',
'http://savepic.net/432204.gif',
'http://savepic.net/430156.gif',
'http://savepic.net/431180.gif',
'http://savepic.net/420940.gif',
'http://savepic.net/417868.gif',
'http://savepic.net/424012.gif',
'http://savepic.net/425036.gif',
'http://savepic.net/421964.gif',
'http://savepic.net/412748.gif',
'http://savepic.net/409676.gif',
'http://savepic.net/410700.gif',
'http://savepic.net/416844.gif',
'http://savepic.net/414796.gif',
'http://savepic.net/404556.gif',
'http://savepic.net/402508.gif',
'http://savepic.net/407628.gif',
'http://savepic.net/408652.gif',
'http://savepic.net/406604.gif',
'http://savepic.net/393292.gif',
'http://savepic.net/399436.gif',
'http://savepic.net/397388.gif'];

var nabor3 = ['http://yapro.ru/javascript/jquery.lebnik.Comments/smiles/1.gif',
'http://yapro.ru/javascript/jquery.lebnik.Comments/smiles/2.gif',
'http://yapro.ru/javascript/jquery.lebnik.Comments/smiles/3.gif',
'http://yapro.ru/javascript/jquery.lebnik.Comments/smiles/4.gif',
'http://yapro.ru/javascript/jquery.lebnik.Comments/smiles/5.gif',
'http://yapro.ru/javascript/jquery.lebnik.Comments/smiles/6.gif',
'http://yapro.ru/javascript/jquery.lebnik.Comments/smiles/7.gif',
'http://yapro.ru/javascript/jquery.lebnik.Comments/smiles/8.gif',
'http://yapro.ru/javascript/jquery.lebnik.Comments/smiles/9.gif',
'http://yapro.ru/javascript/jquery.lebnik.Comments/smiles/10.gif',
'http://yapro.ru/javascript/jquery.lebnik.Comments/smiles/11.gif',
'http://yapro.ru/javascript/jquery.lebnik.Comments/smiles/12.gif',
'http://yapro.ru/javascript/jquery.lebnik.Comments/smiles/13.gif',
'http://yapro.ru/javascript/jquery.lebnik.Comments/smiles/14.gif',
'http://yapro.ru/javascript/jquery.lebnik.Comments/smiles/15.gif',
'http://yapro.ru/javascript/jquery.lebnik.Comments/smiles/16.gif',
'http://yapro.ru/javascript/jquery.lebnik.Comments/smiles/17.gif',
'http://yapro.ru/javascript/jquery.lebnik.Comments/smiles/18.gif',
'http://yapro.ru/javascript/jquery.lebnik.Comments/smiles/19.gif',
'http://yapro.ru/javascript/jquery.lebnik.Comments/smiles/20.gif',
'http://yapro.ru/javascript/jquery.lebnik.Comments/smiles/21.gif',
'http://yapro.ru/javascript/jquery.lebnik.Comments/smiles/22.gif',
'http://yapro.ru/javascript/jquery.lebnik.Comments/smiles/23.gif',
'http://yapro.ru/javascript/jquery.lebnik.Comments/smiles/24.gif',
'http://yapro.ru/javascript/jquery.lebnik.Comments/smiles/25.gif',
'http://yapro.ru/javascript/jquery.lebnik.Comments/smiles/26.gif',
'http://yapro.ru/javascript/jquery.lebnik.Comments/smiles/27.gif',
'http://yapro.ru/javascript/jquery.lebnik.Comments/smiles/28.gif',
'http://yapro.ru/javascript/jquery.lebnik.Comments/smiles/29.gif',
'http://yapro.ru/javascript/jquery.lebnik.Comments/smiles/30.gif',
'http://yapro.ru/javascript/jquery.lebnik.Comments/smiles/31.gif',
'http://yapro.ru/javascript/jquery.lebnik.Comments/smiles/32.gif',
'http://yapro.ru/javascript/jquery.lebnik.Comments/smiles/33.gif',
'http://yapro.ru/javascript/jquery.lebnik.Comments/smiles/34.gif',
'http://yapro.ru/javascript/jquery.lebnik.Comments/smiles/35.gif',
'http://yapro.ru/javascript/jquery.lebnik.Comments/smiles/36.gif',
'http://yapro.ru/javascript/jquery.lebnik.Comments/smiles/37.gif',
'http://yapro.ru/javascript/jquery.lebnik.Comments/smiles/38.gif',
'http://yapro.ru/javascript/jquery.lebnik.Comments/smiles/39.gif',
'http://yapro.ru/javascript/jquery.lebnik.Comments/smiles/41.gif',
'http://yapro.ru/javascript/jquery.lebnik.Comments/smiles/43.gif',
'http://yapro.ru/javascript/jquery.lebnik.Comments/smiles/46.gif',
'http://yapro.ru/javascript/jquery.lebnik.Comments/smiles/49.gif',
'http://yapro.ru/javascript/jquery.lebnik.Comments/smiles/50.gif',
'http://yapro.ru/javascript/jquery.lebnik.Comments/smiles/bandit.gif',
'http://yapro.ru/javascript/jquery.lebnik.Comments/smiles/bug.gif',
'http://yapro.ru/javascript/jquery.lebnik.Comments/smiles/fubar.gif',
'http://yapro.ru/javascript/jquery.lebnik.Comments/smiles/rock.gif',
'http://yapro.ru/javascript/jquery.lebnik.Comments/smiles/smoke.gif',
'http://yapro.ru/javascript/jquery.lebnik.Comments/smiles/swear.gif'];
$(document).ready(function() {
$('#smilies-block').addClass('t1');
$('#smilies-area').prepend('<div id="wrapper"><ul class="tabs tabs1" onclick="return changeVisibility (\'smilies-area\', false)"><li class="t1 tab-current"><a>First type</a></li><li class="t2"><a>Second type</a></li><li class="t3"><a>Third type</a></li></ul><div class="t2"></div><div class="t3"><br></div></div>');
$.each(nabor2, function(i) {
$('div.t2').append('<img src="'+nabor2[i]+'" onclick=smile(\'[url]'+nabor2[i]+'[/url]\') />');
});
$.each(nabor3, function(i) {
$('div.t3').append('<img src="'+nabor3[i]+'" onclick=smile(\'[url]'+nabor3[i]+'[/url]\') />');
});
$('ul.tabs.tabs1 li').click(function(){
var thisClass = this.className.slice(0,2);
$('div.t1, div.t2, div.t3').hide();
$('div.' + thisClass).fadeToggle('slow');
$('ul.tabs.tabs1 li').removeClass('tab-current');
$(this).addClass('tab-current');
}); });
</script>

Change the smilies links for your own ones.

Additional set of smilies in the window of standard ones
Deff�s script modification
Author: Deff
Software: MyBB
Advantages:
1. No downloading without smilies icon click
2. Simpler adding of new smilies

In html-bottom (Admin > Options: 2nd form):

<style type="text/css">
/* additional smilies inserts */
#wrapper {width: 600px;}
ul.tabs {height: 25px;line-height: 20px;margin: 0 0 3px;list-style: none;}
ul.tabs li {float: left;margin-right: 1px; cursor:pointer;}
ul.tabs li a {background: url("http://uploads.ru/i/P/5/Q/P5Q2V.png") no-repeat scroll -652px 0 transparent;color: #444444;cursor: pointer;display: block;margin-bottom: -1px;padding: 0 14px 1px;position: relative;text-decoration: none;width: 84px;}
ul.tabs li a:hover {color:#EFEFEF;padding: 0 14px;background: url("http://uploads.ru/i/P/5/Q/P5Q2V.png")no-repeat scroll;background-position: -652px -31px; text-decoration:none;}
ul.tabs li.tab-current a {color: #444;padding: 0px 14px 2px;border:medium hidden;line-height: 22px;background-position: -652px -62px;}
ul.tabs li.tab-current a:hover {color: #6A5ACD;}
div.t2,div.t3 {display: none;width: 450px;}
</style>

<script language="javascript">
$(document).ready(function() {
if($('#smilies-block').length==0) return false;
$('#smilies-block').addClass('t1');
function abc(){/*==123==;
<div id="wrapper">
<ul class="tabs tabs1"><li class="t1 tab-current"><a>First type</a></li><li class="t2"><a>Second type</a></li><li class="t3"><a>Third type</a></li></ul>
<div class="t2"><p></p></div><div class="t3"><p><br></p></div>
</div> ==123==;*/} abc = abc.toString().split('==123==;')[1];
$(abc).prependTo('#smilies-area');
function abc1(){

//Second smilies set;
/*==123==;
http://i070.radikal.ru/1005/c7/0e77ae8a9874.gif
http://s59.radikal.ru/i166/1005/2f/5b1c0605032a.gif
http://i054.radikal.ru/1005/f6/13dcca4f279d.gif
http://s56.radikal.ru/i151/1005/a3/85c037c68925.gif
==123==;*/} abc1 = abc1.toString().split('==123==;')[1];
var bb = "\'["+'img'+"]\'+this.src+\'["+'/img'+"]\'";
var tgEnd = '" onclick="smile('+bb+')" />';
function abc2(){

//Third smilies set;
/*==123==;
http://yapro.ru/javascript/jquery.lebnik.Comments/smiles/01.gif
http://yapro.ru/javascript/jquery.lebnik.Comments/smiles/02.gif
http://yapro.ru/javascript/jquery.lebnik.Comments/smiles/03.gif
http://yapro.ru/javascript/jquery.lebnik.Comments/smiles/04.gif
http://yapro.ru/javascript/jquery.lebnik.Comments/smiles/05.gif
==123==;*/} abc2 = abc2.toString().split('==123==;')[1];
$('#button-smile').one('click',function(){
abc1=abc1.replace(/^(http:.*?)$/gim,'<img src="$1'+tgEnd);
abc2=abc2.replace(/^(http:.*?)$/gim,'<img src="$1'+tgEnd);
$(abc1).prependTo('#smilies-area div.t2');
$(abc2).prependTo('#smilies-area div.t3');
});
$('ul.tabs.tabs1 li').click(function(){
var thisClass = this.className.slice(0,2);
$('div.t1, div.t2, div.t3').hide();
$('div.' + thisClass).fadeToggle('slow');
$('ul.tabs.tabs1 li').removeClass('tab-current');
$(this).addClass('tab-current');
return false;
}); });
</script>

JampPanel - navigator [Deff]

mybb@mybb.ru (Gerda) — Tue, 12 Jun 2018 19:16:55 +0300

JampPanel - navigator
Author: Deff

DEMO

<style>
#JampPanel:hover{
margin-right:-20px;
}
#JampPanel,#JampPanel .container{
border-radius:10px;
-webkit-border-radius:10px;
-khtml-border-radius:10px;
-moz-border-radius:10px;
-o-border-radius:10px;
border:1px solid #FE2323;
background-color:#F0F0F0;
box-shadow: 0px 5px 5px #626262;
-webkit-box-shadow:0px 5px 5px #626262;
-khtml-box-shadow:0px 5px 5px #626262;
-moz-box-shadow:0px 5px 5px #626262;
}
#JampPanel {opacity:0.86;
position:fixed;z-index:1200;
height:190px;top:8px;right:0;margin-right:-202px;
background:#F0F0F0 url(http://uploads.ru/i/S/z/t/Sztn3.png) 4px 2px no-repeat;
width:230px;
}
#JampPanel .container{
padding:12px;
height:400px;
width:100%;margin:-1px 0 0 30px;
}
#Zaslonyalka{
position:absolute;
height:190px;width:14px;
background-color:#F0F0F0;
margin:-12px 0 0 -18px;
}
</style>
<div id=JampPanel>
<div class=container>
<div id=Zaslonyalka></div>
Your content
</div>
</div>

Blue - background color, red - Your content (and a link to the background image of the clickable panel).

With a smooth effect.

DEMO

<style>
#JampPanel:hover{
margin-right:-20px;
}
#JampPanel,#JampPanel .container{
border-radius:10px;
-webkit-border-radius:10px;
-khtml-border-radius:10px;
-moz-border-radius:10px;
-o-border-radius:10px;
border:1px solid #FE2323;
background-color:#F0F0F0;
box-shadow: 0px 5px 5px #626262;
-webkit-box-shadow:0px 5px 5px #626262;
-khtml-box-shadow:0px 5px 5px #626262;
-moz-box-shadow:0px 5px 5px #626262;
}
#JampPanel {opacity:0.86;
position:fixed;z-index:1200;
height:190px;top:8px;right:0;margin-right:-202px;
background:#F0F0F0 url(http://uploads.ru/i/S/z/t/Sztn3.png) 4px 2px no-repeat;
transition-duration: 0.33s;
-webkit-transition-duration: 0.33s;
-moz-transition-duration: 0.33s;
-o-transition-duration: 0.33s;
width:230px;
}
#JampPanel .container{
padding:12px;
height:400px;
width:100%;margin:-1px 0 0 30px;
}
#Zaslonyalka{
position:absolute;
height:190px;width:14px;
background-color:#F0F0F0;
margin:-12px 0 0 -18px;
}
</style>
<div id=JampPanel>
<div class=container>
<div id=Zaslonyalka></div>
Your content
</div>
</div>

Replacing smiles in a standard window (MyBB) [Duka]

mybb@mybb.ru (Gerda) — Tue, 12 Jun 2018 19:11:18 +0300

New smiley script. Duka
The script replaces the smileys in the block of standard emoticons.

Author: Duka
Platform: MyBB

Code:

<script type="text/javascript">
var smileDiv = document.getElementById("smilies-block");
if(smileDiv)
{
var smileItem = new Array();
smileItem.push('http://s41.radikal.ru/i092/0810/20/1acb9975a250.gif');
smileItem.push('http://s41.radikal.ru/i092/0810/20/1acb9975a250.gif');

for (i=0; i<smileItem.length; i++){
smileDiv.innerHTML+='<img src="'+smileItem[i]+'" alt=":rusff:" onclick="smile(\'[img]'+smileItem[i]+'[/img]\')" />';
}
}
</script>

The script put in HTML of Form of reply

smileItem.push('http://s41.radikal.ru/i092/0810/20/1acb9975a250.gif');
Duplicate as many as you need to add emoticons.
Your emoticons will be added to the block of common emoticons.

How to remove all standard emoticons and add your own?
Find in script

var smileDiv = document.getElementById("smilies-block");

and then add

smileDiv.innerHTML="";

Smile-BOX without loading content when it's closed (MyBB) [Deff]

mybb@mybb.ru (Gerda) — Tue, 12 Jun 2018 19:02:14 +0300

Smile-BOX without loading content when it's closed
Adds tabs with your smilies that are not loaded in the hidden state.

DEMO

Author: Deff
Platform: MyBB

1.
To the begining HTML �� (Admin > Options: 1st form) :
<script> //SCRIPT OF LOADING Smilies Prt1//
//Here in quotes Link to the uploaded content file//
var Link='Here is your link to the uploaded file';
function getXmlHttp(){var xmlhttp;try{xmlhttp=new ActiveXObject("Msxml2.XMLHTTP")}catch(e){try{xmlhttp=new ActiveXObject("Microsoft.XMLHTTP")}catch(E){xmlhttp=false}}if(!xmlhttp&&typeof XMLHttpRequest!='undefined'){xmlhttp=new XMLHttpRequest()}return xmlhttp}
var SmileHTml='';function tstSmileLoad_2(){if(SmileHTml!=''&&!($("#Smile_smil_box").length)){
var Lft='</';$("#html-footer").prepend('<script>document.write(SmileHTml)'+Lft+'script>')}};
var xmlhttp=getXmlHttp();
function SmileLoad_0(){
xmlhttp.open('GET',Link,true);xmlhttp.onreadystatechange=function(){if(xmlhttp.readyState==4){if(xmlhttp.status==200){SmileHTml='<div id="Smile_smil_box"></div>'+xmlhttp.responseText;if($("#html-footer").length){$("#html-footer").prepend(SmileHTml)}}}};xmlhttp.send(null);}
if($("#pun-messages").length||$("#pun-viewtopic").length||$("#pun-post").length||$("#pun-edit").length||$("#pun-poll").length){SmileLoad_0()}
</script>

2.
To the begining HTML �� (Admin > Options: 2nd form) :
Code:

<script>tstSmileLoad_2()</script>

3.
http://hostjs-mybb2011.narod.ru/zip/27358.zip
Mirror: http://sendfile.su/558933
We save this file to the desktop, unpack it and re-load it into the Admin > Files.
The link (click on the file name in the admin panel) is read in the address bar of the browser and paste instead of red text in the part of the script, that going to HTML top.

EXPLANATIONS
or how to add smilies

a) You save the reloaded file from the admin area to the desktop (click on the file name in the Admin panel, on the opened tab press in the browser: File - save as - on the Desktop.)

Open it in Notepad (another editor changes the output file format) and delete - replace the desired smiley block with your block (or add a new one).
Links to emoticons are written through a comma (the insertion is reduced to the insertion of a block of links separated by a comma without a space)

Block type of your content when editing smiles:

<div id="Mybb" class="smile_Cnt" style="display: block" alt="0">
</div>

<textarea id="load_cont" style="display:none">
<div id="AddMybb" class="smile_Cnt">
<i class="additive">http://uploads.ru/i</i>
/4/P/k/4Pkja.gif,/a/Z/R/aZRew.gif,/A/O/i/AOiCY.gif,/y/W/D/yWD7S.gif,/U/I/E/UIEOJ.gif,/6/I/8/6I8fa.gif,/2/U/s/2Used.gif,/9/6/s/96sBN.gif,/T/u/h/Tuh6l.gif
</div>

<div class="smile_Cnt">
<i class="additive">http://uploads.ru/i</i>
/W/J/x/WJx8h.gif,/V/b/0/Vb0QS.gif,/i/0/4/i04vB.gif,/N/Z/4/NZ4oA.gif,/P/j/R/PjRGA.gif,/5/l/a/5lavD.gif,/k/J/r/kJrho.gif,/t/z/i/tziVx.gif,/p/9/j/p9jcQ.gif,/U/s/Y/UsYWe.gif,/j/G/W/jGWAD.gif,/D/E/Z/DEZF4.gif,/x/o/0/xo0Ff.gif,/O/W/P/OWPtF.gif,/k/x/D/kxDJl.gif,/u/D/F/uDFz3.gif,/O/f/X/OfXMh.gif,/G/t/d/Gtdvo.gif,/7/H/i/7HiWp.gif,/r/n/h/rnhWk.gif,/1/C/p/1Cpd2.gif,/Z/p/t/ZptIR.gif,/P/3/M/P3Mn7.gif,/d/Z/N/dZNV8.gif,/f/5/4/f54jz.gif,/p/g/f/pgfh9.gif,/p/r/l/prlF5.gif,/O/B/A/OBAPq.gif,/r/j/D/rjDHM.gif,/7/5/i/75ix4.gif,/P/W/y/PWyhF.gif,/a/w/g/awgMp.gif,/d/B/8/dB8D4.gif,/F/P/8/FP8Og.gif,/2/h/q/2hq6z.gif,/J/g/p/JgpNs.gif,/t/Q/C/tQCZU.gif,/n/i/d/nidlM.gif,/C/e/M/CeMBc.gif,/F/2/d/F2d6D.gif,/g/v/F/gvFkH.gif,/w/u/T/wuTR2.gif,/Q/A/X/QAXWI.gif,/Q/3/B/Q3BO2.gif,/U/V/X/UVX2Y.gif,/g/F/3/gF3jv.gif,/s/B/0/sB0Ji.gif,/x/B/J/xBJru.gif,/j/2/H/j2Hie.gif,/j/d/T/jdTCm.gif,/L/8/7/L87Iz.gif,/d/c/p/dcpXU.gif,/z/H/K/zHKmv.gif,/J/t/A/JtAKx.gif
</div>

<div class="smile_Cnt">
<i class="additive">http://uploads.ru/i</i>
/R/S/U/RSUkn.gif,/S/W/x/SWxQr.gif,/M/J/F/MJF0q.gif,/K/x/N/KxNIp.gif,/4/l/g/4lgIf.gif,/j/Y/8/jY8pW.gif,/I/m/a/Ima2K.gif,/e/k/i/ekis1.gif,/m/O/r/mOr3Q.gif,/3/a/e/3aeQi.gif,/J/G/N/JGNrC.gif,/D/w/S/DwS2q.gif,/t/z/X/tzX8q.gif,/N/A/C/NACqe.gif,/9/T/m/9TmOi.gif,/N/d/U/NdUSK.gif,/r/6/5/r65lO.gif,/V/Z/i/VZids.gif,/8/S/p/8SpWU.gif,/q/C/8/qC837.gif,/g/s/Z/gsZ2t.gif,/o/3/a/o3aIY.gif,/Z/D/H/ZDHz4.gif,/C/3/K/C3KxT.gif
</div>

<div class="smile_Cnt">
<i class="additive">http://uploads.ru/i</i>
/b/G/g/bGgZA.gif,/z/H/x/zHxGp.gif,/C/E/c/CEcF2.gif,/v/7/9/v79tH.gif,/6/N/q/6Nqoa.gif,/9/y/t/9ytql.gif,/J/l/r/JlrIP.gif,/y/h/V/yhVRE.gif,/k/B/Z/kBZEp.gif,/u/F/X/uFXMW.gif,/3/T/g/3TgDi.gif,/6/q/9/6q9YQ.gif,/W/A/8/WA8e0.gif,/f/t/4/ft4SM.gif,/g/i/H/giHdk.gif,/c/p/E/cpEju.gif,/o/U/e/oUeMD.gif,/i/c/g/icgLa.gif,/q/l/M/qlM9b.gif,/v/x/S/vxSjO.gif,/J/F/G/JFGnr.gif,/9/i/A/9iAHB.gif,/f/j/V/fjVbN.gif,/Q/s/c/QschM.gif,/Q/D/x/QDx28.gif,/m/H/T/mHTZO.gif,/5/b/P/5bPG0.gif,/n/6/8/n68c0.gif,/w/8/u/w8uoS.gif,/k/1/M/k1Mtc.gif,/F/5/o/F5oD0.gif,/8/e/U/8eUdo.gif,/x/B/u/xBul6.gif,/z/J/G/zJGdS.gif
</div>

<div class="smile_Cnt">
<i class="additive">http://uploads.ru/i</i>
/d/5/A/d5At2.gif,/1/j/T/1jTql.gif,/p/m/A/pmAIf.gif,/U/6/f/U6fhF.gif,/G/Y/p/GYpWm.gif,/N/s/5/Ns5TU.gif,/i/c/T/icTNW.gif,/f/P/u/fPu3r.gif,/H/s/R/HsRNk.gif,/4/D/u/4Du6Q.gif,/e/p/h/ephrl.gif,/l/7/v/l7v6G.gif,/N/v/b/NvbLZ.gif,/A/2/L/A2LJH.gif,/v/t/O/vtOG9.gif,/w/c/J/wcJk8.gif,/s/o/O/soOYD.gif,/5/Y/g/5YgBI.gif,/4/2/D/42DZA.gif,/A/o/n/Aonze.gif,/d/v/p/dvp3D.gif,/5/Y/z/5YzM4.gif,/n/B/O/nBOdm.gif,/R/k/t/Rktd2.gif,/5/V/7/5V7Xr.gif,/0/X/P/0XP2e.gif,/A/v/6/Av6eS.gif,/D/E/3/DE38y.gif,/F/n/a/FnaYs.gif,/Q/l/k/QlkMZ.gif,/N/w/P/NwPbf.gif,/L/t/Y/LtY12.gif,
</div>

Adding a new block

To add a new block, just insert a new block:

<div class="smile_Cnt">
</div>

In any place indicated in the screenshot below (the block number depends on the place of your insertion)

Inside it, and insert links that go through a comma (the last link in the block without a comma!)

Green - block adding their additional smiles to the first block of smiles from the service.
You can either delete or modify the block, using the same rules as for the other blocks.
--------------------------

If all links have a common part, it is advantageous to separate it, reducing all links (by deleting this common, detachable part from all the links in this block),
the detachable part is inserted at the beginning of the block before all the references in the tags:
<i class="additive">http://uploads.ru/i</i>
Black-bold - the general beginning of this link unit.
The remaining links followed by a comma are followed without a space (the last link in the block without a comma!)

b) Uploading images for smiles by clicking on the button allows you to reduce the amount of content uploading by half (because the general part is easily allocated)

Before a new upload of the modified file in the Admin panel, you need to replace in the name one any number (so that it is activated without clearing the cache (otherwise, despite changing the file, until the cache is obsolete, the old version of the smilebox will be shown)

Smilies in the pop-up window (Mybb)

mybb@mybb.ru (Gerda) — Tue, 12 Jun 2018 18:41:32 +0300

Smilies in the pop-up window
Adds a pop-up window with your emoticons to the response form.

��: MyBB

Code:

<style>
#button-smiles {background-image:url('http://extra smiley button'); padding:0; line-height:0; background-position:center; background-repeat:no-repeat; height:26px; width:100%}
</style>

<script language="JavaScript">
function popwnd()
{
var smiles = new Array

smiles.push("link to picture of the smile")
smiles.push("link to picture of the smile")
smiles.push("link to picture of the smile")
smiles.push("link to picture of the smile")
smiles.push("link to picture of the smile")
smiles.push("link to picture of the smile")
smiles.push("link to picture of the smile")
smiles.push("link to picture of the smile")
smiles.push("link to picture of the smile")

var msg = new String("")
msg = "<html><head><TITLE><additional emoticons></TITLE></head>\r\n"
msg += "<body bgcolor=#F5F5F5 >"
msg = msg + "<" + "script language=\"JavaScript\">\r\n"

msg += "function insert(a){\r\n"
msg += "txt = \"[img]\"+a.src+\"[/img] \";\r\n"
msg += "window.opener.smile(txt,'');\r\n"
msg += "window.focus()\r\n"
msg += "return false}\r\n"

msg = msg + "</" + "script>\r\n"

i=0

msg += "<div style=\"width: 100%; text-align : justify;\" >"
while(smiles[i])
{
msg = msg + "<img src=\"" + smiles[i] + "\" onclick=\"return insert(this)\">\r\n"
i++
}

msg += "</div><a href=\"\" onclick=\"window.close()\">Close a window</a>"
msg += "</BODY></html>";

popup = window.open("","popDialog","height=700,width=500,directories=0 scrollbars=auto, status=0,location=0,copyhistory=0")
popup.document.write(msg)
popup.document.close()

return false
}
</script>
<script type="text/javascript">
if(form=document.getElementById("form-buttons"))
form.getElementsByTagName("tr")[0].insertCell(17).innerHTML="<a href='' onclick=\"return popwnd()\"> <img title='Additional emoticons' src='/i/blank.gif' id='button-smiles' /></a>"
</script>

<script>
function showhide(b){
p = b.parentNode.getElementsByTagName("p")[0]
if(b.value=="Additional emoticons"){
b.value="Hide smileys"
p.style.display="block"}
else{
b.value="Additional emoticons"
p.style.display="none"}
return false}
</script>

Instead of the text, we insert a link to the smile and copy as many smileys you needed:

smiles.push("link to picture of the smile")

The style of the additional smileys button in the submit form:

#button-smiles {background-image:url('extra smiley button'); padding:0; line-height:0; background-position:center; background-repeat:no-repeat; height:26px; width:100%}

Smilies with comments (MyBB) [rps]

mybb@mybb.ru (Gerda) — Tue, 12 Jun 2018 18:35:18 +0300

Smilies with comments
New smilies in the form of a response with the possibility of adding to them text in the form of thoughts / phrases of emoticons.

Author: rps
Platform: MyBB

Funny thing, the beginning of which comes from the topic "Adapt the phpBB code for our forums" on the support forum. This idea was first implemented on phpbb forums, rps adapted it for our platform.
The essence of the script is that it allows you to leave thoughts in the form of text and the most suitable smile to it. Perhaps this way it will be convenient to flood...

HTML-�� (Admin > Options: 1st form)

Code:

<script type="text/javascript">
FORUM.set('editor.think', { name : 'Add thoughts', onclick : function() {make_code(); } } );
</script>
<style type="text/css">
td#button-think {
 background: url(http://st1.bbcorp.ru/i/information.png) no-repeat center !important;
 }

#think-area {
  position: absolute;
  z-index: 1000;
  top: 43px;
  right: 15px;
  padding: 1.5em;
  width: 500px;
}

#div_smiles p {
  padding-bottom: 0 !important;
}

#div_smiles span {
  display: inline;
}

.think_table {
  width: auto !important;
  table-layout: auto !important;
}

td.think_td {
  margin: 0; 
  padding: 0.2em !important;
  border-style: none !important;
}

.think_content {
  background-color: #eeee6f; 
  color: #000; 
  border-radius: 16px; 
  -webkit-border-radius: 16px; 
  -khtml-border-radius: 16px; 
  -moz-border-radius: 16px; 
  -o-border-radius: 16px; 
  border: 1px solid #fff; 
  padding: 3px 5px !important; 
  font-size: 1em;
}

#textarea, #input {
  width: 100%;
}

#close_button {
  margin-left: 15px;
}

.standart_smile {
  padding: 2px;
  cursor: pointer;
}

#hidden_link {
  text-decoration: none;
  border-bottom: 1px dotted;
}

.thought {
  padding-right: 7px;
  background: transparent url(http://s1.uploads.ru/i/D6VpZ.png) no-repeat top right;
  display: inline-block;
}
</style>

HTML-�� (Admin > Options: 2nd form)

Code:

<script type="text/javascript">
var div; var i = 0; var t; var inp; var ta; var max = 10; var def_text = "Thought was lost..."; var def_smile = "http://s1.uploads.ru/i/t2jJV.gif";

var pic = new Array();
pic.push("http://www.kolobok.us/smiles/standart/acute.gif");
pic.push("http://www.kolobok.us/smiles/standart/ireful3.gif");
pic.push("http://www.kolobok.us/smiles/standart/blum2.gif");
pic.push("http://www.kolobok.us/smiles/standart/black_eye.gif");
pic.push("http://www.kolobok.us/smiles/standart/bad.gif");
pic.push("http://www.kolobok.us/smiles/standart/secret.gif");
pic.push("http://www.kolobok.us/smiles/standart/yahoo.gif");
pic.push("http://www.kolobok.us/smiles/standart/whistle2.gif");
pic.push("http://www.kolobok.us/smiles/standart/facepalm.gif");
pic.push("http://www.kolobok.us/smiles/standart/this.gif");
pic.push("http://www.kolobok.us/smiles/standart/agree.gif");
pic.push("http://www.kolobok.us/smiles/standart/black_eye.gif");
pic.push("http://www.kolobok.us/smiles/standart/grin.gif");
pic.push("http://www.kolobok.us/smiles/standart/help.gif");
pic.push("http://www.kolobok.us/smiles/standart/polling.gif");
pic.push("http://www.kolobok.us/smiles/standart/smoke.gif");
pic.push("http://www.kolobok.us/smiles/standart/sorry2.gif");
pic.push("http://www.kolobok.us/smiles/standart/umnik.gif");
pic.push("http://www.kolobok.us/smiles/standart/yu.gif");
pic.push("http://www.kolobok.us/smiles/standart/drinks.gif");


function make_div() {
 var fs; var z = 0; var new_div;
 fs = document.getElementsByTagName("div");
 for (z in fs) {
  if (fs[z].className == "fs-box hashelp") {
   new_div = document.createElement("div");
   new_div.id = "think-area";
   new_div.className = "container";
   new_div.style.display = "none";
   fs[z].appendChild(new_div);
  }
 }
}

function make_think(x) {
 var reg; var think; var j = 0; res = x.innerHTML; var smile; var text;
 reg = new RegExp("\\[think=([^\\]]+)\\]([^\\[\\]]+)\\[/think\\]", "g");
 if (reg.test(res)) {
  think = res.match(reg);
  for (j in think) {
   smile = think[j].substring(think[j].indexOf('[think=') + 7, think[j].indexOf(']'));
   text = think[j].substring(think[j].indexOf(']') + 1, think[j].indexOf('[/think]'));
   res = res.replace('[think=' + smile + ']' + text + '[/think]', '<table class="think_table" cellpadding="0" cellspacing="0"><tr><td class="think_td"><div class="think_content">' + text + '</div><span class="thought"><img src="' + smile + '" alt="" /></span></td></tr></table>');
  }
 }
 return res;
}

function make_bb_code() {
 t = document.getElementById("textarea").value;
 if (t == "") t = def_text;
 inp = document.getElementById("input").value;
 if (inp.indexOf("http://") == -1) inp = def_smile;
 bbcode('[think=' + inp + ']' + t + '','[/think]');
 changeVisibility('think-area');
}

function make_code() {
 var h = 0;
 changeVisibility('think-area');
 ta = document.getElementById("think-area");
 ta.innerHTML = "<textarea id='textarea' rows='5'>Enter your thoughts</textarea>";
 ta.innerHTML += "<div id='div_smiles'><p id='conteiner_smiles'><span id='visible_smiles'></span><span id='hidden_smiles' style='display: none;'></span></p><a id='hidden_link' style='cursor: pointer;' title='Show or hide emotions' onclick='document.getElementById(\"hidden_smiles\").style.display = (document.getElementById(\"hidden_smiles\").style.display == \"none\" ? \"inline\" : \"none\");'>������ ������</a></div><br />";
 ta.innerHTML += "<input type='text' id='input' value='Paste the link to the smile' /><br /><br />";
 for (h in pic) {
  if (h < max) document.getElementById("visible_smiles").innerHTML += "<img class='standart_smile' src='" + pic[h] + "' alt='Emotions' title='Click to add' onclick='document.getElementById(\"input\").value = this.src;' />";
  else document.getElementById("hidden_smiles").innerHTML += "<img class='standart_smile' src='" + pic[h] + "' alt='Emotions' title='Click to add' onclick='document.getElementById(\"input\").value = this.src;' />";
 }
 ta.innerHTML += "<input type='button' class='button' value='��������' id='bb_buton' onclick='make_bb_code();' />";
 ta.innerHTML += "<input type='button' class='button' value='�������' id='close_button' onclick='changeVisibility(\"think-area\");' />";
}

make_div();
div = document.getElementById("pun-main").getElementsByTagName("div");
for (i in div) {
 if (div[i].className == "post-content") div[i].innerHTML = make_think(div[i]);
}
</script>

Now a little about the settings.
In HTML-top there is a script for creating a new button in the form of an answer and the style of all the elements. If necessary, you can change the icon to your own:

Code:

td#button-think {
 background: url(http://st1.bbcorp.ru/i/information.png) no-repeat center !important;
 }

In the HTML-bottom, the following parameters are available for modification:

Code:

var max = 10;

Sets the number of smileys displayed by default on the form. The rest will be hidden and accessible by clicking on the link "More emotions".

Code:

var def_text = "Thought was lost...";

Sets the standard phrase of the thought, if the user did not specify anything.

Code:

var def_smile = "http://s1.uploads.ru/i/t2jJV.gif";

Sets the standard smile emotion if the user did not specify it.

Code:

var pic = new Array();

A set of smiles-emotions (in the standard set there are 20 smiles). You can add your own or delete unnecessary ones.

Multiple columns for content

mybb@mybb.ru (Gerda) — Tue, 12 Jun 2018 18:19:26 +0300

Shell Lee wrote:

How to make the links (or plain text) in the table with tabs located in several bars? (I personally need 3)

this can be done using a table
but it's better to do this with divs, so it's less HTML code that distracts from the content.

insert the following into the container:

Code:

<div id="my_col">
Here is the text of the column
</div>

we paste as many times as necessary columns.
insert the cccode for the column:

<style>
#my_col {
float: left;
width: 150px;
}
</style>

red is the width of the column

Navigation

mybb@mybb.ru (Gerda) — Tue, 12 Jun 2018 18:08:37 +0300

Hover-effects:
Hover-effect for text/links. Ilin
Hover-effect for text/links. Kukuri
Hover-effect for text/links. Manko
Hover-effect for text/links. nukun

CSS tricks:
Multiple columns for content

Galleries, menus, information blocks
JampPanel - navigator [Deff]

Requests for lessons

mybb@mybb.ru (Gerda) — Fri, 08 Jun 2018 18:02:31 +0300

Your requests for replenishment of the section :flag:

Navigation

mybb@mybb.ru (Gerda) — Fri, 08 Jun 2018 18:00:53 +0300

under construction