• Welcome to Simple Machines Community Forum. Please login or sign up.
December 05, 2021, 07:38:30 PM

News:

Join the Facebook Fan Page.


BBCode with style

Started by davidhs, May 02, 2010, 02:40:59 AM

Previous topic - Next topic

davidhs

May 02, 2010, 02:40:59 AM Last Edit: October 08, 2014, 08:15:10 AM by davidhs
Link to Mod

BBCode with style

ABOUT...

BBCode with style, 1.5.2
© 2010-2020 by davidhs
© Italian language 2011 by Sages
© Portuguese for Brazil and Portugal language 2012 by Joomlamz
© Russian language 2010-2011 by Bugo


This work is licensed under a Creative Commons Attribution 3.0 Unported License.

DESCRIPTION

Adds the possibility to use CSS styles, CSS classes and attributes like HTML in BBC tags.

New optional attributes of style:

  • style, whose value, quoted, are style rules inline.
  • class, whose value, quoted, are class names of style.
These attributes are added to the following BBC tags:

  • Horizontal rule (hr).
  • Image (img).
  • List (li, list).
  • Table (table, td, tr).
[tag class="class_of_style" style="rules"]text[/tag]

New optional attributes in BBC tags:


  • img:

    • rotateangle, rotatebgcolor. Rotate an image with a given angle in degree and using a background color for the uncovered zone after the rotation. The background color is an hexadecimal with 3 or 6 digits (#rgb or #rrggbb), a RGB color (r,g,b) or a color name of these:



































      aqua=#00ffff=#0ff=0,255,255
      black=#000000=#000=0,0,0
      blue=#0000ff=#00f=0,0,255
      fuchsia=#ff00ff=#f0f=255,0,255
      gray=#808080=128,128,128
      green=#008000=0,128,0
      lime=#00ff00=#0f0=0,255,0
      maroon=#800000=128,0,0
      navy=#000080=0,0,128
      olive=#808000=128,128,0
      orange=#ffa500=255,165,0
      purple=#800080=128,0,128
      red=#ff0000=#f00=255,0,0
      silver=#c0c0c0=192,192,192
      teal=#008080=0,128,128
      white=#ffffff=#fff=255,255,255
      yellow=#ffff00=#ff0=255,255,0
      If the color does not exist in the image and can not be added, is used the closest color. Default value is 0 (rotateangle) and black (rotatebgcolor). Values without quotes.
    • flip. Flip an image in a direction. Permitted values are: horizontal, vertical. Value without quotes.

  • table: border. Width (in pixels) of the border around a table. Value without quotes.
  • td: colspan, rowspan. Span columns and rows in a table cell. Value without quotes.
[img rotateangle=degree rotatebgcolor=color flip=direction]image[/img]
[table border=number]table content[/table]
[td colspan=number rowspan=number]table cell[/td]


New BBC tags:

  • Paragraph style (div): Adds class or style inline to one or more paragraph.
  • Character style (span): Adds class or style inline to text within a paragraph.
[div class="class_of_style" style="rules"]paragraph with style[/div]
[span class="class_of_style" style="rules"]text with style[/span]


For these new BBC tags are added buttons in the editing box.


EXAMPLE


SMF COMPATIBILITY


  • SMF 1.1 to 1.1.21.
  • SMF 2.0 to 2.0.17.

Can be installed before or after "nCode Image Resizer" MOD 2.0 (for SMF 2.0-2.0.15).

PHP configuration option "allow_url_fopen" must be activated in php.ini or .htaccess file.

LANGUAGES


  • english, english_british.
  • italian.
  • portuguese_brazilian, brazilian, portuguese_pt.
  • russian.
  • spanish, spanish_es, spanish_latin.

DOWNLOAD

Link to MOD

MANUAL INSTALLATION

See https://wiki.simplemachines.org/smf/Manual_installation_of_mods

COLLABORATE WITH THIS MOD

This work is licensed under a Creative Commons Attribution 3.0 Unported License.

You are free to share and adapt this MOD. Also you can collaborate in different ways:

CHANGE LOG

Legend:   ! Fixed   + Added   - Removed   * Changed   @ Note

1.5.2   2020-03-07
------------------
@ Can be installed before or after "nCode Image Resizer" MOD 2.0 (for SMF 2.0-2.0.15).
+ SMF compatibility: 2.0.11-2.0.17.
- SMF 2.0.x: Languages: brazilian, brazilian-utf8, spanish, spanish-utf8 (these are not used).

1.5.1   2015-08-26
------------------
! When img tag is disabled only URL is displayed.

1.5     2015-05-23
------------------
@ PHP configuration option "allow_url_fopen" must be activated in php.ini or .htaccess file.
* If rotate or flip of image fail, the original image is shown.
+ SMF compatibility: 1.1.21 and 2.0.10.

1.4.10  2014-10-07
------------------
+ SMF compatibility: 1.1.20 and 2.0.9.

1.4.9   2014-06-23
------------------
! Use HTML entities in ISO-8859-1 languages.
+ SMF compatibility: 2.0.8.

1.4.8   2014-01-25
------------------
+ SMF compatibility: 2.0.7.

1.4.7   2013-10-25
------------------
@ Can be installed before or after "nCode Image Resizer" MOD 1.3-1.4.
+ SMF compatibility: 1.1.19 and 2.0.6.

1.4.6   2013-08-18
------------------
@ This work is licensed under a Creative Commons Attribution 3.0 Unported License https://creativecommons.org/licenses/by/3.0/
+ SMF compatibility: 2.0.5.

1.4.5   2013-04-10
------------------
+ SMF compatibility: 1.1.18.
+ SMF compatibility: 2.0.4.
- SMF compatibility: Support to obsolete series 1.0.x and Beta and RC versions.

1.4.4   2012-12-22
------------------
+ SMF compatibility: 1.0.23.
+ SMF compatibility: 1.1.17.
+ SMF compatibility: 2.0.3.
+ Languages: portuguese_brazilian, portuguese_brazilian-utf8, brazilian, brazilian-utf8, portuguese_pt, portuguese_pt-utf8, thanks to Joomlamz.

1.4.3   2011-12-25
------------------
+ SMF compatibility: 1.0.22.
+ SMF compatibility: 1.1.16.
+ SMF compatibility: 2.0.2.

1.4.2   2011-09-21
------------------
+ SMF compatibility: 1.1.15.
+ SMF compatibility: 2.0.1.

1.4.1   2011-06-23
------------------
+ SMF compatibility: 1.1.14.
+ SMF compatibility: 2.0.
* Uses integration hooks in SMF 2.0 RC4 and next.

1.4     2011-04-09
------------------
+ Optional attribute class in BBC tags: hr, img, li, list, table, td, tr.

1.3.2   2011-04-03
------------------
+ Languages: italian, italian-utf8, thanks to Sages.

1.3.1   2011-03-04
------------------
+ SMF compatibility: 1.0 RC1 to RC2 and 1.0 to 1.0.21.
+ SMF compatibility: 1.1 Beta 3 Public, RC1 to RC3 and 1.1 to 1.1.13.

1.3     2011-02-17
------------------
+ Optional attribute class in BBC tags: div, span.
+ Optional attribute in table BBC tag: border.
+ SMF compatibility: 2.0 Beta 3.1 Public and RC5.
* Join in one package the normal version and the version that is installed after "nCode Image Resizer" MOD 1.3-1.3.1.

1.2.2   2010-11-08
------------------
! Regular expressions of mistake fixes in SMF 2.0 RC2 and RC3.
+ SMF compatibility: 2.0 Beta 4, RC1 to RC1.2 and RC4.
+ Languages: english_british, english_british-utf8 (copy of english).
+ Languages: spanish, spanish-utf8 (copy of spanish_es).
@ There is a version to be installed after "nCode Image Resizer" MOD 1.3-1.3.1.

1.2.1   2010-06-17
------------------
! Source code of img BBC tag.
@ There is a version to be installed after "nCode Image Resizer" MOD 1.3-1.3.1.

1.2     2010-06-14
------------------
+ Optional attributes in img BBC tag: rotateangle, rotatebgcolor, flip.

1.1     2010-05-11
------------------
+ Optional attributes in td BBC tag: colspan, rowspan.

1.0.1   2010-05-09
------------------
+ Languages: russian, russian-utf8, thanks to Bugo.

1.0     2010-04-29
------------------
+ Optional attribute style in BBC tags: hr, img, li, list, table, td, tr.
+ BBC tags (and buttons in the editing box) with style attribute: div, span.
+ SMF compatibility: 2.0 RC2 to RC3.
+ Languages: english, english-utf8, spanish_es, spanish_es-utf8, spanish_latin, spanish_latin-utf8.

Eliana Tamerin

Ambitious! I don't know when I might get around to installing this, but there are times when this would have been useful. Very nice mod, I hope it works smoothly and bugfree.
Do NOT PM me for support.

SimplePortal 2.3.6 is OUT!
SimplePortal Project Manager
Download | Docs
SimplePortal: Power of Simplicity!


Arantor

Nicely done, great to see you dealt with the other stuff too.

One question: were any tests made for XSS attacks? I can't remember if SMF attempts to sanitise bbcodes like that for XSS.
No good deed goes unpunished
All helpful urges should be circumvented

Bugo


davidhs

Quote from: Arantor on May 02, 2010, 05:18:24 PM
One question: were any tests made for XSS attacks? I can't remember if SMF attempts to sanitise bbcodes like that for XSS.
I do not  ???

Quote from: Bugo on May 02, 2010, 11:34:29 PM
Russian translation
Thanks!

Arantor

Fortunately, SMF does protect; I just tested for you.

XSS is where HTML is compromised by user input not being sanitised properly, such as trying to embed Javascript into the "" options provided.
No good deed goes unpunished
All helpful urges should be circumvented

davidhs

Quote from: Arantor on May 09, 2010, 05:15:16 PM
Fortunately, SMF does protect; I just tested for you.

XSS is where HTML is compromised by user input not being sanitised properly, such as trying to embed Javascript into the "" options provided.
Thanks.

New version:

1.0.1   2010-05-09
------------------
+ Languages: Add russian, russian-utf8, thanks to Bugo.

dannbass

Have you thought of putting html attributes also? the rowspan and colspan would be very helpful also.
Thanks for the mod!

davidhs

A great idea, thanks. (There is no colspan / rowspan in CSS).

Soon I will add it.

dannbass

I know, I know... it was just an idea to put colspan and rowspan... it's a pain to do that with tables...  to get it to where you can see the effect of colspan.
Thank you!

davidhs

May 11, 2010, 12:21:33 PM #11 Last Edit: May 11, 2010, 01:30:26 PM by davidhs
New version:

Legend:   ! Fixed   + Added   - Removed   * Changed   @ Note

1.1     2010-05-11
------------------
+ New optional attributes in td BBCode tag: colspan, rowspan.

dannbass

Great!!!! thank you for doing that so fast!! I'm going to test drive it right now!
Now I don't have to do things like this
[table]
[tr][td]
[table]
[tr][td][xxxxxxxxxxx][/td][/tr]
[/table]
[/td]
[td]
[table]
[tr][td][xxxxxxxxxxx][/td][/tr]
[tr][td][xxxxxxxxxxx][/td][/tr]
[tr][td][xxxxxxxxxxx][/td][/tr]
[/table]
[/td][/tr]
[/table]

davidhs

New version:

Legend:   ! Fixed   + Added   - Removed   * Changed   @ Note

1.2     2010-06-14
------------------
+ New optional attributes in img BBCode tag: rotateangle, rotatebgcolor, flip.

davidhs

New version:

Legend:   ! Fixed   + Added   - Removed   * Changed   @ Note

1.2.1   2010-06-17
------------------
! Source code of img BBCode tag.
@ There is a version to be installed after MOD nCode Image Resizer 1.3-1.3.1.

tRu3_sKiTz0

The rotate feature doesn't seem to work for me. I used your example and tested them all on my own forum and everything works except for the rotate image feature.

davidhs

The rotate/flip features are made with PHP (with CSS/JavaScript not is possible). If your forum is in a free server (for example) may not allow work with images in PHP.

This page made the rotate/flip (not use any function of SMF):
YOUR_FORUM/Source/Subs-BBCodeWithStyle-image.php
You can give the code to the server owner and ask that does not work.

This page have parameters:
YOUR_FORUM/Source/Subs-BBCodeWithStyle-image.php?image=url&rotateangle=nr&rotatebgcolor=color&flip=dir
For example:
YOUR_FORUM/Sources/Subs-BBCodeWithStyle-Image.php?image=http%3A%2F%2Fimg338.imageshack.us%2Fimg338%2F3980%2Funextrannoentrenosotros.jpg&rotateangle=45&flip=vertical

tRu3_sKiTz0

I'm not quite sure what you're getting at there. I'm sorry, I'm a nub, but I do not use a free hosting service or anything and I guess I will look into those other strings but could you post an example that works on yours so I can test it on mine. Maybe I'm just not using the bbcode correctly.

poolhall


davidhs

Quote from: tRu3_sKiTz0 on July 12, 2010, 08:14:57 AMI'm not quite sure what you're getting at there. I'm sorry, I'm a nub, but I do not use a free hosting service or anything and I guess I will look into those other strings but could you post an example that works on yours so I can test it on mine. Maybe I'm just not using the bbcode correctly.

For example, this show image rotate 15º with background red and flip vertical:
[img rotateangle=15 rotatebgcolor=red flip=vertical]http://img338.imageshack.us/img338/3980/unextrannoentrenosotros.jpg[/img]

Advertisement: