Image Alignment Hack for your News Module.

[chkdg8]

I want to start off by saying that this mod is not mine and I forgot where I found it but I want to give all the proper credit to the original author. I keep getting many PMs on how I have image aligment for my News Module on my site so I figured that I should post the mod that I'm using so anyone can have the chance to use it at their own leisure. I know that there are many other mods for this feature which I have tried them all but this one here is the easiest and works best for me in my opinion. I installed it when I was running 3.5.4 but it works fine with 3.6.4 too. Enjoy.

Okay, you start off by creating a new custom BB code.

1. Go to your Admin CP-Custom BB Code-Add New BB Code.

Title: Image tag with Alignment
Tag: imga
Replacement: <img src="{param}" align="{option}" border="0" alt="" style="padding:7px;" />
Example: http://www.seka.org.uk/uploads/images/SBone.gif
Description: The above example will left align the image. Valid options are left | right
Use {option}: yes
Save
Done.

Now, once you've completed that image mod, then you go to your vBa CMPS settings and select Edit Modules. I just renamed my News module to whatever I want. In my case I named it struggle headlines. So, when you're ready to write a story, all you have to do is start it by following the "Example" that you added in your custom BB code and by aligning it either left or right. Remember that the "Example" URL is replaced by the url of where you have your image stored. I used to store my images on photobucket but now I just have them on my own server. It's your choice.

[DannyEFC]

Works great thanks.

[Our Sponsors]

[Supernature]

Things can be so simple :)
Thank you for that!

[SteveRobWhateve]

Is there a way to make this code so left is the default alignment and the option to add is the image url?

[Our Sponsors]

[chkdg8]

I'm not entirely sure but you can experiment with replacing {option} with {left}. See if that works. I'm going to try this as well.

[yotsume]

Ok this is awesome BB code!

However it is in dire need of a button for the editor. Attached is a button I just made. All you have to do is edit the gif and change the colors to match your theme and poof.

Upload the gif to your image folder and then edit the BB code and point the url to the button image so it will show on your editor toolbar.

LOOKS GREAT!

[yotsume]

Now all that we need is a BB code that will fully justify text. Why vBulletin left that out of the editor is beyond me! The button for justified is attached here. Here is the BB code for fully justified text. I feel this BB code for image alignment must go with BB code for text alignment. Both together make a clean presentation in the module!

Make a new custom BB code:
Admin CP -> Custom BB Codes -> Add New BB Code -> *use the values below*Title: Justified Text
Tag: justifyReplacement: <div align="justify">{param}</div>Example: justifyDescription: This will fully justify your text to both margins.

Button Image: url to the justified.gif button image.
There is even a method to add the buttons to the main editor template by editing the "editor_toolbar_on" template.

