Установка:
1) Вставляем туда где хотим видеть выезжающий чат
Code
<div id="showurls" style="display: none;">
<table border="0" cellpadding="0" cellspacing="0" width="100%" style="border:0px">
<tr><td>
$CHAT_BOX$
</td></tr>
</table>
</div>
<center id="showurl"><a href="#" onclick="return false;"><img src="http://s003.radikal.ru/i201/1102/62/777d93692f26.png" border="0"></a></center>
<center id="hidenax" style="display: none;"><a href="#" onclick="return false;"><img src="http://s57.radikal.ru/i158/1102/e6/9fbeb7b7e903.png" border="0"></a></center>
<script type="text/javascript">$(document).ready(function() {$('#showurl').click(function(){$('#showurls').show('slow'); $('#showurl').hide('fast'); $('#hidenax').show('fast');}); $('#hidenax').click(function(){$('#showurls').hide('slow'); $('#hidenax').hide('fast'); $('#showurl').show('fast');});}); document.getElementById('newslink').value='<a href="'+location.href+'" title="$ENTRY_TITLE$">$ENTRY_TITLE$</a>'; document.getElementById('newslinkbbcode').value='[url='+location.href+']$ENTRY_TITLE$[/url]'</script>
2) А теперь вставим стиль мини чата в CSS
Code
/* Chat */
.cMessage {text-shadow: black 1px 1px 2px;background: #454545;padding: 10px 5px 10px 5px;color:ddd;-webkit-border-radius: 5px; -moz-border-radius: 5px; -khtml-border-radius: 5x; border-radius: 5px;border-top: solid 1px #565656; border-left: solid 1px #565656; border-bottom: solid 1px #343434; border-right: solid 1px #343434;}
.cBlock1 {text-shadow: black 1px 1px 2px;background: #454545;padding: 10px 5px 10px 5px;color:ddd;-webkit-border-radius: 5px; -moz-border-radius: 5px; -khtml-border-radius: 5x; border-radius: 5px;border-top: solid 1px #565656; border-left: solid 1px #565656; border-bottom: solid 1px #343434; border-right: solid 1px #343434;}
.cBlock2 {text-shadow: black 1px 1px 2px;background:url(/shablon/bor5.png);padding: 10px 5px 10px 5px;color:ddd;-webkit-border-radius: 5px; -moz-border-radius: 5px; -khtml-border-radius: 5x; border-radius: 5px;border-top: solid 1px #565656; border-left: solid 1px #565656; border-bottom: solid 1px #343434; border-right: solid 1px #343434;}
.mchat {text-shadow: black 1px 1px 2px;background:white;padding: 2px 5px 2px 5px;color:ddd;-webkit-border-radius: 5px; -moz-border-radius: 5px; -khtml-border-radius: 5x; border-radius: 5px;border-top: solid 1px #565656; border-left: solid 1px #565656; border-bottom: solid 1px #343434; border-right: solid 1px #343434;}
.chatWindow {padding: 10px 10px 10px 10px;color:ddd;-webkit-border-radius: 5px; -moz-border-radius: 5px; -khtml-border-radius: 5x; border-radius: 5px;border-top: solid 1px #565656; border-left: solid 1px #565656; border-bottom: solid 1px #343434; border-right: solid 1px #343434;}
/* ------------- */