|
Click here for the code...
Copy to clipboard
Note: click on image or button to enlarge |
Click here for the code...
Copy to clipboard
Note: mouse over or tap (on touch devices) image to bring up a popup |
Click here for the code...
Copy to clipboard
Note: random image picked from a file gallery with styled frame |
Below are the parameters for this plugin, categorized into tabs:
This code:
{img attId="39" imalign="right" link="https://tiki.org" alt="Panama Hat"} This text after the img code will nevertheless be on the left because the image is right aligned. The text will also wrap around the image since the ''imalign'' parameter "floats" the image.
Would produce this on this site:
This text after the img code will nevertheless be on the left because the image is right aligned. The text will also wrap around the image since the imalign parameter "floats" the image.
The target of the link will always be "_blank".
This code:
{img attId="57|58|59" desc="desc" alt="Sample Images" thumb="y" stylebox="float: left; margin-right:10px"}
This might not be possible with all versions earlier than Tiki 4.
Would produce this on this site:
Below is an example of using a thumbnail image (apples) that is different than the image brought up when the thumbnail is clicked (oranges):
{img attId="57" thumb="y" link="tiki-download_wiki_attachment.php?attId=58&display" rel="box[g]"}
Would produce this on this site:
Below is an example of using a thumbnail image (apples) that enlarges when moused over:
{img attId="57" thumb="zoom"}
Would produce this on this site:
Add the parameter thumb="zoombox"
. Then you will be able to get image magnification, when the source image is bigger than the size shown on screen. Full size image appears with zoom option in a "Colorbox" overlay when thumbnail is clicked.
Below is an example of using a thumbnail image (pears) that enlarges in the Colorbox modal overlay:
{img src="img/wiki_up/393px-Pears.jpg" thumb="zoombox"}
Would produce this on this site:
This S5 slideshow engine in Tiki (see PluginSlideShow) resizes and relocates images automagically by deafault, in order to allow quickly show content, and a small thumbnail of the image at the upper right corner of the slide.
If you prefer to have the image shown at its original size and position, you can add the parameter class="fixedSize"
to your img
call. Example:
This code would show the image as a small thumbnail in the upper right corner of the slide: Copy to clipboard
|
|
But this code would allow the image to be shown at the original size of 500px and at the same position where this code was written. Copy to clipboard
|
A parameter was added to facilitated integration with Social Network application.
To tell open graph what is the featured picture to be used in a post, story, etc...(and may be something different for twitter) you can use the "featured" parameter.
{img type="src" src="display2228" alt="TikiFest Virtual 2021 banner" featured="y"}
Added in Tiki18. See Multi-resolution images
When the SEFURLs feature is enabled you can enter "displayID" (where ID is the number of the image in the File Gallery) in the image source field (the src
param).