See this post here: How to add Justify Tag (http://www.vbulletin.com/forum/showthread.php?t=228713)

Check out my attached screen shot of my image aligned combined with justified text.

JUST LOOKS CLEAN!

[yotsume]

Here is another Align Image Icon I just made using the standard insert image icon from the editor.

I am going to learn how to add this to the "editor_on" template...

This should have been a standard function included with vBulletin in the first place! Boy we are in dire need of a editor upgrade!

[NarcotiqTR]

it didn't worked

[yotsume]

Hello,

I tested your url to that photo on my board. It works fine for me. See attached photo. I suggest you retrace the steps and make sure the code you entered into the BB Code is correct.

[yotsume]

Just a quick note... Custom BB code breaks the editor when editing modules and also if you use the Links Directory... I reported these problems and hope to get a fix soon...

[RYoBiOS]

I want to start off by saying that this mod is not mine and I forgot where I found it but I want to give all the proper credit to the original author. I keep getting many PMs on how I have image aligment for my News Module on my site so I figured that I should post the mod that I'm using so anyone can have the chance to use it at their own leisure. I know that there are many other mods for this feature which I have tried them all but this one here is the easiest and works best for me in my opinion. I installed it when I was running 3.5.4 but it works fine with 3.6.4 too. Enjoy.

Okay, you start off by creating a new custom BB code.

1. Go to your Admin CP-Custom BB Code-Add New BB Code.

Title: Image tag with Alignment
Tag: imga
Replacement: <img src="{param}" align="{option}" border="0" alt="" style="padding:7px;" />
Example: http://www.seka.org.uk/uploads/images/SBone.gif
Description: The above example will left align the image. Valid options are left | right
Use {option}: yes
Save
Done.

Now, once you've completed that image mod, then you go to your vBa CMPS settings and select Edit Modules. I just renamed my News module to whatever I want. In my case I named it struggle headlines. So, when you're ready to write a story, all you have to do is start it by following the "Example" that you added in your custom BB code and by aligning it either left or right. Remember that the "Example" URL is replaced by the url of where you have your image stored. I used to store my images on photobucket but now I just have them on my own server. It's your choice.

With FireFox this not work:confused:
Solution?

[tresor]

i like this, but i would like that image would be a thumbnail that enlarge with a click, and all thumbnail with the same width and large. Is this possible?

[Amavisca]

i like this, but i would like that image would be a thumbnail that enlarge with a click, and all thumbnail with the same width and large. Is this possible?

Yah, I like the idea as well since some of my image is too big to wrap and it looks messy. Can somebody help???

[doogie1775]

Now all that we need is a BB code that will fully justify text. Why vBulletin left that out of the editor is beyond me! The button for justified is attached here. Here is the BB code for fully justified text. I feel this BB code for image alignment must go with BB code for text alignment. Both together make a clean presentation in the module!

Make a new custom BB code:
Admin CP -> Custom BB Codes -> Add New BB Code -> *use the values below*Title: Justified Text
Tag: justifyReplacement: <div align="justify">{param}</div>Example: justifyDescription: This will fully justify your text to both margins.

Button Image: url to the justified.gif button image.
There is even a method to add the buttons to the main editor template by editing the "editor_toolbar_on" template.

See this post here: How to add Justify Tag (http://www.vbulletin.com/forum/showthread.php?t=228713)

Check out my attached screen shot of my image aligned combined with justified text.

JUST LOOKS CLEAN!

I have a real need for this to work (justify text) for my news section. I did exactly as instructed here for the custom BB code, but it does not justify to both margins. The instructions to justify the image (topic of this thread) works perfectly. I just cant get the text to justify I use the tag "["justify"]" "["/justify"]" (without any of the quotes).

I have vBulletin v.3.6.8 Powered by vBadvanced CMPS v3.0 RC2

Thanks for any/all help - it's very appreciated!

[FrontRunner]

Just an alternative replacement code: Image Float left/right
<img src="{param}" style="margin: 5px; float: {option};" alt="" title="" />

[triff]

With FireFox this not work:confused:
Solution?

Is the this hack still not working in FireFox, or is it fixed?

SGL.

[FrontRunner]

Is the this hack still not working in FireFox, or is it fixed?

SGL.

With me I don't see a problem using IE6, 7 or FF

[kamikage]

Anyone have a fix for the custum BB code buttons breaking the vba editor when you edit modules? I've searched the forum for this and see people complaining about the broken editor issue but can't seem to find a solution

[kamikage]

Custom BB Code Button Image URLs Point to Wrong Location Bug

I just noticed that when editing a BB code module the button image urls on the editor are all pointing to the wrong location! They are looking for the button images in /admincp/images/editor. The correct loacation for the images for the editor is /images/editor. So to fix this error in the latest version of vbadvanced CMPS v3.0 RC2 all you have to do is upload your editor images to this location: /admincp/images/editor

Any custom BB code button images will now NOT break the vba editor.

So how can we edit the vba php files and correct this issue to fix the wrong url location for editor images?

Anyway I am surprised more people don't report this issue since bb code buttons are very common.

Is the view code / html button in the vba editor just totally broken or am I missing something there as well?