FANDOM



Export this template, then import, to install it.
Use edit summary: Copied from [[w:c:templates:Template:CSS image crop]] to properly attribute this template's editors.
This template is probably not already on your wiki.
Template documentation
Note: the template above may sometimes be partially or fully invisible.

View or edit this documentation. (How does this work?)

Editors can experiment with this template's sandbox and test case pages.

CSS image crop is a preview crop template

Purpose

This Preview Crop Template lets you create a crop of an image inline for previewing the look and feel of a page. If the edit is committed these crops should be replaced with server side cropped images to avoid sending extra image data to people.

Note: There was a previous glitch for which some people had to use "tleft" "tright" etc as a workaround because "left" and "right" did not work. As a result, to avoid having to fix all those pages that used the workaround, the template has been designed to function properly regardless of whether tright or right is used. See template talk for details.

Usage

{{CSS image crop
|Image         = The Name of the image.
|bSize         = The Base Image size (the image we are cropping on) 
|cWidth        = Crop Image Width in pixels
|cHeight       = Crop image Height in pixels
|oTop          = Offset Top in pixels
|oLeft         = Offset Left in pixels
|Location      = 'right', 'left', 'center' or 'none'. Determines placement of the image on the page.
                 Defaults to 'right' when description is provided (as is default for thumb images).
                 When description is blank, location on left (as is default for non-thumbs).
|Description   = Description (will render out using thumbnail class) 
}}

Examples

Dew image with center formating:

Example

[+] lower left of flower blossom
{{CSS image crop
|Image = Example.jpg
|bSize = 400px
|cWidth = 100
|cHeight = 100
|oTop = 200
|oLeft = 45
|Location = center
|Description = lower left of flower blossom 
}}

You may also omit the Location and Description parameters to get:

Example

{{CSS image crop
|Image = Example.jpg
|bSize = 400px
|cWidth = 100
|cHeight = 100
|oTop = 150
|oLeft = 100
}}


Wikipedia_small_logo_rounded.png

This page uses Creative Commons licensed content from Wikipedia (view authors).


Community content is available under CC-BY-SA unless otherwise noted.