Built-in Feature

[thumbnail:123] will insert the attached image file having ID 123 as a thumbnail, typically a smaller image floating left or right of the main text.

The inline [thumbnail:] tag is a placeholder inserted in the content to be replaced by a thumbnail image when the post is displayed. That image must be already uploaded to the server and attached to the post. It can also be manually typed in the content by following the required syntax.

See also: [image:] Short Tag and [inline:] Short Tag.

Syntax Breakdown

[thumbnail: Link ID [ : Size [ : Alignment [ :. Class ] ] ] ]

Available in an upcoming release [thumbnail: Link ID [ : HRef ] [ : Size [ : Alignment [ :. Class ] ] ] ]

TODO [thumbnail: Link ID [ : Alt text ] [ : HRef ] [ : Size ] [ : Alignment ] [ :. Class ] ]

TODO Several params are optional. You can either skip them by leaving them empty (::) or you may skip them completely because the next param will be recognized by its specific content.

• Link ID : ID of an attached image to the current Item. This is a number that is automatically created when you attach an image to a post in the Item Images & Attachments Panel. The tag will not be rendered in the following cases:
  • If an invalid ID is provided
  • If the ID refers to a file that is not an image
  • If the ID refers to an image but that image is assigned to any display position other than "Inline".
• Available in an upcoming release Alt text : By default, the image will be displayed with the Alt text that has been entered in the File properties of the linked File. This parameter of the short tag allows you to:
  • Override the default Alt text by explicitly specifying one here

  • Not display any alt text by specifying -

    Note: if the alt text param you specify starts with a . it will be considered to be a class name (see below),
    if it looks HRef like http://... or ((slug-name)) it will be considered to be a HRef (see below).
    The Alt text cannot be a single word like small, medium, large, left or right because in that case b2evolution will consider this to be the Size or Alignment param.
• Available in an upcoming release HRef : By default, the image will link to the original file on disk, which will display a Lightbox / Colorbox in most skins. This parameter allows to override this href= URL in 3 different ways:
  • http://... or https://...
  • ((slug-name))
  • (()) : means : no link.
• Size : small, medium or large (If omitted, the default is medium)
• Alignment : left or right (If omitted, the default is left)
  • TODO inline : do not float the thumbnail (unless you specific some CSS classes that do special floats).
• Class : can be any CSS class name. The class name must start with a dot. Multiple class names can be specified, separated by a dot. See: Common Helper CSS Classes You may add your own classes.

Samples

• [thumbnail:123]
• [thumbnail:123:small]
• [thumbnail:234:medium:right]
• [thumbnail:345:large:left:.redborder]
• [thumbnail:456:medium:right:.redborder.squared]