« For Developers: Embedding, JS, APIs

Custom <micr-io> attributes

You can customize your Micrio behavior by setting a range custom HTML attributes

You can specify additional options as attributes using the <micr-io> element.

Attribute Type Default value Description

General settings

lang string en The data language code to use
path string //b.micr.io/ For custom hosted Micrio images, specify the root URL like this
inittype string - Set this to cover to start the image using the full viewport
lazyload boolean false Set this to true to only start loading the image when it's been scrolled into the user's view, in case it's lower in a webpage.
skipmeta boolean false Do not load any metadata (markers, tours, etc)
static boolean false Simulate an <img/> element. No logo, loaderbar, and no event listeners

Camera controls

camspeed number 1 Set the speed factor for camera animations
zoomlimit number 1 Set this to the percentage (1=100%) of how far a user can zoom in to the image
elasticity number 1 The camera kinetic elasticity factor
view Array<number> 0,0,1,1 Set the initial viewport rectangle of the image (x0, y0, x1, y1 with coordinates as fractions)
focus Array<number> 0.5,0.5 Set focus point of the image, which is treated as the center in case of image overflows (x, y with coordinates as fractions)

User input

events boolean true If set to false, no event handlers will be set up and the image will be non-interactive
keys boolean false If set to true, you can use your keyboard to navigate through the image
pinch-zoom boolean true Use trackpad/touchscreen pinching for zooming
scroll-zoom boolean true Use mousewheel/trackpad scrolling for zooming
control-zoom boolean false The user must press CTRL/CMD when zooming with the mousewheel
two-finger-pan boolean false Requires the user to use two fingers to pan the image on touch devices
zooming boolean true If set to false the user cannot zoom at all
dragging boolean true Use dragging and touch events for panning

User interface

ui boolean true When set to false, no HTML UI elements will be printed
controls boolean true When set to false, no control buttons will be printed
fullscreen boolean true Show a fullscreen switching buttons on platforms that support it
social boolean false Show a social sharing link menu
logo boolean true When set to false, the Micrio logo will be hidden
toolbar boolean true When set to false, no top menu bar will be printed
show-info boolean false Show an image info panel with the title and description
minimap boolean false If set to true, an interactive minimap will be shown
minimap-hide boolean true If set to false, the minimap will always be visible
minimap-height number 160 Set the minimap height in pixels
minimap-width number 200 Set the minimap width in pixels


muted boolean If this attribute is present, all audio will be disabled
volume number 1 The general sound volume for music/sfx (between 0 and 1)
musicvolume number 1 If music was added to the image, play it at this volume (between 0 and 1)
mutedvolume number 0 If music was added to the image, fade it to this volume while other audio plays (between 0 and 1)
✉ Can't find what you're looking for? Contact us!