Всё для cs и системы ucoz

Стильная форма добавления комментариев

Дата: Понедельник, 06.12.2010, 09:19 | Сообщение # 1

Генералиссимус

Сообщений: ( 1077 )

Подарки : ( 1 )

[ 778 ]

Страна: Российская Федерация

Данный вид комментариев сочетает в себя элегантный вид и технологию jQuery. Данный вид я разрабатывал специально для своего нового дизайна и теперь, думаю, пришло время поделиться и с остальными пользователями интернета

Установка:

В Форме добавления комментариев замените всё на:

Code

<table width="100%" border="0" cellpadding="0" cellspacing="0">
            <tbody><tr>
            <td width="17" background="http://extr1m3-pro.net.ru/border/1.png" height="17">
            </td>
            <td background="http://extr1m3-pro.net.ru/border/2.png" height="17">
            </td>
            <td width="17" background="http://extr1m3-pro.net.ru/border/3.png" height="17">
            </td>
            </tr>
            <tr>
            <td width="17" background="http://extr1m3-pro.net.ru/border/4.png">
            </td>
            <td>
<?if($USER_LOGGED_IN$)?>

<center>
<table width="100%" cellpadding="0" cellspacing="0">

<td>
<textarea onmouseover="$('#subs').slideUp('slow');" onmousemove="$('#mainbtns').animate({width:'show'},500);" class="commFl" class="commFl" style="height:200px;" rows="8" name="message" id="message" cols="50" onKeyPress="if (event.keyCode==10 || (event.ctrlKey && event.keyCode==13)) {addcom();}">$MESSAGE$</textarea>
</td>

<div style="display:none;position:absolute;right:120;z-index:10;" id="mainbtns">
<a onclick="$('#smile').slideToggle('slow');" href="javascript://" title="Показать смайлы"><span><img src="http://extr1m3-pro.net.ru/images/main/smile.png" border="0" width="50"></span></a><br>
<a onclick="$('#bbcode').slideToggle('slow');" href="javascript://" title="Показать BB коды"><span><img src="http://extr1m3-pro.net.ru/images/main/bbcode.png" border="0" width="50"></span></a><br>
<a onclick="precomment()" title="Предварительный просмотр комментария"><span><img src="http://extr1m3-pro.net.ru/images/main/prew.png" border="0" width="50"></span></a><br>
<a onClick="javascript:byn=void(window.open('http://hosting.ucoz.kz','byn','toolbar=1,width=800,height=600,top=300,left=300'))" title="Быстро прикрепить файл или картинку"><span><img src="http://extr1m3-pro.net.ru/images/main/atach.png" border="0" width="50"></span></a><br>
</div>

</table>

</center>

<?else?>
<center><b><br>Извините, но гости не могут оставлять комментарии<br>Войдите на сайт под своим именем или пройдите быструю регистрацию</b><br><br></center>
<?endif?>

</td>
            <td width="17" background="http://extr1m3-pro.net.ru/border/5.png">
            </td>
            </tr>
            <tr>
            <td width="17" background="http://extr1m3-pro.net.ru/border/6.png" height="17">
            </td>
            <td background="http://extr1m3-pro.net.ru/border/7.png" height="17">
            </td>
            <td width="17" background="http://extr1m3-pro.net.ru/border/8.png" height="17">
            </td>
            </tr>
            </tbody></table>

