ComboStrap UI - Image

1 - About

image is a block UI Component that permits to show images in your pages.

3 - Syntax

ComboStrap uses the same syntax than Dokuwiki


{{[ ]path?widthxheight[ ]}}

where:

  • path is:
    • for an internal image: the internal path of the dokuwiki
    • for an external image: the URL.
  • [ ] are optional spaces that indicates the alignement of the image (left or right)

4 - Example

4.1 - Resize to given width

  • Internal image

{{wiki:dokuwiki-128.png?200}}

  • External Image

{{https://secure.php.net/images/php.gif?200}}

4.2 - Resize to given width and height

  • Internal image

{{wiki:dokuwiki-128.png?200x50}}

  • External Image

{{https://secure.php.net/images/php.gif?200x50}}

4.3 - Elevation

You can style even further your image with styling element such as elevation.

For instance, to elevate this photography with a surfer, you could use this syntax.


<box elevation="high" align="center" width="fit-content">
  {{:ui:stock_image_surfer_in_the_see.png?600|}}
</box>

Powered by ComboStrap