Documentation
Image
Type: image
Editable: false
Tags: figure
, div
, p
If the figure
, div
, or p
tags contain an image with the img
tag and nothing else, so that tag will become a image
block.
<p><img ...></p>
<div><img ...></div>
<figure>
<img ...>
<figcaption></figcaption>
</figure>
If the image is surrounded by a link, it will also work.
<p><a href=""><img ...></a></p>
properties #
The image block has the following properties:
- alt (image alt text)
- link (url of image link)
- target (true or false, image link target)
- caption (caption text if image inside figure tag)
You can get/set properties with getData/setData methods.
var instance = this.app.block.get();
var data = instance.getData();
instance.setData({
alt: 'alt-text',
link: 'link-url'
});
getImage #
Returns the image DOM element.
var instance = this.app.block.get();
var $img = instance.getImage();
getSrc #
Returns the image url.
var instance = this.app.block.get();
var src = instance.getSrc();
getAlt #
Returns the image alternative text.
var instance = this.app.block.get();
var alt = instance.getAlt();
getLink #
Returns the image link DOM element.
var instance = this.app.block.get();
var $link = instance.getLink();
getLinkUrl #
Returns the image link url if it exists.
var instance = this.app.block.get();
var url = instance.getLinkUrl();
setImage #
Sets src and optional ID to the image.
var data = {
url: 'image-url.jpg',
id: 'image-id' // optional
};
var instance = this.app.block.get();
instance.setImage(data);
setAlt #
Sets alternative text to the image.
var instance = this.app.block.get();
instance.setAlt('alt-text');
setLinkUrl #
Sets link to the image block.
var instance = this.app.block.get();
instance.setLinkUrl('link-url');
removeLink #
Removes link from the image block.
var instance = this.app.block.get();
instance.removeLink();