<table width="100%" border="0" cellpadding="0" cellspacing="0">
<td>
<div align="center" style="display:none;padding:2px;opacity:0.5" id="smile">
<script src="http://extr1m3-pro.net.ru/js/comments.js"></script>
</div>
<div align="center" style="display:none;padding:2px;opacity:0.5;" id="bbcode">
<script type='text/javascript' src='http://s15.ucoz.net/src/bbcodes.js'></script><span style="padding-right:1px;" id="bc1"><input type="button" title="Bold" value="b" onclick="simpletag('b','','','message','')" class="codeButtons" id="b" style="width:20px;font-weight:bold" /></span><span style="padding-right:1px;" id="bc2"><input type="button" title="Italic" value="i" onclick="simpletag('i','','','message','')" class="codeButtons" id="i" style="width:20px;font-style:italic" /></span><span style="padding-right:1px;" id="bc3"><input type="button" title="Underline" value="u" onclick="simpletag('u','','','message','')" class="codeButtons" id="u" style="width:20px;text-decoration:underline" /></span><span style="padding-right:1px;" id="bc4"><select id="fsize" class="codeButtons" onchange="alterfont(this.options[this.selectedIndex].value,'size','message','');this.selectedIndex=0;"><option value='0'>SIZE</option><option value='6'>6 pt</option><option value='7'>7 pt</option><option value='8'>8 pt</option><option value='9'>9 pt</option><option value='10'>10 pt</option><option value='11'>11 pt</option><option value='12'>12 pt</option><option value='13'>13 pt</option><option value='14'>14 pt</option><option value='15'>15 pt</option><option value='16'>16 pt</option><option value='17'>17 pt</option><option value='18'>18 pt</option><option value='19'>19 pt</option><option value='20'>20 pt</option><option value='21'>21 pt</option><option value='22'>22 pt</option></select></span><span style="padding-right:1px;" id="bc5"><select id="ffont" class="codeButtons" onchange="alterfont(this.options[this.selectedIndex].value,'font','message','');this.selectedIndex=0;"><option value='0'>FAMILY</option><option value='Arial'>Arial</option><option value='Times'>Times</option><option value='Courier'>Courier</option><option value='Impact'>Impact</option><option value='Geneva'>Geneva</option><option value='Optima'>Optima</option></select></span><span style="padding-right:1px;" id="bc6"><select id="fcolor" class="codeButtons" onchange="alterfont(this.options[this.selectedIndex].value, 'color','message','');this.selectedIndex=0;"><option value='0'>COLOR</option><option value='blue' style='color:blue'>Blue</option><option value='red' style='color:red'>Red</option><option value='purple' style='color:purple'>Purple</option><option value='orange' style='color:orange'>Orange</option><option value='yellow' style='color:yellow'>Yellow</option><option value='gray' style='color:gray'>Gray</option><option value='green' style='color:green'>Green</option></select></span><span style="padding-right:1px;" id="bc7"><input type="button" title="URL" value="http://" onclick="tag_url('message','')" class="codeButtons" style="direction:ltr;width:45px;" id="url" /></span><span style="padding-right:1px;" id="bc8"><input type="button" title="E-mail" value="@" onclick="tag_email('message','')" class="codeButtons" style="width:30px;" id="email" /></span><span style="padding-right:1px;" id="bc9"><input type="button" title="Image" value="img" onclick="tag_image('message','')" class="codeButtons" style="width:35px;" id="img" /></span><span style="padding-right:1px;" id="bc10"><input type="button" title="Quote" value="quote" onclick="simpletag('quote','','','message','')" class="codeButtons" style="width:40px;" id="quote" /></span><span style="padding-right:1px;" id="bc11"><input type="button" title="Code" value="code" onclick="simpletag('code','','','message','')" class="codeButtons" style="width:40px;" id="codes" /></span><span style="padding-right:1px;" id="bc34"><input type="button" title="Spoiler" value="spoiler" onclick="simpletag('spoiler','','','message','')" class="codeButtons" style="width:40px;" id="spoiler" /></span><span style="padding-right:1px;" id="bc18"><input type="button" title="Hide from Guest" value="hide" onclick="simpletag('hide','','','message','')" class="codeButtons" style="width:40px;" id="hide" /></span><span style="padding-right:1px;" id="bc12"><input type="button" title="List" value="list" onclick="tag_list('message','')" class="codeButtons" id="list" style="width:30px;" /></span><span style="padding-right:1px;" id="bc13"><input type="button" title="Left" style="width:20px;text-align:left;" value='···' onclick="simpletag('l','cdl','···','message')" class="codeButtons" id="cdl"></span><span style="padding-right:1px;" id="bc14"><input type="button" title="Center" style="width:20px;text-align:center;" value='···' onclick="simpletag('c','cdc','···','message')" class="codeButtons" id="cdc"></span><span style="padding-right:1px;" id="bc15"><input type="button" title="Right" style="width:20px;text-align:right;" value='···' onclick="simpletag('r','cdr','···','message')" class="codeButtons" id="cdr"></span><span style="padding-right:1px;" id="bc16"><input type="button" title="All codes" style="width:20px;" value="+" onclick="window.open('http://apocalypse.ucoz.kz/index/17','bbcodes','scrollbars=1,width=550,height=450,left=0,top=0');" class="codeButtons" /></span><span style="padding-right:1px;" id="bc17"><input style="font-weight:bold;width:20px" type="button" value="/" class="codeButtons" title="Close all opened codes" onclick="closeall('message','');" class="codeCloseAll" /></span>
</div>
</td></table>

<center>
<input style="height:22;opacity:0.5;" onmouseover="$('#subs').slideDown('slow');" type="submit" onClick="Down()" id="addcBut" name="submit" value="Добавить комментарий [ctrl + enter]">
<table>
<td class="commTd2">
$ERROR$
</td>
</table>
<div style="display:none;opacity:0.5;" id="subs">
<?if($SUBSCRIBE$)?><center>$SUBSCRIBE$</center><?endif?>
<?if($SECURITY_CODE$)?><center>$SECURITY_CODE$</center><?endif?>
</div>
</center>

<script type="text/javascript">
            function precomment(){
            document.preform.message.value=$('#message').val();
            <?if($SMILES$)?>document.preform.sm.value='1';<?endif?>
            window.open('','commprev','scrollbars=1,width=600,height=250,left=0,top=0');
            document.preform.submit();}
            </script>

С Формой добавления комментариев мы разобрались, осталось лишь активировать кнопку "Предпросмотр"

Бежим на страницу материала и комментариев к нему в тех модулях, где будут комментарии и находим там (В самом низу) следующий участок кода:

Code

$COM_ADD_FORM$

Сразу после этого вставляем:

Code