Extension:CloudImage

Category:Extensions without a compatibility policyCategory:BSD licensed extensions
MediaWiki extensions manual
CloudImage
Release status: stableCategory:Stable extensions
Implementation Tag Category:Tag extensions
Description embed image directly from Flickr, OneDrive, Dropbox and others
Author(s) Kimagurenote (Corytalk)
Latest version 1.1.5
MediaWiki 1.35+Category:Extensions with manual MediaWiki version
PHP 8.0+
Database changes No
License BSD 3-clause "Modified" License
Download https://kimagurenote.net/kn/CloudImage#Download
https://kimagurenote.net/kn/CloudImage#History
Example https://kimagurenote.net/kn/CloudImage#Usage_%E4%BD%BF%E3%81%84%E6%96%B9
<cimg> <flickr>
Category:All extensionsCategory:Extensions not in ExtensionJson

The CloudImage extension provides a way to embed images directly from image hosting services e.g. Flickr, OneDrive, Dropbox, SlideShare, Speaker Deck, imgur and others via useful format like <img> tag.

Installation

  • Download zip file from author's website, unzip it and place the file(s) in a directory called CloudImage in your extensions/ folder.
  • Add the following code at the bottom of your LocalSettings.php file:
    /* Extension:CloudImage */
    wfLoadExtension( 'CloudImage' );
    /* (option) if you want to embed images from local server */
    $wgCloudImageAllowedDomains = [ "www.yourdomain.com", "wiki.yourdomain.com" ];
    
    /* (option) link target */
    $wgExternalLinkTarget = '_blank';
    
    /* (option) lazy loading */
    $wgNativeImageLazyLoading = true;
    
  • Additional configure if you want to use Extension:FlickrAPI (<flickr> tag) compatible mode.
  • Add the following code at the bottom of your MediaWiki:Common.css. You can fully customize it.
/* Extension:CloudImage */
IMG.cimg {
	max-width: 100%;
}
FIGURE.cimg {
	clear: both;
	margin: 2px;
	border: 1px solid #c8ccd1;
	background-color: #f8f9fa;
	font-size: 94%;
}
FIGCAPTION.cimgcaption {
	padding: 2px;
	text-align: left;
}
  • Yes Done – Navigate to Special:Version on your wiki to verify that the extension is successfully installed.

Note: You will need interface-admin permission to edit Common.css on MediaWiki 1.32 or above.

Usage

embed simply

Just embed a image simply. But not forgot to close the tag by "/>". For example:

<cimg src="https://example.com/image.jpg" width="600" />

Note: border="0" set automatically if not set.

embed with caption

You can specify some attributes similarly <img> tag.

You can use "href" to attach a hyper link on the image.

And you can write a comment below the image.

For example:

<cimg src="https://example.com/sample.jpg"
	href="https://example.com/"
	width="400" height="300"
	title="test image"
	alt="test image"
	framestyle="clear: right; float: right;"
	captionstyle="text-align: right;">
comment here
</cimg>

Special attributes using here.

  • framestyle - styles for <figure>
  • captionstyle - styles for <figcaption>

embed from Dropbox

You can embed Dropbox link of images directly. For example:

<cimg src="https://www.dropbox.com/s/9qwyhjuliy2whlu/18m4362_1920x1200.jpg?dl=0">[[w:Tadami Line|Tadami Line]] in winter</cimg>

embed from Flickr

You can embed images hosted on Flickr directly. For example:

<cimg src="https://www.flickr.com/photos/kimagurenote/26817918388/in/album-72157649433330773/">Photo from [[Flickr]]</cimg>
↓ embed an image from Flickr directly ↓

Configuration

Compatibility with Extension:FlickrAPI

This extension provides a tag <flickr> that has semi-compatibility with Extension:FlickrAPI for migration.

If you want to use this function, set the $wgCloudImageCompatibleFlickrAPI value above wfLoadExtension.

And set your Flickr API Key to $wgFlickrAPIKey. You can use same key as Extension:FlickrAPI.

/* Extension:CloudImage */
$wgCloudImageCompatibleFlickrAPI = true;
wfLoadExtension( 'CloudImage' );
$wgFlickrAPIKey = "(your api key set here)";

Note: This extension use Flickr API key with Extension:FlickrAPI (<flickr> tag) compatible mode only.

Object cache

This extension use MediaWiki Object cache mechanism for saving to call Flickr API (exclude oEmbed).

If you use Extension:FlickrAPI compatibility mode, we recommend to set $wgMainCacheType.

And if you want clear the cache, set the value on LocalSettings.php and reload the image.

$wgCloudImageCachingTime = false;

Note: Purge not affect this extension.

Sites limitation

You can embed images from Flickr, OneDrive, Dropbox, Google Drive, SlideShare, Speaker Deck and imgur only by default.

And you can add other sites if you want.

$wgCloudImageAllowedDomains = [ "www.example.com", "image.example.net" ];

Note: This variable is changed in v1.1.4. Former format is no longer recommended.

Attributes limitation

You can use attributes 'width', 'height', 'class', 'style', 'title' and 'alt' only by default.

And you can add other attributes if you want.

e.g. add 'id'

$wgCloudImageAllowedAttrs[] = 'id';

Or you can overwrite this variable if you want to restrict some attributes.

e.g. restrict 'class' and 'style'

$wgCloudImageAllowedAttrs = [ 'width', 'height', 'title', 'alt' ];

Note: Attributes values must set lower-case letters.

This extension refer the $wgExternalLinkTarget value.

$wgExternalLinkTarget = '_blank';

Lazy loading

This extension support to use lazy loading mechanism since v1.1.5.

You can set $wgNativeImageLazyLoading in LocalSettings.php if you want to use this function.

$wgNativeImageLazyLoading = true;

Note: This parameter supported since MediaWiki version 1.34.0.

Timeout

This extension timed out 60 seconds by default to call Flickr API.

We recommend to set shorten "default_socket_timeout" on php.ini as possible.

But Flickr oEmbed calling only, timed out 2 seconds by default.

And you can change it as follows.

$wgCloudImageFlickrTimeout = 1.5;

Custom tag

You can use another tag e.g. <img> as alias.

If you want to use this extension with <img>, set the value above wfLoadExtension.

/* Extension:CloudImage */
$wgCloudImageTag = "img";
wfLoadExtension( 'CloudImage' );

Notice

SlideShare (oEmbed), Speaker Deck (oEmbed) and imgur support are experimental.

This extension has some privacy risk. Use only at private site! For details see here: Manual:$wgAllowExternalImages#Why disallow external images?

See also

Category:Image extensions Category:Flickr extensions
Category:All extensions Category:BSD licensed extensions Category:Extensions not in ExtensionJson Category:Extensions with manual MediaWiki version Category:Extensions without a compatibility policy Category:Flickr extensions Category:Image extensions Category:ParserFirstCallInit extensions Category:Stable extensions Category:Tag extensions