How can make my postbit look like this...so my posts will appear on a talk bubble.
![[Image: qp0z80.png]](https://camo.mybb.com/aae05e37d0499f49bdcb68d51a619515ac3e69ce/687474703a2f2f6934352e74696e797069632e636f6d2f7170307a38302e706e67)
Actually I got a deep color theme but I don't want the postbit in deep color, I want the postbit color to light and post text color to deep. By that i can easily change the my theme to light color theme without worrying about post text color problem.
Bump!!
Anybody?? Any solution??
I want a solution...please help..
You can accomplish this effect either by creating a plugin to alter the postbit portion display or by modifying the posbit template.
You will need to create 1 very large bubble or 8 very small bubble portions background images, to surround the inner text. It can also be achieved with wide top and bottom images and two small side images...
I already have started a
fancy button tutorial on MyBBCodes.
I will also do a background surrounding effect tutorial soon...
I am doing it at the moment, but i am frequently disturbed by PMs...
Ok i finally had time to put most of the Tutorial in our forum, have a look here of the method used to display speech bubbles :
Speech Bubbles Tutorial
You will notice that i have put a place for a formated "post subject" at the top of each bubble.
How to implement this in postbit??
(2009-12-23, 11:34 AM)tech2game Wrote: [ -> ]How to implement this in postbit??
Just replace this section of the "postbit" template :
<span class="smalltext"><strong>{$post['icon']}{$post['subject']} {$post['subject_extra']}</strong></span>
<div class="post_body" id="pid_{$post['pid']}">
{$post['message']}
</div>
With this :
<div class="post_body" id="pid_{$post['pid']}">
<table class="table_bubble" cellpadding="0" cellspacing="0">
<tr>
<td class="table_bubble_top_left">{$post['icon']}{$post['subject']} {$post['subject_extra']}</td>
<td class="table_bubble_top_right"></td>
</tr>
<tr>
<td class="table_bubble_center_left">
{$post['message']}
</td>
<td class="table_bubble_center_right"></td>
</tr>
<tr>
<td class="table_bubble_bottom_left"></td>
<td class="table_bubble_bottom_right"></td>
</tr>
</table>
</div>
Do not forget to include also your style in your headerinclude template :
<style>
.table_bubble{
background-color : transparent;
padding:0;
margin:0;
spacing:0;
border: none;
}
.table_bubble_top_left{
background : transparent url(Bubble.gif) no-repeat left top;
padding-top: 32px;
padding-left: 32px;
padding-bottom: 8px;
font-weight: bold;
}
.table_bubble_top_right{
background: transparent url(Bubble.gif) no-repeat right top;
width: 40px;
}
.table_bubble_center_left{
background : transparent url(BubbleCenter.gif) left top;
padding-left: 32px;
color:#0000ff;
}
.table_bubble_center_right{
background : transparent url(BubbleCenter.gif) right top;
width: 40px;
}
.table_bubble_bottom_left{
background : transparent url(Bubble.gif) no-repeat left bottom;
height : 48px;
}
.table_bubble_bottom_right{
background: transparent url(Bubble.gif) no-repeat right bottom;
width: 40px;
}
</style>
And your images, having the proper path changes...
P.S. Please do not copy my own images...
No not at all...very very thank you for your support...
In this postbit which section I have to replace with your code??
{$ignore_bit}
<a name="pid{$post['pid']}" id="pid{$post['pid']}"></a>
<table border="0" cellspacing="{$theme['borderwidth']}" cellpadding="{$theme['tablespace']}" class="tborder" style="{$post_extra_style} {$post_visibility}" id="post_{$post['pid']}">
<tbody>
<tr>
<td class="tcat">
<div class="float_left smalltext">
<span class="smalltext"><strong>{$post['icon']}{$post['subject']} {$post['subject_extra']}</strong></span> {$post['postdate']}, {$post['posttime']} <span id="edited_by_{$post['pid']}">{$post['editedmsg']}</span>
</div>
{$post['posturl']}
</td>
</tr>
<tr>
<td class="trow1 {$unapproved_shade}">
<table cellspacing="0" cellpadding="0" border="0" style="width: 100%;">
<tr>
<td class="post_avatar" width="1" style="{$post['avatar_padding']}">
{$post['useravatar']}
</td>
<td class="post_author">
<strong><span class="largetext">{$post['profilelink']}</span></strong> {$post['onlinestatus']}<br />
<span class="smalltext">
{$post['usertitle']}<br />
{$post['userstars']}
{$post['groupimage']}
{$post['iplogged']}
</span>
</td>
<td class="smalltext post_author_info" width="165">
{$post['user_details']}
</td>
</tr>
</table>
</td>
</tr> <tr>
<td class="trow2 post_content {$unapproved_shade}">
<fieldset id="pid_{$post['pid']}">
<legend>Post</legend>
{$post['message']}</fieldset>
{$post['attachments']}
<br />
{$post['signature']}
</td>
</tr>
<tr>
<td class="trow1 post_buttons {$unapproved_shade}">
<div class="author_buttons float_left">
{$post['button_email']}{$post['button_pm']}{$post['button_www']}{$post['button_find']}
</div>
<div class="post_management_buttons float_right">{$post['button_edit']}{$post['button_quickdelete']}{$post['button_quote']}{$post['button_multiquote']}{$post['button_report']}{$post['button_warn']}{$post['button_reply_pm']}{$post['button_replyall_pm']}{$post['button_forward_pm']}{$post['button_delete_pm']}
</div>
</td>
</tr>
</tbody>
</table>
For the message replace this :
<td class="trow2 post_content {$unapproved_shade}">
<fieldset id="pid_{$post['pid']}">
<legend>Post</legend>
{$post['message']}</fieldset>
with this :
<td class="trow2 post_content {$unapproved_shade}">
<table class="table_bubble" cellpadding="0" cellspacing="0">
<tr>
<td class="table_bubble_top_left">{$post['icon']}{$post['subject']} {$post['subject_extra']}</td>
<td class="table_bubble_top_right"></td>
</tr>
<tr>
<td class="table_bubble_center_left">
{$post['message']}
</td>
<td class="table_bubble_center_right"></td>
</tr>
<tr>
<td class="table_bubble_bottom_left"></td>
<td class="table_bubble_bottom_right"></td>
</tr>
</table>
ohh those postbits looks a bit familiar
I hate tables with all my heart, so I didn't implement any extra table on my postbit. Since I knew the width of my regular posbit, I just made an image with the corners and used CSS to set it as background for the post_content (I don't remember the actual name of the class xD), so it was kind of a bit more smooth template with ease.