BBCode: [wonders]

Ok, this is my first "OFFICIAL" release so go easy on me. It's a small one - nothing fancy, while I work on the Bible script. This should be able to work on all 3.5.x and possibly 3.0.x versions (I've not tested it). I've always wanted something like this, but decided this morning to "just do it."

I would rate this an easy modification - most everyone should be able to install this.

If you have previously installed this hack, please replace the code with the new code (below) and remove your old images and insert the new ones (they are numbered differently).

Step 1: Upload the images to your images folder. If you upload them elsewhere, change the location in step 2 (replacement code) to accomodate.

Step 2: Go to your admincp => Custom BB Codes => Add New BB Code

Title Wonders

Tag wonders

Replacement (replace www.yoursite.com with your URL/path to images directory) Also, please note that you can alter the color of the wonder text in this area
<font color="#FE0202">wonders {param}</font>

<table cellpadding="0" cellspacing="0">
    <tr>
        <td colspan="2"><img src="http://www.yoursite.com/images/cloud_101.gif" width="236" height="30" alt=""></td>
        <td style="background-image: url(http://www.yoursite.com/images/cloud_102.gif);background-repeat:repeat-x;width:100%;height:30;" nowrap="nowrap" alt=""></td>
        <td colspan="2"><img src="http://www.yoursite.com/images/cloud_103.gif" width="161" height="30" alt=""></td>
    </tr>
    <tr>
        <td><img src="http://www.yoursite.com/images/cloud_104.gif" width="126" height="44" alt=""></td>
        <td colspan="3" style="background-image: url(http://www.yoursite.com/images/cloud_105.gif)"></td>
        <td><img src="http://www.yoursite.com/images/cloud_106.gif" width="51" height="44" alt=""></td>
    </tr>
    <tr>
        <td style="background-image: url(http://www.yoursite.com/images/cloud_107.gif);repeat:repeat-y;width:126;height:100%;" nowrap="nowrap" alt=""></td>
        <td colspan="3" style="background-image: url(http://www.yoursite.com/images/cloud_105.gif)" "background-repeat:no-repeat" alt=""><table border="0"><tr><td><font color="#FE0202">wonders {param}</font></td></tr></table></td>
        <td style="background-image: url(http://www.yoursite.com/images/cloud_108.gif);repeat:repeat-y width:51 height:100%;" nowrap="nowrap" alt=""></td>
    </tr>
    <tr>
        <td><img src="http://www.yoursite.com/images/cloud_109.gif" width="126" height="44" alt=""></td>
        <td colspan="3" style="background-image: url(http://www.yoursite.com/images/cloud_105.gif)"></td>
        <td><img src="http://www.yoursite.com/images/cloud_110.gif" width="51" height="44" alt=""></td>
    </tr>
    <tr>
        <td colspan="2"><img src="http://www.yoursite.com/images/cloud_111.gif" width="236" height="30" alt=""></td>
        <td style="background-image: url(http://www.yoursite.com/images/cloud_112.gif);background-repeat:repeat-x;width:100%;height:30;" nowrap="nowrap" alt=""></td>
        <td colspan="2"><img src="http://www.yoursite.com/images/cloud_113.gif" width="161" height="30" alt=""></td>
    </tr>
    <tr>
        <td><img src="http://www.yoursite.com/images/spacer.gif" width="126" height="1" alt=""></td>
        <td><img src="http://www.yoursite.com/images/spacer.gif" width="110" height="1" alt=""></td>
        <td><img src="http://www.yoursite.com/images/spacer.gif" width="100%" height="1" alt=""></td>
        <td><img src="http://www.yoursite.com/images/spacer.gif" width="110" height="1" alt=""></td>
        <td><img src="http://www.yoursite.com/images/spacer.gif" width="51" height="1" alt=""></td>
    </tr>
</table>

Example [wonders]what today will be like[/wonders]

Description This is for a short text wonder bubble.

Use {option} No

Button Image (Optional) No

Save

Temporary demo location (fits 100% of your style):
http://www.christianboards.org/showt...=5731#post5731

Feel free to alter this as needed. This is my gift to you!

Version History

1.02 I've edited it a second time to include changes made by peterska2 in which she helped me fix a repeat-y issue that plagued larger "wonders." A special thanks goes to her for helping me fix that issue. Thank you.

1.01 I've edited the code to clean it up a little.

[moonclamp]

What happens if a [wonders] post is quoted, will it affect the rendering/scale?

[davidw]

I've quoted one on my site here to show what it does.

[SweetHome]

Nice Thanks..

[RFViet]

how to make the bubble smaller ??

[davidw]

The best & easiest way to make the bubble smaller is to edit the images - you can make it whatever size you want that way. I created the bubble based on drawing one in photoshop and then slicing the bubble up.

[RFViet]

Originally Posted by christianb

The best & easiest way to make the bubble smaller is to edit the images - you can make it whatever size you want that way. I created the bubble based on drawing one in photoshop and then slicing the bubble up.

do you still have psd file ??

[RFViet]

I think this is about the code ,not the graphic !!

[davidw]

I'll have to check tomorrow at work, pretty sure I do.

[davidw]

I don't have the PSD anymore. For some reason it is not where I saved it. It is possible that I lost it Wednesday of last week when my system crashed - I am on a remote profile and it was on my desktop.

[htscpl]

Hey, works great! *** clicks installed ***

Thanks!