PDA

View Full Version : How to add BB code that wraps text around an image



ZnARk
11-02-2004, 08:51 AM
This prolly have been done before but here is how I added a custom BB code that will wrap text around a picture.
Might be useful in news forum etc :)
Also made a little image/button to go with it http://vbadvanced.com/forum/attachment.php?attachmentid=596&stc=1
Just save the wrap.gif and upload it to your forum/images/editor folder.

Go to forum/admincp/bbcode.php? and add the new BB code...

Title:

Wrap text around image
Tag:

wrap
Replacement:

<table border="0" align="left" valign="top">
<tr>
<td><img src="{param}" border="0" align="left"></td>
</tr>
</table>
Example:

imgurl
Description:

This will wrap text around a picture of your choice. Just add the url to the img you wish to use.
Use {option}:

No
Button Image (Optional):

images/editor/wrap.gif

Added some screens of it to...

ZnARk
11-02-2004, 09:08 AM
Button

Our Sponsors
 

Amavisca
11-13-2004, 04:04 AM
Thanks , man this is exactly what I need. Awsome.

mindbuster
01-04-2005, 01:29 AM
Cool, thnx, needed this :)

Our Sponsors
 

KW802
01-04-2005, 07:12 PM
Easier way of doing this... :)

Go into ACP --> Custom BB Codes --> Add New BB Code

Title = Image with alignment
Tag = img2
Replacement =
<img src="{param}" align="{option}" border="0" hspace="6" vspace="3" alt=""/>
Example = URL of image
Description = This tag allows you to align an image to the right of left of your text.
Use {option} = Yes
Button Image (optional) = {your choice....}
This method requires no code changes and allows you to specify the alignment (left, right, top, or bottom).

wintermute
01-05-2005, 10:43 AM
Thanks to you both, very much

coolegg
01-25-2005, 03:49 PM
I think there may be a bit of a security issue with the methods suggested so far...

I discovered one drawback to creating a custom <img> BBCode, and that is that the security option that allows the admin to filter out any image urls with dynamic elements does not work on custom BB codes that use <img src=""> (that security option is under Admin Panel > vBulletin Options > Message Posting and Editing Options) Even when enabled, that security setting does not work on any custom BB codes that are based on the <img> tag.

I am a security nut (paranoid), so what I came up with was two custom BBcodes that will float any block-level element, image or otherwise. These BB codes can then be nested AROUND the BB code so that the image floats but the security setting still works.

So my BB code useage looks something like this:


imageurl

My two custom BB codes look like this:


Title: FLOATLEFT
Usage: {param}
Replacement: <div style="float: left">{param}</div>
and

Title: FLOATRIGHT
Usage: {param}
Replacement: <div style="float: right">{param}</div>

Edit: fixed typos

mholtum
01-25-2005, 04:02 PM
sweet, I used KW802's way. Quick and Easy!

hoangminh
03-04-2005, 07:25 AM
This prolly have been done before but here is how I added a custom BB code that will wrap text around a picture.
Might be useful in news forum etc :)
Also made a little image/button to go with it http://vbadvanced.com/forum/attachment.php?attachmentid=596&stc=1
Just save the wrap.gif and upload it to your forum/images/editor folder.

Go to forum/admincp/bbcode.php? and add the new BB code...

Title:

Wrap text around image
Tag:

wrap
Replacement:

<table border="0" align="left" valign="top">
<tr>
<td><img src="{param}" border="0" align="left"></td>
</tr>
</table>
Example:

imgurl
Description:

This will wrap text around a picture of your choice. Just add the url to the img you wish to use.
Use {option}:

No
Button Image (Optional):

images/editor/wrap.gif

Added some screens of it to...
If you use this way to wrap text around images, it will get problem when this post are show on the vbcmps index page, all the news will be displayed incorrect positions.

I have use the KW802 way before I read this thread, it is simple and good way to implement

mholtum
04-15-2005, 11:39 AM
Easier way of doing this... :)

Go into ACP --> Custom BB Codes --> Add New BB Code

Title = Image with alignment
Tag = img2
Replacement =
<img src="{param}" align="{option}" border="0" hspace="6" vspace="3" alt=""/>
Example = URL of image
Description = This tag allows you to align an image to the right of left of your text.
Use {option} = Yes
Button Image (optional) = {your choice....}
This method requires no code changes and allows you to specify the alignment (left, right, top, or bottom).

I added this code (see attatchment) yet the image does not appear.. Any ideas? When I click the button I place the path to the image. I am thinking I am placing the wrong info in the popup.

Ok, Huge Duh to me.. You place "left" or "right" in the popup... DUH DUH DUH

Milk Man
04-19-2005, 06:45 PM
for some reason when i use the wrap and then view the post, my text dissapears

KW802
04-19-2005, 06:46 PM
for some reason when i use the wrap and then view the post, my text dissapearsWhich version of the code are you using?

emtee
04-21-2005, 03:20 PM
KW802, I'm using your code and when I type http://www.....gif, the image doesn't show up, it just display the text http://www.....gif. I wonder why??? :confused:

mholtum: Ok, Huge Duh to me.. You place "left" or "right" in the popup... DUH DUH DUH <<< I'm still confused. :confused: What do you mean by "the popup" ?

KW802
04-21-2005, 03:22 PM
Because it needs to be closed with an "[/img2]" tag instead of a "[/img]" tag. ;)

emtee
04-21-2005, 04:11 PM
Oh ok got it, thanks KW802. By the way, you need to edit your instructions so people don't get errors like I did. Thanks for the quick reply! :)

mholtum
04-21-2005, 04:12 PM
Oh ok got it, thanks KW802. By the way, you need to edit your instructions so people don't get errors like I did. Thanks for the quick reply! :)The instructions worked for me.. ;)

KW802
04-21-2005, 04:28 PM
Oh ok got it, thanks KW802. By the way, you need to edit your instructions so people don't get errors like I did. Thanks for the quick reply! :)Whoops! :p I fixed the post.

Milk Man
04-22-2005, 04:32 AM
i'm using the first code...

MP3
05-17-2005, 04:09 AM
thanks

aggiefan
05-21-2005, 02:33 AM
If you want a resize parameter (like an 80X80 picture that you want posted at width="40")...

Could you set that up in the setup?

That'd be easier than resizing all the pictures I want to use.

***EDIT***

I figured out how to do it to a fixed size (like if I wanted all pics 150 width..(you just put width="150" in the code box. But how can I make it to where for each individual post I can put width=?? and it works?

aggiefan
05-23-2005, 09:56 AM
ttt, still need an answer to the question....

deb0
05-24-2005, 10:53 AM
Nicely Done!

Milk Man
05-27-2005, 07:48 PM
Mine doesn't seem to work. When i use the wrap button what i want wrapped dissapears.

sub_ubi
06-01-2005, 05:27 AM
Using KW802's version.

It works very well, thank you!

Question: I like to do pull quotes for news updates. Would it be possible to have BB code for wraparound text?

LloydSev
06-01-2005, 04:27 PM
This doesn't seem to translate to the front page of the CMPS .. only in the article post.

Borgs8472
06-11-2005, 11:33 AM
Just for people's info, my float left image tag is [ commie ] and float right is [ nazi ] :D