Differences

This shows you the differences between two versions of the page.

--- doc:plugins:bbcode [2026/02/22 22:40] – [Images] rainerbielefeld
+++ doc:plugins:bbcode [2026/02/28 19:12] (current) – added a little more description of attributes arvid
@@ Line 1: / Line 1: @@
 ====== BBCode Plugin ======
-===== What is BBCode ? =====
+===== General =====
 BBCode is a simple-to-understand markup language. See: [[wp>BBCode]]
+The plugin provides a variety of different elements, called tags. For example, there are tags for headlines, text formattings, links, images, and so on.
+Many tags have attributes that modify the behaviour of the tag (such as the "width" and "height" attribute of images that define the dimensions the image is displayed with). Attribute values are set in double quotes: %%[tag attribute="value"]%%\\
+//(In fact, if the value does not contain blanks, you could go without the quotes - we recommend always to use them.)//
 ===== Available Tags =====
@@ Line 21: / Line 26: @@
   * [u]underlined[/u]
   * [del]strike-through[/del]
-  * [size=80%]smaller[/size] or [size=120%]bigger[/size] text
+  * [size="80%"]smaller[/size] or [size="120%"]bigger[/size] text
-  * [font=FONT]font[/font]\\ //FONT is a valid css font-family value ("sans-serif", "Times" etc.)//
+  * [font="FONT"]font[/font]\\ //FONT is a valid css font-family value ("sans-serif", "Times" etc.)//
-  * [color=COLOR]color[/color]\\ //COLOR is a valid css color value (e.g. #cb0600)//
+  * [color="COLOR"]color[/color]\\ //COLOR is a valid css color value (e.g. #cb0600)//
     * Pickers to get the codes: for example [[https://redketchup.io/color-picker|RedKetchup Color Picker]] or [[https://www.w3schools.com/colors/colors_picker.asp|W3schools]]
 ==== Links ====
   * Simple: %%[url]DESTINATION[/url]%%
-  * Advanced: %%[url=DESTINATION (rel=relationship) (target=target)]Link text[/url]%% \\ //(items in parenthesis are optional, when you use those items you have to leave away the parenthesis!)//.
+  * Advanced: %%[url="DESTINATION" (rel="relationship") (target="target")]Link text[/url]%% \\ //(items in parenthesis are optional, when you use those items you have to leave away the parenthesis!)//.
     * **DESTINATION** may be:
       * an external URL: %%"https://www.example.org"%%
@@ Line 36: / Line 41: @@
     * **target** (available as of FlatPress 1.3) specifies where to open the linked document (see [[https://www.w3schools.com/TAGS/att_a_target.asp|doc on W3Schools]])
   * Simple email link: %%[mail]user@example.org[/mail]%%
-  * Advanced email link: [mail=user@example.org]link text[/url]
+  * Advanced email link: [mail="user@example.org"]link text[/url]
 ==== Images ====
-  * [img=IMAGEPATH (alt=alternate text) (title=title text) (popup=false) (scale=NN%) (width=N) (height=N) (float=left|right) (loading=lazy|eager)] \\ //(items in parenthesis are optional, when you use those items you have to leave away the parenthesis!))//.
+  * [img="IMAGEPATH" (alt="alternate text") (title="title text") (popup="false") (scale="NN%") (width="N") (height="N") (float="left"|"right") (loading="lazy"|"eager")] \\ //(items in parenthesis are optional, when you use those items you have to leave away the parenthesis!)//.
      * if **IMAGEPATH** begins with images/ it will be automatically translated into the appropriate URL for fp-content/images/
      * **alt** sets the alternate text
-     * **title**: title shown on mouse-over. Since FlatPress 1.4.1 the Title Text additionally will be shown as Caption below the Image. **Problem**: Currently only a single word Title Text will be shown, text behind first Blank will be cut. **Workaround**: Instead of a blank use //Non-breaking space//! Input (Windows) with numeric keyboard <Alt>+0160. Alternatively you can type "&nbsp;" instead of the blank in the Tag. If you want to allow Line Breaks, you have to add a //Blank without Space// behind the //Non-breaking space//: type <Alt>+8203 with (Windows) numeric keyboard.
+     * **title**: title shown on mouse-over.
      * **popup** If set to true and the //LightBox2// plug-in is enabled (it is by default) display of the image will driven by the plug-in. (Actually the plug-in is the LightBox work-alike [[http://www.digitalia.be/software/slimbox|Slimbox]]).
      * **scale** creates a thumbnail NN% smaller than the original. Example: [img=images/picture.jpg scale=5%]
@@ Line 55: / Line 60: @@
 ==== Videos ====
-  * [video=VIDEOPATH (width=N) (height=N) (float=left|right)] \\ //(items in parenthesis are optional, when you use those items you have to leave away the parenthesis!))//.
+  * [video="VIDEOPATH" (width="N") (height="N") (float="left"|"right")] \\ //(items in parenthesis are optional, when you use those items you have to leave away the parenthesis!))//.
     * **VIDEOPATH** may be:
       * an uploaded file: %%"attachs/video.mp4"%%
@@ Line 67: / Line 72: @@
 ===== BBCode from other standard plugins =====
   * [more] ([[doc:plugins:standard#readmore|Read More plugin]]): breaks up long post on the main page with the [Read More…] link that can be clicked on to see the rest of the post
-  * [entryurl=ENTRY-ID]link text[/entryurl] and [iurl=PAGE]link text[/iurl] ([[res:plugins:internalurls|Internal URLs plugin]]): These elements create links to static pages or entries.
+  * [entryurl="ENTRY-ID"]link text[/entryurl] and [iurl="PAGE"]link text[/iurl] ([[res:plugins:internalurls|Internal URLs plugin]]): These elements create links to static pages or entries.