Embedding images in text

[Biggles]

Anyone know how to embed images in text? Maybe there's a mod here that facilitates this but I haven't found one.

What I mean is: using the default BB code , I get images that sit on a line of text and push everything else out of the way of the image. What I'm after is the way to have text flow [I]around the image - like they do, for example in magazines and newspapers.

I'd be grateful if someone could point me in the right direction please. :)

Biggles

[King Kovifor]

Custom [img] tags that use divs and floats. This is a simple one. I think I set up the option and param correctly.

<div style="float:left"><img src="{option}" alt="{param}" /></div>

Of course, you could switch "float:left" to "float:center" or "float:right" depending on how you wanted it positioned and you must not use img as your tag.

[Biggles]

Wow! That was a real fast reply. Thank you, your Majesty.

Let me try to understand what you've said (sorry, King Kovifor, but I'm not a coder's bootlace). If I am typing text for a post, I simply insert the code you've posted above, placing the URL to the required image where {option} is and the alternate accompanying text where it reads {param}. Is that correct or am I still way off the mark?

Thanks again. :up:

Biggles

[King Kovifor]

Wow! That was a real fast reply. Thank you, your Majesty.

Let me try to understand what you've said (sorry, King Kovifor, but I'm not a coder's bootlace). If I am typing text for a post, I simply insert the code you've posted above, placing the URL to the required image where {option} is and the alternate accompanying text where it reads {param}. Is that correct or am I still way off the mark?

Thanks again. :up:

Biggles

Sorry, way off. And I am liking the "Your majesty" remark. LOL. I haven't gotten that one before. But I understand not being a "coder's bootlace". Here is the steps that you want to go to.

Enter ACP.
Go into the BBCode manager.
Add a new BBCode.
Chose a tag name, like img2.
Add the code I gave you into the replacement field.
Set "Use option" to yes.
Click save.


Now you will use something like this is where the alt goes for your posts.

[Biggles]

Ah, now I follow - I think. Thank you kindly, your Royal Highness. ;)

I will try that out on the morrow and let your Majesty know if I've got it to work.

Many thanks, King Kovifor. I am deeply grateful.

Your humble servant, Sire :D

Biggles

[King Kovifor]

Ok. That is a bit overboard... lol. But I don't care... lol. Your welcome. If you need any more help, I got no life so I will be here to help!

[Biggles]

Ok. That is a bit overboard... lol. But I don't care... lol. Your welcome. If you need any more help, I got no life so I will be here to help!No offence meant King Kovifor. Just light-hearted camaraderie, I assure you.

Thanks very much for trying to help me. I'll have a go in the morning as I'm about to hit the hay. It's almost midnight on this side of the pond - and I need my beauty sleep. G'night for now. :)

Best wishes :up:

Biggles

[King Kovifor]

Night. And I have no offense was taking! I just thought it was really funny. Even the squire part.

[Biggles]

Night. And I have no offense was taking! I just thought it was really funny. Even the squire part.Thank goodness for that, King K

Communications are often misunderstood in this medium, I find. Especially humour, or attempts to be humorous. I have a very dry humour that sometimes gets me into unwanted trouble. :eek:

I am going to try your suggestion shortly. I'll get back to you on it. Maybe we should set up a section for new BB Code for those of us who aren't good with coding.

Regards :up:

Biggles

--------------- Added 1206100811 at 1206100811 ---------------

Hello again all

I've managed to make this work for me, with grateful thanks to my friend and yours, King Kovifor.

However, it didn't quite work out until I fiddled with the code above just a little.

This is the final code that worked for me:

<div style="float:left"><img src="{option}" alt="{param}"></div>

As you can see, I removed just the space and the forward slash after {param}" and then everything seemed fine. Oh, and for some reason I couldn't get this type of code to work using 'float:center' but it worked fine for 'float:right'.

Thanks a million King Kovifor. You're a star! :up:

Biggles

[Boofo]

There is no 'float:center'. ;)

[Biggles]

There is no 'float:center'. ;)Well, that's really interesting. Perhaps there should be, Boofo! Perhaps there should be. ;)

[Dismounted]

text-align: center FTW! ;)

[Boofo]

LOL But that doesn't always work where float center would.

[Biggles]

text-align: center FTW! ;)My original query was about embedding images into text rather than aligning text, Dismounted. Aligning text in the center is a vB default option isn't it?

I don't know about you guys over there but I kinda like justified text (I've got that facility on my site thanks to someone on this forum) and embedded images. Looks sort of professional, like they do in magazines and newspapers.

It's ok to use thumbnails or to put up images in a post that sit separately. But nothing looks quite so smooth and professional, IMO, than nice photos with text wrapped around them.

Anyways, thanks to the King and the other party who posted on justifying text thru BB code, I am about to transform the way some of my posts look on my site. Hopefully, for the better.

Many thanks to you all for helping out. :up:

Best wishes

Biggles

[Boofo]

I released a bbcode hack for this very same thing that other day. ;)

[Biggles]

I released a bbcode hack for this very same thing that other day. ;)So you did, Boofo. I just found it (by searching through all your posts - why didn't you post a link here?) and I've downloaded it and marked as installed.

What is disappointing is that I searched high and low, including using the search function, and couldn't find it before I started this thread.

Not to worry. I now have it and will certainly use it. I like the facility to change background color too. Good work. Thanks.

Best wishes :up:

Biggles

[King Kovifor]

The code you use, will cause a validation error since the image tag isn't closed. I added the " /" to close it. But you can always add ></img> to the end of the tag.

[Boofo]

So you did, Boofo. I just found it (by searching through all your posts - why didn't you post a link here?) and I've downloaded it and marked as installed.

What is disappointing is that I searched high and low, including using the search function, and couldn't find it before I started this thread.

Not to worry. I now have it and will certainly use it. I like the facility to change background color too. Good work. Thanks.

Best wishes :up:

Biggles

All you have to do is check the profile and all the coder's hacks are listed there. ;)

I didn't want to step on the thread with any shameless advertising. ;)

The code you use, will cause a validation error since the image tag isn't closed. I added the " /" to close it. But you can always add ></img> to the end of the tag.

Which is actually better?

--------------- Added 1206109195 at 1206109195 ---------------

I just checked my code and it has the /> at the end of it. ;)

[King Kovifor]

I usually use the /> at the end so that it closes. I actually don't know which one is better... It is just habit for me to use the />.

[Boofo]

Same here. I thought that was the only accepted way to do it, actually. I didn't think you could use a closing image tag like </img>.

[Biggles]

As a non-coder, I am reluctant to enter into this new discussion as to which method is better. I'm just grateful to both of you for trying to help others achieve what in my opinion is a much classier way of posting images - by wrapping text around them.

Hats off to both of you. Wish I could code. :( Even after years of running vB sites, I can only go in and make small changes and do things by trial and error. Horses for courses, I guess.

Best wishes

Biggles

[Boofo]

We've all been there. I still have those days when you are probably a better coder than I will ever be. ;)

And you're very welcome, sir. ;)

[King Kovifor]

Same here. I thought that was the only accepted way to do it, actually. I didn't think you could use a closing image tag like </img>.

I believe you can do closing tags for ALL HTML tags. But I think since nothing goes in between the > and </img> that it is just accepted as /> so that the browser does a little less rendering.

As a non-coder, I am reluctant to enter into this new discussion as to which method is better. I'm just grateful to both of you for trying to help others achieve what in my opinion is a much classier way of posting images - by wrapping text around them.

Hats off to both of you. Wish I could code. :( Even after years of running vB sites, I can only go in and make small changes and do things by trial and error. Horses for courses, I guess.

Best wishes

Biggles

We have all been there. I was there at age 14, but now at age 16, with some hard work, concentration, and dedication I can code. LOL. But if you really want to, you could sit down for a couple of weeks and learn. :) Resources are everywhere.

And you can always come back for help...

[Boofo]

King Kovifor, I actually thought you were older than that. ;)

[King Kovifor]

King Kovifor, I actually thought you were older than that. ;)

Nope. Born September 4th, 1991. :) I am just super mature for my age. LOL.

[Boofo]

Yes you are. And good for you, sir. ;)

[Dismounted]

"/>" simply means "close the tag off like a normal end tag but I'm too lazy so I use this shortcut" ;). Seriously though, both "/>" and "</img>" will work and mean the same, the first looks somewhat neater though.