Help talk:Images

Updates sorely needed for modern web design

edit

Are there major barriers to adding support for min-width and max-width as template parameters, or the ability to specify width parameter as a percentage value, or adding inline styles? The current setup is not ideal for rank and file editors wanting to add responsive imagery to pages, as it requires applying a class and hoping their wiki's Bureaucrats have installed TemplateStyles or the #CSS parser function. Something like e.g. applying max-width:100% to images and sizing images appropriately for a range of viewport widths is such a basic/best practice of modern web design that editors shouldn't have to rely on extensions and parser functions that aren't enabled by default to be able to apply it to an image on the fly when a bit of inline CSS can get the job done.

Relatedly, I'm not sure if this is something that WikiTide has implemented differently than the WikiMedia, but on our WikiTide site the class parameter is not inserted on the img tag as indicated by this Help documentation. Instead, it's added to a figure tag two levels up in the hierarchy, so CSS has to target figure.classname > a > img instead of just img.classname. If this isn't a WikiTide thing then it would save some future folks a bit of frustration and troubleshooting if the documentation could be updated to reflect this.

I'd be happy to donate some time to working on this if the only obstacle is just that nobody has stepped up to do it, but I'm not quite sure how improvements to core functions like this are proposed and decided. Emikoala (talk) 22:16, 6 February 2024 (UTC)Reply

edit

Is it possible to use the Template:Unc inside an image's Link behavior?

Align an external image

edit

How can I do to align a external image ? If I put the URL the pics display where the text is. I can't align the image to the right for example :( Somebody can help me ?

edit

If the image referenced does not exist, the gallery displays the filename as text rather than a link to the upload page (as it did in previous versions). I have tried the File, Image and Media prefixes. Is this a bug?

FIX: Most likely cause is upload permissions have not been set. In LocalSettings.php set $wgEnableUploads = true;

Syntax section lacking. "Link" option not operational.

edit

I was just trying to determine how to wrap an image in a link to another article. After reading the (limited) syntax section, I attempted to use the "link=" option to gain this functionality. After many test efforts, on this page, and using the Preview function (so as not to flood the history), I am still yet to achieve this goal. Is this article still current? Are the instructions clear and accurate? Or it is a problem at my end causing this issue? --203.13.128.101 06:48, 21 October 2008 (UTC)Reply

See Help:Linked images. Note that the link= parameter is very new. Check Special:Version, if the revision is not at least r41727 then this syntax is not yet available. Splarka 11:29, 21 October 2008 (UTC)Reply
I am also having the same issue that was mentioned, regarding the link functionality not working. I have a fully updated install, version 1.13.3. I'm using the provided syntax, as far as I can tell, but the image will only link to the standard image details page. Caseyparsons 17:45, 9 February 2009 (UTC).Reply
r41727 means 1.14. —Emufarmers(T|C) 01:05, 10 February 2009 (UTC)Reply

Text wrap?

edit

How do one make tex wrap arround an image? --Asset 11:27, 30 November 2008 (UTC)Reply

That's what I came here to read about too. I can scarcely believe that two years later this still isn't addressed in the article. Magnoliasouth 03:52, 26 October 2010 (UTC)Reply
I don't know if it is possible to do so. Do you have an example of what you want to do? Bud0011 04:08, 26 October 2010 (UTC).Reply
It's possible. Embed your image the usual way and add an alignment value. Example: [[Image:example_image.jpg|left]] The text following the image will now flow around it . Echolalian (talk) 16:45, 6 September 2012 (UTC)Reply

new File: NS

edit

Should be noted that if you're using SVN, or editing on the wikimedia projects, that the namespace for "images" is File: now, not Image: . TBH, this makes more sense to me for what's now available on the projects ;).

Kjikaqawej 06:41, 13 December 2008 (UTC)Reply

It also looks like the File NS is case sensitive for the "F". On my MW 1.15.1 lower case f doesn't link correctly, but the depreciated Image NS used to work with "image". DdDave 20:15, 10 November 2009 (UTC)Reply

Large Images

edit

I can upload small images but when I upload images, files over 2mb; it just goes blank. When I resize it won't resize. Can someone help me. 86.136.108.50 17:39, 19 February 2009 (UTC)Reply

Is it possible that your PHP configuration is limiting uploads of this size? I have this vague memory of getting "blank" pages when PHP didn't allow large enough uploads. That's all I can think of without more specific information about your problem. --Vjg 00:15, 27 February 2009 (UTC)Reply
That's why I can't upload large files because the PHP configuration is limiting it. What do I have to do? 86.136.108.50 09:54, 8 March 2009 (UTC)Reply
That would depend upon how your PHP is configured and the requirements might change depending upon who is hosting your PHP-enabled site. See http://us3.php.net/manual/en/ini.core.php#ini.upload-max-filesize --Vjg 13:46, 8 March 2009 (UTC)Reply
Thank you for the info. I have another query, basically on my main page i have a picture as a title. I don't want it to link anywhere, can I stop that? is it possible. 86.136.108.50 16:03, 8 March 2009 (UTC)Reply
Use Media instead of Image or File; otherwise see the new 'link=' syntax for "File". Also, these types of questions should be asked on the helpdesk as indicated at the top of this page. --Vjg 03:29, 9 March 2009 (UTC)Reply

Help:Images/frame and Help:Images/size

edit

When importing this help page on my wiki, the {{/frame|frame [...] were interpreted as Template:/frame. I had to add change them to {{Help:Images/frame|frame [...] to make it work. Any idea why ?--Alagache 15:06, 24 February 2009 (UTC)Reply

Subpaging is enabled on the Help: namespace here. This can change the behavior of relative transclusions. See Manual:$wgNamespacesWithSubpages. Splarka 16:18, 25 February 2009 (UTC)Reply

Page breaking

edit

I'm just setting up a wiki, I turned on subpages for the help namespace as said above, is there anything else I need to turn on to stop it looking like this? http://www.suitableforvegetarians.info/wiki/index.php?title=Help:Images

Just glancing at your site, it appears you are missing the Extension:ParserFunctions extension and the Template:! template on your installation. --Vjg 21:27, 10 March 2009 (UTC)Reply
edit

I am trying to use the gallery function.

I've upload the pretty flower pic to my mediawiki and I've kept it named Example.jpg, but I can't get image to appear when I copy the code from: Help:Images#Gallery of images

This code:

<gallery>
File:Example.jpg|Item 1
File:Example.jpg|a link to [[Help:Contents]]
File:Example.jpg
File:Example.jpg
File:Example.jpg| ''italic caption''
File:Example.jpg|on page "{{PAGENAME}}"
</gallery>

Gives me text in all of the right places, but no images.

When I change the text from “File:Example.jpg” to “Image:Example.jpg” images appear.

am I not supposed to use “File” or is there a parameter that I need to set? --TheMightyHercules 02:10, 4 April 2009 (UTC)Reply

Image: was only recently changed to File:, if it doesn't work for you, you just have to use Image:. Splarka 07:30, 4 April 2009 (UTC)Reply

Faking a "thumb" with alt "link"

edit
 
Real "thumb" syntax.
 
Fake "thumb" syntax.

This often gets asked for a lot. A way to use the link= parameter with thumb. permalink

[[Image:Wiki.png|thumb|100px|Real "thumb" syntax.]]
<div class="thumb tright"><div class="thumbinner" style="width:102px;">
[[Image:Wiki.png|border|100px|link=MediaWiki|foo]]<div class="thumbcaption">Fake "thumb" syntax.</div></div></div>

Splarka 03:24, 29 April 2009 (UTC)Reply

Also good for aligning objects, like videos.

edit
  • This example assumes you have the VideoFlash extension installed:
<div class="thumb tright"><div class="thumbinner" style="">
<videoflash>nGeXdv-uPaw</videoflash><br />
<div class="thumbcaption">[http://youtu.be/nGeXdv-uPaw She's Alive... Beautiful... Finite... Hurting... Worth Dying for.]</div></div></div>

- Davydog 19:55, 9 August 2011 (UTC)Reply

Wording question

edit

Can we add the word "scale" somewhere in addition to "resize?" That would help more searches find the resize examples. Thanks.

129.93.159.31 21:23, 1 May 2009 (UTC)Reply

External Image Size

edit

Is it possible to resize an external image? E.g. [[http://www.url.com/example.image|20px]] --Robinson Weijman 07:58, 8 July 2009 (UTC)Reply

yes with the extension:EmbedImg Bigbull 01:52, 4 September 2011 (UTC)Reply
edit

can i ask here if ther is a way of showing a small image as the alternate way of rolling over text links

w:en:User_talk:Teapotgeorge#hello

Image Strangeness

edit

The stable page shows red links to "File:MediaWiki:Image sample" (deleted) instead of the inlined "File:Example.jpg" for me, and I don't really know why. Draft works for me again. --130.83.160.141 14:41, 17 August 2009 (UTC)Reply

Frame transparancy

edit

How do I make the frame transparent to a background image. For instance, on this page the preformatted text and the TOC (yes, I know they are not images, but the problem is the same) are not transparent to the background, yet the MediaWiki logo image is. The Template on Help:Images likewise is not transparent to the background image. Any advice on how I can make the background image bleed through? RedJ 17 18:07, 22 August 2009 (UTC)Reply


TOCs, tables, and image frames are intentionally given background colors to prevent header lines bleeding through. You can remove them with site/skin CSS, or just give images your own frame with whitelisted html (<div>s), or just don't use a frame (per example). Splarka 07:34, 23 August 2009 (UTC)Reply
The problem with not using a frame is that it also won't show the caption. My wiki has a gradient background in the text space, so it's not like putting the same color as as the image frame backgound (at least I don't think so). The text space background gradient has to show. RedJ 17 17:17, 23 August 2009 (UTC)Reply
In your MediaWiki:Common.css:
div.thumbinner {background-color:transparent;}
div.thumb {border-color: transparent;}
But it will look bad in some browsers, probably. Splarka 07:23, 24 August 2009 (UTC)Reply
Thanks, I'll try it. I also found a work around using templates which essentially rewrites the Image functionality. But CSS would be more elegant.
edit

Hi, without magic is ok and you can use un magic word in the caption but not in the link.

  • Example : [[File:truc.png | link = http://www.truc.com/‎{{PAGENAME}} | {{PAGENAME}}]] -> the link is truc.png :(
Works for me:
 
But you have a U+200E LEFT-TO-RIGHT MARK in your pasted example between the URL and the magic word. Also, are you sure you're using a new enough version of mediawiki? Splarka 07:33, 15 September 2009 (UTC)Reply
Ok without space link is working.
edit

With [[File:truc.png||link=‎{{1|}}]] link doesnt work(parameter is not empty and there are no spaces)...How I can debug that ? thanks

[[File:Wiki.png|20px|link={{{1|}}}]] ->  
Template parameters take 3 braces, and the syntax you use there means null fallback, and all a null link= does is prevent the image linking anywhere at all. And you are still inserting a U+200E LEFT-TO-RIGHT MARK in just before the first brace. Splarka 06:57, 19 September 2009 (UTC)Reply
yes my paste is bad it was [[File:Wiki.png|20px|link={{{1|}}}]] . But I cannot see the U+200E LEFT-TO-RIGHT MARK and the version of my mediawiki is 1.15.1. Can I remove myself this invisible mark and how ? Thanks.
Ok I saw with notepad++ but again it doesnt work the link=http is now tn the caption of the picture.
Ok I found; it's my fault ;) Thanks!

Problems with image+link+caption

edit

Hi there , i have a big problem with the imagelink and captions for image link on version 1.15.1. in your help it means

[[File:test.png|link=www.wiki.org|Caption]] 

for an Imagelink with caption, i look in to the html source and see no title parameter in the a href of the image link.
The expample on this page has in the html source an title paramter but i dont know how it makes. Its a little bit tricky here to come to the orginal source of the example. mean it is framed and framed. Why ?
Anyone can help thats i become a title tag in an imagelink?
  Look here it works on this version of mediawiki but on my version it gives no title paarameter on a href.

I've the same problem; I guess it's a bug in MW 1.15.1. Hajo

I also have the problem in 1.15.3 that no "title" is in HTML code when use "link=http://...". I'm trying to work it out but with no confidence. I also want the link to be "target=_blank" when the url does not belong to my domain name. --Zayoo 12:05, 15 May 2010 (UTC)Reply

I've made it!

in file include/MediaTransformOutput.php line 160 of function toHtml

159		if ( !empty( $options['custom-url-link'] ) ) {
160			$linkAttribs = array( 'href' => $options['custom-url-link'] );

change line 160 to

			$linkAttribs = array( 'href' => $options['custom-url-link'], 'title' => $title );

then title appear. To make "target=_blank" for url that not belongs to site's domain name, change to this

			if (!strpos($options['custom-url-link'], $_SERVER['SERVER_NAME'])) {
				$linkAttribs = array( 'href' => $options['custom-url-link'], 'title' => $title, 'target' => '_blank' );
			} else {
				$linkAttribs = array( 'href' => $options['custom-url-link'], 'title' => $title );
			}

Warning: I don't know whether title should be encoded or not for security. USE AT YOUR OWN RISK. --Zayoo 14:15, 15 May 2010 (UTC)Reply

This bug seems to be fixed in 1.16.0. To make external link open in new window in 1.16.0, the code above is also valid by removing 'title' => $title . -Zayoo 08:46, 2 September 2010 (UTC)Reply

Black Images after Update

edit

Hey - I have recently updated to 1.15.x. Now I have black images on all pages, see here: http://freecoffee.de/Eduroam_mit_Windows_Mobile I found out, that I have to user ?action=purge to clear the cache. I also truncated the objectcache table. The first solution works for a single page. But I have a lot of images uploaded to the wiki. So, is there a faster way to clear the image cache? Thanks in advance, kind regards --Nickaat 17:43, 11 January 2010 (UTC)Reply

edit

Can it be done? I've got my gallery set up like the example:

<gallery>
File:Example.jpg|Item 1
File:Example.jpg|a link to [[Help:Contents]]
File:Example.jpg
File:Example.jpg
File:Example.jpg| ''italic caption''
File:Example.jpg|on page "{{PAGENAME}}"
</gallery>

but in addition to the text underneath each image, I would like to have a second set of text when each image is moused over. (null).exe 14:21, 21 January 2010 (UTC)Reply

edit
[[Media:image.jpg]]

creates a text link directly to the image bypassing the file description page but I would like to create a thumbnail link that bypasses the description page and goes directly to the image. I've tried every conceivable combination of options but nothing seems to work.

Use: [[Image:Wiki.png|link={{filepath:Wiki.png}}]]
 
Hamilton Abreu 23:19, 12 February 2010 (UTC)Reply

Is it possible to make this as a default link type for all images? Or at least is there a way to avoid entering same filename in filepath?

I strongly agree, we need the option of changing the default behaviour of image thumbnails so they conform to more general internet behaviour. Normally on a webpage, if you click a thumbnail preview, you expect to go to the full-size version of an image, not a description page. I understand the need to be able to access the description page somehow, but users can do this by clicking the little special icon that appears under the thumbnail that sends them to the special page.
Wikimedia's "rogue" behaviour screws up external search engine search results - since MediaWiki's description page for a .jpg file also ends in .jpg, Google et al tend to see the thumbnail, see that it points to an address that seems to be a .jpg file, and don't bother loading or analysing the "fake" jpg file on the offchance that it's actually another webpage ... so they don't realise that it's not actually a .jpg .
Worst-case scenario, the description page doesn't get indexed by standard search engines (because it's named like an image file), the image-indexing databases that get passed the URL of the description page realise as soon as they load it that it's not an image, so they don't analyse it either, the mid-sized preview on the description page also doesn't get indexed (because the page that contains it isn't being read, by anyone), the full-size image doesn't get indexed either (because there's no direct link to it from any "proper" page), and although the thumbnail does get indexed, it gets flagged as pointing to a broken image link. So you spend time loading lovely big high-res images onto your wiki, stuffed with lovely search-engine-friendly metadata, and the search engines simply don't get to see the files to list them (or they only see the tiny low-res thumbnails, which don't inherit the metadata). Sigh.
For individual thumbnails you can override this on a thumb-by-thumb basis by manually putting in a link= property, or you can create your own template that replaces the "File:" syntax with your own, and make the resulting thumbnail link point directly to the original file (and suddenly see your big images appearing on Google :) ), but this doesn't help with the Gallery (unless you write your own replacement from scratch), and it's no use at all for MediaWiki's auto-generated thumnbnail galleries for media assigned to particular categories, which there seems to be no way to override. If I have a wiki on Medieval Art, I want the option of allowing Google to read all the images at high res (along with their metadata), and registering all those images for each category page that they appear in.
Currently, in order to guarantee that Google can see all our files in their original resolution, with all their embedded metadata, it seems that we have to write a special additional html page with a special bit of code to automatically index the files, and link to that external page from our wiki, and hope that Google then associates the thumbnails on the wiki pages with the full files in the separate index, by visual similarity. This is hardly ideal. Yes, MediaWiki does generate special thumbnail index pages that do link directly to the original files, but MW also helpfully generates a NOINDEX tag in those pages' headers that tells Google specifically NOT to index the contents, so the "Recent files" and "All files" paes can't be read by search engines as a global site image list, either. Aaargh!
The three main methods by which a search engine would index the image contents of a wiki all seem to have been "broken" by MediaWiki - if they'd only broken two out of the three, we'd be okay, but they broke all three of them! Being able to globally override the default thumbnail behaviour (to provide a "clean" path that Google can follow to find the original images, and associate them with the appropriate article and category pages) would go a long way to fixing the problem. ErkDemon (talk) 22:29, 5 August 2013 (UTC)Reply
If you're really concerned about this, you should report a bug in bugzilla (if none already exists) --Ciencia Al Poder (talk) 09:28, 6 August 2013 (UTC)Reply
That's a useful suggestion - thanks. I've just added it as https://bugzilla.wikimedia.org/show_bug.cgi?id=52647 ErkDemon (talk) 12:29, 8 August 2013 (UTC)Reply

Captions not displaying

edit

The Help page says that adding text in an image link that's not in any of the other formats will be interpreted as a caption. It implies but does not explicitly say that the caption will show on the page. And, in fact, the caption does display in the "thumb" and "frame" options. However, in "frameless", "border" or omitted, the caption is apparently not presented. It doesn't even show up in the HTML pagesource.

I've submitted a Support desk request in case it's a technical issue but given that I am seeing this problem even on the example images here, I suspect that it's something more. If I am misunderstanding the intent of the comments about captions, could someone please correct them?

Or if it's a known bug based on something like browser versions, could someone please add a compatibility comment? Anything to clear up the confusion would be appreciated. Rossami 23:52, 24 May 2010 (UTC)Reply

This might be simply a terminology issue. With "thumb" and "frame", you do get an actual image caption on the page, just below the image. With omitted, "frameless" and "border" there is no actual image caption on the page, below the image, but it shows up when you place the pointer over the image:
[[Image:Wiki.png|caption text here]] 
[[Image:Wiki.png|frameless|caption text here]] 
[[Image:Wiki.png|border|caption text here]] 
You might know this form of caption as "alt" or "title" or something else. Would this be the case? Hamilton Abreu 00:28, 25 May 2010 (UTC)Reply
Hmmm. If that's how it's actually supposed to behave then I would agree that it's a terminology problem that the text on the Help page doesn't help. I've seen the HTML title attribute used in several ways but never automatically tied to the mouseover. "Alt" is, I believe, different in that alt text is supposed to display when the image is not available (such as when the image is suppressed or still loading). Either way, calling those "captions" is counter-intuitive. The only ones that are behaving here the way that we think of captions in other media are the ones with thumb and frame.
My confusion was made worse by the section of the Help page which 1) describes alt and caption differently, 2) never uses the word "title" but if it had, my natural assumption would have been that title referred to "page title", that is, "filename" and 3) explicitly says that caption can accommodate wiki-markup (which it can with thumb and frame but not in the mouseover of border, frameless or omitted).
Then just to increase my confusion, the mouseover does not display on my work computer (IE 7.0), though it does at home (Firefox 3.6 and IE 8.0). And even in Firefox, the mouseover never displays in the last example ([[File:example.jpg|link=|caption]].
Assuming the last is a glitch rather than another Microsoft "feature", I recommend expanding the paragraph on captions to explicitly describe their behavior in the different contexts - visible beneath for thumb and frames and thus able to accommodate links and formatting but functioning as a mouseover (and thus text-only) on the others. And maybe even a footnote about IE compatibility if that can be verified as a global issue rather than just me? Thanks. Rossami 06:09, 25 May 2010 (UTC)Reply
Regarding terminology, distinguishing the two as "visible caption" and "mouseover caption" would be much clearer, yes. I am using IE7 (7.0.5730.13) and the mouseover caption works fine, so it must be a glitch on your machine. Regarding wiki-markup on mouseover captions, some is possible: for example, you can transclude other pages:
[[Image:Wiki.png|border|{{MediaWiki:Tog-hideminor}}]] 
but it's necessarily limited by the format, so no linking, text formatting, etc. Finally, it would be great if you could update the page as you see fit, to perform these and any other corrections and improvements you see fit: coming from your stand-point, I'm sure the end result will be much clearer. Hamilton Abreu 14:04, 25 May 2010 (UTC)Reply

Problem trying to use images in a template

edit

Hi. I'm using MW 1.15.3. I have the following in a template:

[[File:{{{1}}}|300x300px]]

If I call the template using

{{My File Template|Image1.png}}

this results in a redlink of the filename wrapped in the [[File: |300x300px]] text. For example:

[[File:Image1.png|300x300px]]

The image definitely exists and show up in the list of uploaded files. Can template parameters not handle this?

Thanks User:mitchelln 14:34, 30 June 2010 (UTC)Reply

Template parameters can handle that. It's odd that only the filename is red linked. To be redlinked, it must end up in the form of a link, i.e. [[Image1.png]]. It also seems that somehow the text [[File: |300x300px]] is not being interpreted as a link at all, which might result from a syntax error before that text, in the template. Hamilton Abreu 23:00, 30 June 2010 (UTC)Reply

This is happening to me too, and there's nothing at all in the template before the image. 108.7.193.11 00:50, 2 December 2010 (UTC)Reply

Chances are that you're passing in the parameter a filename enclosed in square brackets, ie [[Filename.ext]]. That results in [[File:[[Filename.ext]]|300x300px]] which is wrong, and results in: [[File:Filename.ext|300x300px]]. Remove the square brackets. -- Hamilton Abreu 13:05, 2 December 2010 (UTC)Reply
edit

Umm yeah, I'm an admin at the One Piece Wiki and I was wondering if there was a change in the <gallery></gallery> code used throughout the various wikis. The change anyway is more messier and is a bit of a bother to some of us here in our wikia. You can see the problem here and in other galleries of the wikia. I was wondering if somebody could possibly revert the gallery coding back to the way it was as before the change as presented here in this Help Page.

Problem with link= in a template

edit

Hi. I'm using MW 1.15.3. I have in my template:

[[Image:Open.png|link={{{1|}}}]]

The template parameter contains a valid page link.
When I hover over the image the correct link is displayed, but when I click on the image it takes me to the Open.png page instead.
Any ideas?
Thanks
User:mitchelln 17:04, 21 July 2010 (UTC)Reply

What is the exact value being sent in the parameter, and the exact correct link displayed when hovering the image? For example, when you say that the parameter is a "valid page link", if that means you're enclosing it in square brackets that could be a problem:
[[File:Wiki.png|link=File:Example-pt.png]] →   (Ok)
[[File:Wiki.png|link=[[File:Example-pt.png]]]] →   (Not Ok)
Hamilton Abreu 21:03, 21 July 2010 (UTC)Reply
By the way, this problem looks similar to the one you placed above a couple of weeks ago, where probably a link was being passed instead of a pagename:
[[File:[[Image1.png]]|300x300px]] → [[File:Image1.png|300x300px]]
Hamilton Abreu 21:17, 21 July 2010 (UTC)Reply

link+Header Tabs [solved]

edit

Using Extension:Header Tabs I have the tab "Vídeo" in a page. I want to target an image link to this tab but don't works. I wrote:

[[File:image-name.png|25px|link=page-name#tab=Vídeo]]

But when the user click the image the URL in the browser is:

http://mysite/index.php/page-name#tab.3DV.C3.ADdeo

and goes to the page, not the tab.

Solutions? Any idea to solve? Thanks

See the case in (nuvola video icon): http://enlloc.net/hkp/w/index.php?title=Hacks --Dvdgmz 18:35, 12 August 2010 (UTC)Reply

I don't know the extension, but there seem to be a couple of issues: 1) the = sign after tab; 2) tab names that contain accented characters (the extension might not be handling those properly). Try this: instead of letting link= build the URL, give the correct URL to link=. In other words, go to the target page and click the tab you want. This places the correct URL for that tab in the browser navigation field. Give this URL to link=, replacing the pagename by {{urlencode:{{{page-name}}}}}. For example, to link to the Vídeo tab, you'd use:
[[File:image-name.png|25px|link=http://enlloc.net/hkp/w/index.php/{{urlencode:{{{page-name}}}}}#tab=V.C3.ADdeo]]
Hamilton Abreu 02:48, 3 September 2010 (UTC)Reply
Hi Hamilton Abreu, thanks for the answer. But with 'urlencode' don't works the "link=" parameter. It does not work either here:
 
I think that the problem it's with the '=' sign, as you said. I don't need to encode it, it is encoded automatically and this is the problem. The sign should not be encoded. But I do not know how to avoid it.
I've done lots of testing without success. :-(
--Dvdgmz 16:54, 3 September 2010 (UTC)Reply
Sure it works:
[[File:wiki.png|25px|link=http://enlloc.net/hkp/w/index.php/{{anchorencode:Un esquellot a la bateria}}#tab=V.C3.ADdeo]]
gives  . Hamilton Abreu 02:19, 4 September 2010 (UTC)Reply
OH! Great! Thanks a lot!! Now it works fine!
Then... works with {{anchorencode}} like in  , but not with {{urlencode}} like in  . That's the solution, finally.
--Dvdgmz 09:46, 4 September 2010 (UTC)Reply

Style options for galleries

edit

Hey, is there a way to add style options (through style or class attribute) to a gallery? Bud0011 16:09, 24 September 2010 (UTC).Reply

PDF rendering doesn't work

edit

This page says MediaWiki supports rendering PDF pages, but I have a fresh install of MediaWiki 1.16.0 and it doesn't work. Any ideas?

I don't know about native support, but there are a few extensions that help provide that support. Bud0011 22:00, 20 October 2010 (UTC).Reply
Thanks but I tried them and couldn't get any of them to work. It would be useful to know if MediaWiki is meant to support this by default or not, if anybody knows.
no, mediawiki doesn't support that out of the box (Well you can upload them, but they won't be rendered). Wikimedia (wikipedia, et al) uses extension:PdfHandler to deal with pdfs. Bawolff 22:39, 21 October 2010 (UTC)Reply

SVG

edit

When SVGs is used with "thumb" or "frameless" and the SVG is smaller than the width default, the width of the SVG is used:   This goes against what SVG is designed to do, which is to scale, the image size checks should not be done on SVGs. -- d'oh! [talk] 07:14, 23 October 2010 (UTC)Reply

Images and templates?

edit

Hello. I have a form that users fill out. One is an up loadable file. What I want to be able to do is display several of the images in a gallery. It would look like this:


<gallery> File:{{{Image1|}}} File:{{{Image2|}}} etc </gallery> It does not seem to be working. Why?

Check Help talk:Templates#Gallery In a Template. -- Hamilton Abreu 23:36, 1 December 2010 (UTC)Reply
edit

It seems that when you use link in conjunction with caption, the caption will not be shown. But reading the doc around link does not say that (though it does say other things wont work)

  • Image with caption (no link)
[[Image:tst.png|25px|alt=tiny globe|This is a globe.]]

 

  • Image with link and caption (not being shown)
[[Image:tst.png|25px|link=|alt=tiny globe|This is a globe.]]

 

--Boy.pockets 05:56, 24 November 2010 (UTC)Reply

That only seems to happen if the link parameter is supplied but empty. When supplying an actual link the caption is shown:
[[Image:tst.png|25px|link=Help:Edit|alt=tiny globe|This is a globe.]]
 
Hamilton Abreu 21:04, 24 November 2010 (UTC)Reply
edit

<gallery> needs a page parameter (either "|page=X" or "/X") to accommodate DjVu and Pdf multi-page files.--Doug 20:37, 11 January 2011 (UTC)Reply

Uploading images with filename from URL

edit

Okay, today i primitive edited SpecialUpload.php file for this:

I have template where it's two images (TOP and BOTTOM of product). I am not happy with "red-link" system about uploading files, and i am wanted to replace non-existent image with alternative (error) image. Aaaaand, whoala, down of the thumb it's writed: "No top(or bottom) image. You can [link:now upload the file]."

What i edited?

From my template, top image engine:


{{#ifexist: Image:{{{FileNameTop}}} | [[Image:{{{FileNameTop}}}|thumb|right|{{{ManufacturerName|Unknown}}} {{{ModelName|Unknown}}}, top]] | [[File:NO.JPG|thumb|right|No top image. {{#if: {{{FileNameTop}}}|You can [{{SERVER}}{{SCRIPTPATH}}/index.php/Special:Upload?FileName={{{FileNameTop|NO.JPG}}} now upload the file.]|You cannot upload file for top image because filename of this it's not defined.}}]] }}


NO.JPG it's my error (alt) image. If it's not defined FileNameTop variable, say: "You cannot upload file for top image because filename of this it's not defined."


SpecialUpload.php, changes:

Line 0072, added: if($request -> getText('FileName') === "NO.JPG"){unset($_GET['FileName']);} #ADDED FOR UPLOAD FROM LINKS

Line 0073, added: if(isset($_GET['FileName'])){$this->mDesiredDestName = $request->getText('FileName');} #ADDED FOR UPLOAD FROM LINKS

Line 1015, added: if(isset($_GET['FileName'])){$scriptVars['wgUploadAutoFill'] = 0;} #ADDED FOR UPLOAD FROM LINKS, DISABLING AUTOFILL FILENAME

And that's all... . So, i know this may have some potencial security risks or other, but i am novice... . And, work's me fine ;) The upload link must have be an external, internal link having problem with "?" and "=", or i not know how to set it right. The link is calling "Special:Upload?FileName=<MISSING_FILE>", <MISSING_FILE> it's automatically prefilled on upload form, on select file to upload it's not changed with filename of local/remote uploaded file.

To end: this edit help everybody who building database of products, etc. Allow fast upload files without manual writing filename for writted page/category page. If it's not uploaded right file, send to client alternative image (in my case "NO.JPG", it's similiar to this: No sign).

Tom

PS: Sorry for bad english

File feature request - Defaulting to image description in Commons

edit

It would be very cool and helpful if the File syntax could default the caption (using some parameters/flags) to the image descriptions as defined in commons:Template:Information description field (optionally selecting English description automatically or allowing the user to chose the language). Without this feature, I find adding image descriptions/captions via pipes tedious and in some cases very redundant. Of course, this is for the case where the images are in Commons and use that template, which in the case of Wikipedia are a lot --Codrinb 22:13, 23 January 2011 (UTC)Reply

I second you on this request, one may perfectly give a sane description to its images then wanting this description to be the default caption.
Drzraf2 13:33, 1 February 2012 (UTC)Reply
Found a workaround here: [[Image:img.jpg|{{:Image:img.jpg}}]]
Drzraf2 13:41, 1 February 2012 (UTC)Reply

what happened to lorem ipsum etc etc?

edit

and the weird duck looking thing? oh how i miss it. Decora 14:38, 12 February 2011 (UTC)Reply

Alt not generating in thumbs

edit
 
 
My caption.

This is very strange.

The next code generates the first image, which generates an "alt attribute automatically with the file name:

[[File:Crystal_Clear_app_display.png|thumb|left]]

However, if I add a caption, no "alt" is generated, not with the caption nor with the file name, as could be expected (second image):

[[File:Crystal_Clear_app_display.png|thumb|left|My caption.]]

Do you have an explanation or a fix? Thank you very much!

--Wikypedista 00:11, 23 February 2011 (UTC)Reply

If you set the caption, you need to set the alt text explicitly if you want it:
[[File:Crystal_Clear_app_display.png|thumb|left|My caption.|My alt text.]]
Emufarmers(T|C) 15:26, 23 February 2011 (UTC)Reply
Really? I had deducted that... my question is how to fix that automatically, not having to write the "alt" attributes for the thousans of pictures in the wiki. --Wikypedista 23:59, 23 February 2011 (UTC)Reply
Whenever I use the "thumb" attribute, the "alt text" doesn't show up whether I set it explicitly or not; only the description of the actual full-size file is used as the alt text. Of course, if I don't use the "thumb" attribute, the caption doesn't display below the image as a true caption anyway (it only shows up as the "alt text"). Perspectoff 00:35, 2 February 2012 (UTC)Reply
edit

Is it any way to link to the article using the syntax:

[[Image:Wiki.png|30px|link={{{link_with_brackets|}}}]]

where {{{link_with_brackets|}}}=[[Boston]], or how to skip square brackets.--WlaKom 18:30, 25 February 2011 (UTC)Reply

[[Image:Wiki.png|30px|link=Boston]]
No brackets there; try it. --Rogerhc (talk) 06:15, 10 October 2012 (UTC)Reply

Linking to an article or external website by clicking a gallery image

edit

Can it be done? I would like to use the gallery format to display a variety of projects on my site, with each image leading directly to the project page (or an external website), however the best I can manage is having a link in the caption, and even I mistakenly click the image to be disappointed it doesn't take me to the page I expect it. I know images leading to a hyperlink are possible outside the gallery format, but it's a pain getting images to line up (or maybe it's not even possible) like they do in the gallery format. Website in question: http://rev0proto.com/wiki/index.php/Main_Page

Blank pages

edit

In my wiki. i got blank pages in file wiewing pages and also in wikitext and lists that contain theese broken files. like the filelist!

The following files are broken: Broken file 1 of 3the 4th working linkThe blank filelist

How do i delete the pages correctly?

Image ratio

edit

Is it possible to ignore the image's aspect ratio when changing its size?

  • I would like to know this as well. Although the page says there is a {width}x{height}px option, it doesn't seem to work, even for SVG files. 47.145.148.47 22:29, 9 March 2018 (UTC)Reply
    • The width, height, and width x height specifiers all preserve aspect ratio. If you want to distort an image you need to do it through CSS (which you cannot set directly in images, so needs to be done by setting a class for the image and having a class rule in (eg) common.css). --Clump (talk) 22:55, 9 March 2018 (UTC)Reply

Sorry

edit

Deleted some stuff by accident. I hope I restored the content.--Frode Inge Helland (talk) 18:24, 18 March 2012 (UTC)Reply

How do I use an external image and have it click-able with an internal link?

edit

I have a dynamic image... http://ddosigs.level3.turbine.com/0621900000009035d/010040200003000/condensed.png It is a signature for the forums for an MMO that I play, and I want to use it on my wiki as well. Only I want people to be able to click on it and have it dump them on my User page. "If it is enabled on your wiki (see Manual:$wgAllowExternalImages), you can also embed external images." is enabled on my wiki. How can I do this? Thanks -- Technical 13 (talk) 05:10, 25 March 2012 (UTC)Reply

Bug 35909 created -- Technical 13 (talk) 12:38, 12 April 2012 (UTC)Reply
And the winner is "<span class="plainlinks">[http://my.wiki.com/wiki/User:Me http://ddosigs.level3.turbine.com/0621900000009035d/010040200003000/condensed.png]</span>" -- Technical 13 (talk) 23:51, 13 April 2012 (UTC)Reply

How to change the default size of thumb?

edit

I see Wikipedia has much larger images comapred to default Mediawiki when there is no size specified but just "thumb" argument. Where I can enlarge the default size to avoid setting fixed size to all images?

A user can set his own default image and thumb size preferences in (at the top of any page while logged in) Preferences > Appearance. On the server side, a server admin can change the defaults used when the user has not specified any, by setting $wgDefaultUserOptions in LocalSettings.php. The $wgImageLimits page shows an example of what that looks like for image size. $wgThumbLimits is for thumbs. The idea is that $wgImageLimits and $wgThumbLimits define available user preferences choices and $wgDefaultUserOptions is where an admin can set which of those choices is the default used if a user does not specify a choice. --Rogerhc (talk) 06:50, 30 November 2012 (UTC)Reply
edit

How do I go about assigning a link to an image in a gallery? Is there a CSS snippet I can use to fake galleryness, and put that in a variadic template so I can do something like {{fakegallery|Image:Alice.jpg|Alice|Image:Bob.jpg|Bob|Image:Carol.jpg|Carol}} ? Thanks! Crazytales (talk) 18:43, 20 April 2012 (UTC)Reply

Look at Extension:Gallery, I'm sure there is an extension there that can help you. -- ShoeMaker   ( Contributions Message )   19:22, 20 April 2012 (UTC)Reply
It has been almost a week, with no response. Did that solve your issue? If not, I could come up with a basic template for you to "fake" a gallery; however, it would be extremely complicated and require Extension:Loops in order to properly define the rows and columns of the table you would have to create... -- ShoeMaker   ( Contributions Message )   02:04, 27 April 2012 (UTC)Reply
I would also like to be able to control links for images being displayed in a gallery. If I insert a single image, I can direct the link wherever I want using [[File.example.jpg|link=custom]]
However, if I input an image using <gallery></gallery>, I lose the ability to control the link; only captions can be added (see below).
<gallery>
File:example.jpg|everything after pipe symbol is considered to be a caption
</gallery>
It would be nice if the <gallery></gallery> syntax still allowed you to add the link argument, |link=custom
— Preceding unsigned comment added by 204.2.206.65 (talkcontribs)
The link= parameter also works for galleries. See for example:
--Ciencia Al Poder (talk) 18:50, 1 November 2013 (UTC)Reply
Here is an attempt to link to a specific section on a page. Clicking on the caption link takes you to the section, whereas clicking on the picture only takes you to the top of the desired page:
— Preceding unsigned comment added by 204.2.206.65 (talkcontribs)
Feel free to open a bug request if none already exist about this, --Ciencia Al Poder (talk) 10:31, 15 November 2013 (UTC)Reply

File: -- Image: -- Media:

edit

Hello, I know that File: and Image: were consolidated into ns:6, was Media: also wrapped up into that, or does that have a separate use? -- ShoeMaker   ( Contributions Message )   01:59, 27 April 2012 (UTC)Reply

edit

When i use a template to try and display an image gallery i can't get the images to display, but only in the gallery. So my template is as follows...

<gallery>
Image:{{{Image1|}}}
Image:{{{Image2|}}}
</gallery>

and my page using the template... {{ImageGalleryTemplate |Image1=Image1.jpg |Image2=Image2.jpg }} The parameter is being passed correctly (if i add {{{Image1}}} to the template it correctly outputs "Image1.jpg") however, when inserted into the <gallery> tag as a parameter {{{Image1}}} i don't see anything. If i add the images in raw format (e.g. <gallery>Image:Image1.jpg</gallery> it works.

So is there a problem with the gallery taking parameters? I was thinking the gallery was getting parsed before the parameters are passed.

Thanks! -- 20:22, May 8, 2012‎ 166.122.75.57

Why are you trying to pass this through a template? I mean, unless you are using Extension:Loops and using some specific formatting, this is more work than just manually setting up the <gallery> directly on the page and doesn't add extra transclusion. -- ShoeMaker   ( Contributions Message )   01:02, 9 May 2012 (UTC)Reply
I'm using Semantic Forms so every page is only publicly editable by using the appropriate form. I am trying to eliminate all wikicode on the user side. So by filling out a form where they can upload images i can then pass the filenames to the page template and display them correctly.
Semantic Forms is out of my scope of knowledge at the moment... If I had to guess, I would say that you would have to create your own extension that would allow for bulk uploads, count the number of files in the upload and build the gallery based of it's own information... I, unfortunately, do not yet know much about php or creating extensions. -- ShoeMaker   ( Contributions Message )   23:31, 9 May 2012 (UTC)Reply
To add a gallery with Semantic Forms use the tag function and use the arraymap function. Example:
{{#tag:gallery|
{{#arraymap:{{{Photos|}}}|,|x|File:x|\n}}
}}

Don't hard code into the template the number of photos. Why limit the user? The arraymap is designed for multi-values into the same field. The only problem is if the name of a photo includes a comma in it. The delimiter, the comma,between the two pipes

{{{Photos|}}}|,|

can be changed if that's a problem. I normally change it to a slash and have it automatically put back in after photo upload by listing it as the delimiter inside the semantic form.

For Gallery help: smw wiki
For Arraymap info: Extension:Semantic Forms/Semantic Forms and templates
Adding automatic Delimiter in the Semantic Form:Extension:Semantic Forms/Defining forms#Autocompletion
Christharp (talk) 17:40, 12 May 2014 (UTC)Reply

edit

I deleted the below "Advanced special link" sub-suction of the "Link behavior" section of the article, after organizing said "Link behavior" section, because I feel this advanced material is not useful. If you feel this deleted section is useful, please explain how before replacing it into the article. --Rogerhc (talk) 06:04, 10 October 2012 (UTC)Reply


edit

Use Special:FilePath to link to a potential file, even if it doesn't exist:

Special:FilePath/Example.jpg

[[Special:FilePath/MediaWiki:Image sample]]

Sunflowers

[[Special:FilePath/MediaWiki:Image sample|Sunflowers]]

Use {{FILEPATH}} Magic Word for a long form URL to the file:

{{FILEPATH:MediaWiki:Image sample}}

Dynamic resizing as the browser is resized

edit

To have large images automatically resized to your window size, add the following code in your common.css-file, or, if you are sysop of your own wiki, your Mediawiki:common.css-file:
img { height: auto; max-width: 96%; }

Then all you need to do to have a image resize to the size of your browser window, is to encompass your image in a div-tag.

<div>[[File:LynxInNumedal.jpg]]</div>

--Koppa Dasao ƒłелањі каселањін на 14:55, 24 March 2013 (UTC)Reply

Mouseover text

edit

I've removed the phrase [caption text shows...] as mouseover text in border, frameless formats or when the format is omitted. after testing it in four major browsers. But it is possible that this may depend on HTML5 being enabled or even other factors (older browsers). Some expert insight is welcome. Edokter (talk) — 11:29, 14 April 2013 (UTC)Reply

Add anchor to a gallery?

edit

Is it possible to have anchors within a gallery? If so, how can I add them? If not, how can I simulate it? Here is what I tried, but it didn't work.

<gallery perrow=6>
<div id="fig1"></div>
File:example.jpg|caption  
<div id="fig2"></div>
File:example2.jpg|caption 
<div id="fig3"></div>
File:example3.jpg|caption 
</gallery>

— Preceding unsigned comment added by 69.54.49.230 (talkcontribs)

No, you can't add an anchor before a file. But you can add it inside the caption.
<gallery perrow=6>
File:example.jpg|<div id="fig1"></div>caption  
File:example2.jpg|<div id="fig2"></div>caption 
File:example3.jpg|<div id="fig3"></div>caption 
</gallery>

Mode parameter for galleries not working.

edit

The mode parameter doesn't seem to be working for the galleries on my wiki. 24.37.64.174 15:24, 23 October 2013 (UTC)Reply

Accidental upload of images

edit

I don't know where to place this, but a bot I used accidentally uploaded a number of images here that were meant for the commons. If someone could help me fix this I would be more than glad. CFCF (talk) 10:05, 14 December 2013 (UTC)Reply

I deleted them. In future, all stuff related to mediawiki.org you can post on Project:Current issues --wargo (talk) 17:01, 14 December 2013 (UTC)Reply

Problem with colours in pages vs in logo at top left

edit

I'm using a .jpg file. When I have the file as the image as the logo at the top left the colours are correct.

When I have the same file in a wiki page, the colours are wrong.

What happens, particularly, is that, when it is set as an icon, main letters are dark green. You can see how it should be here:

logo the correct colour

When it is in a wiki page, the image becomes light- green - as it is here:

logo the wrong colour

Why the difference and how can I adjust it?

Fustbariclation (talk) 10:46, 29 December 2013 (UTC)Reply

The image inserted in the page is a thumbnail, so basically, MediaWiki is using ImageMagick, GD libraries of PHP or any other software (that depends on how you or your wiki administrator have configured it) to create a resized image from the original one. If the original image uploaded at File:TSF_Logo_medium_size.jpg on your wiki has the correct colours, then the problem is the thumbnailer program that generates such images. Maybe you need to use a different one. Also, JPG files are "lossy", they lose quality in favor of a reduced size, so maybe depending on your thumbnailer program, there's any option to increase the quality of resulting images. Anyway, since that image is very simple and has few different colors, I'd convert it to PNG and use it in that format instead, since it produces files with smaller size and without any quality loss. --Ciencia Al Poder (talk) 11:44, 29 December 2013 (UTC)Reply
PS: Also, as noted at the top of this page, this is not the place to ask such questions. --Ciencia Al Poder (talk) 11:46, 29 December 2013 (UTC)Reply
edit

Our wiki has a few galleries that don't quite yet have all the pictures. My thinking was to create a template, call it {{ICS}} for "Image Coming Soon", create a placeholder image and refer within the template and include a catagory link in there that places it in a 'page to be updated with missing images' category, so that follow up later is easy.

So my template is created as follows

<noinclude>Put this template in a gallery or where an image will appear in the future {{ICS}} to fill the space and provide a visual reference.

It will show up as follows and be added to the 
[[Category:Tools]] [[:Category:Missing Image]]:<br/>[[File:IMG-Soon.jpg|150px]]</noinclude>
<includeonly>[[File:IMG-Soon.jpg|150px]] [[Category:Missing Image]]</includeonly>

When I type {{ICS}} anywhere on a wiki page, even in other template areas, it works a treat, as soon as it is within a <gallery>, it does not display anymore.

What am I doing wrong, and if this is the wrong way to go about it, is there another way that achieves my aim to add the page to a category by simply inserting an image placeholder? Captainreiss (talk) 01:48, 8 February 2014 (UTC)Reply


EDIT: Fixed! replace [[File:IMG-Soon.jpg|150px]] with File:IMG-Soon.jpg and all works. --217.155.36.226 23:20, 27 February 2014 (UTC)Reply

How to use version other of an image (file)?

edit

AlexandreMBM (talk) 19:04, 27 February 2014 (UTC)Reply

edit

Hey Folks, i've been trying to get this to work so that all images in a no line gallery are in the middle but instead they seem to be top aligned by default. On a traditional gallery they seem to middle automatically. I just don't know where to change the syntax. - Jknight1603

edit

To whomever maybe interested. I just added three CSS snippet pages that enhance galleries.

Expand Image on Hover

edit

The first snippet expands an image to twice it's normal size whenever a mouse, or finger on touch, hovers over the image. All you need do is add the CSS to the Mediawiki:Common.css. Here's a visual example of what it does:

Normal Gallery (packed mode):
 

Expanded Image same gallery:
 

See:Snippets/Image Expand on Hover

edit

The second snippet is actual a new gallery format. It layouts a gallery in a "Pinterest" Like Format. See:Snippets/Pinterest Like Gallery

Photo Example:
 

edit

The third CSS snippet rounds images into a circle or Oval shape. See: Snippets/Circle or Oval Gallery

Photo Example:
 

Christharp (talk) 01:01, 15 May 2014 (UTC) & Christharp (talk) 18:34, 10 June 2014 (UTC)Reply

Crazy things you can post inside the hover and hover packed modes

edit

Just discovered by that using the hover and/or hover-packed modes one can use almost any normal wiki syntax inside the text area of the hover statements. Here's some examples:

Normal packed-hover from the front page

edit

Wiki Syntax:

<gallery mode="packed-hover">
Image:Astronotus_ocellatus.jpg|''[[commons:Astronotus ocellatus|Astronotus ocellatus]]'' (Oscar)
Image:Salmonlarvakils.jpg|''[[commons:Salmo salar|Salmo salar]]'' (Salmon Larva)
Image:Georgia Aquarium - Giant Grouper.jpg|''[[commons:Epinephelus lanceolatus|Epinephelus lanceolatus]]'' (Giant grouper)
Image:Pterois volitans Manado-e.jpg|''[[commons:Pterois volitans|Pterois volitans]]'' (Red Lionfish)
Image:Macropodus opercularis - front (aka).jpg|''[[commons:Macropodus opercularis|Macropodus opercularis]]'' (Paradise fish)
Image:Canthigaster valentini 1.jpg|''[[commons:Canthigaster valentini|Canthigaster valentini]]'' (Valentinni's sharpnose puffer)
Image:Flughahn.jpg|[[Image:POTY ribbon 2007.svg|25px]] ''[[commons:Dactylopterus volitans|Dactylopterus volitans]]'' (Flying gurnard)
Image:Fishmarket 01.jpg|''[[commons:Semicossyphus pulcher|Semicossyphus pulcher]]'' (California Sheephead)
Image:Pseudorasbora parva(edited version).jpg|''[[commons:Category:Pseudorasbora parva|Pseudorasbora parva]]'' (Topmouth gudgeon)
Image:MC Rotfeuerfisch.jpg|''[[commons:Category:Pterois antennata|Pterois antennata]]'' (Antennata Lionfish)
Image:Cleaning station konan.jpg|''[[commons:Novaculichthys taeniourus|Novaculichthys taeniourus]]''
Image:Synchiropus splendidus 2 Luc Viatour.jpg|''[[commons:Synchiropus splendidus|Synchiropus splendidus]]'' (Mandarin fish)
File:Psetta maxima Luc Viatour.jpg|''[[commons:Psetta maxima|Psetta maxima]]'' (Turbot)
File:Australian blenny.jpg|''[[commons:Category:Ecsenius|Ecsenius axelrodi]]''
</gallery>

Photo inside a Photo

edit

Roll over the first image and you'll see a photo inside the photo

Wiki Syntax:

<gallery mode="packed-hover">
Image:Astronotus_ocellatus.jpg|''[[File:sunset.jpg{{!}}50px]]''
Image:Salmonlarvakils.jpg|''[[commons:Salmo salar|Salmo salar]]'' (Salmon Larva)

</gallery>

Video inside a photo

edit

Video from Wikimedia Commons:

Wiki Syntax:

<gallery widths=300 heights=300 mode="packed-hover">
Image:Astronotus_ocellatus.jpg|''[[File:Superman 4 The Arctic Giant 1942.ogv{{!}}300px]]''
Image:Salmonlarvakils.jpg|''[[commons:Salmo salar|Salmo salar]]'' (Salmon Larva)

</gallery>

A YouTube Video Added:

Normal before Hover:
 

During Hover:
 

Example from my site:Yellpedia

Wiki Syntax:

<gallery widths=300 heights=300 mode="packed-hover">
Image:Astronotus_ocellatus.jpg|''{{YouTube:id=pfZvimPkKio |width=300|height=200}}''
Image:Salmonlarvakils.jpg|''[[commons:Salmo salar|Salmo salar]]'' (Salmon Larva)

</gallery>

YouTube syntax from the WidgetFramework Extension. However I'm sure it also would work with the Widgets Extension also. Additionally one could embed a document inside a photo. Christharp (talk) 00:57, 2 September 2014 (UTC)Reply

Adding a shadow behind a photo, gallery, etc

edit

See DropShadow to create a shadow behind a photo, gallery to create depth:

Without a Shadow:

 

With a Shadow:

 

This css is not active on Mediawiki. The examples above are photos of photos with the technique applied. It actually may be a little more clear when directly applied.


Christharp (talk) 22:14, 27 October 2014 (UTC)Reply

Or you could just do this:
<div style="display:inline-block; box-shadow:10px 10px 20px #aaa">[[File:Taj without dropshadow.png]]</div>
138.217.82.231 02:06, 28 October 2014 (UTC)Reply

Mark for translation

edit

Can someone experienced in image markup re-read this page and mark it for translation? --Nemo 09:03, 20 December 2014 (UTC)Reply

  Done by Shirayuki. This page currently used two subpages (as transcluded with params), needed to migration - Help:Images/frame and Help:Images/size. --Kaganer (talk) 23:42, 29 March 2015 (UTC)Reply
  Done --Shirayuki (talk) 01:14, 30 March 2015 (UTC)Reply

Scale and place image (slideshow) on main page

edit

We have an image on the main page of our ReplicationWiki. Actually not just an image, a slideshow. We want it to cover the left half of the screen. However, if I look at it on my mobile phone it covers much more than half of the screen and the column on the right stretches out far to the bottom. If I look at it on a large screen, the slideshow covers very little of the left half and there is a big empty ugly hole. If I look at it with Internet Explorer, which I don't usually do and would not recommend to anyone, the slideshow just jumps to the center and covers text that it should not cover. Could anyone tell me what is wrong with our code? ReplicationWiki-fan (talk) 17:41, 7 February 2015 (UTC)Reply

edit

on my wiki if I use the Gallery syntax, when I click on an image in the gallery it just takes me to the File: page instead of showing the gallery like where you can click on a right arrow to see next image etc

anyone know what could cause this?

I think you are looking for Media Viewer. WhatamIdoing (talk) 01:47, 30 August 2015 (UTC)Reply
I was also very confused by this behaviour. I think Media Viewer should be at least mentioned in the Help page, because people expect the same behaviour given the same code. Thanks for asking and answering this question! You saved me from a big headache. 146.198.223.71 21:53, 23 May 2016 (UTC)Reply
edit

The article states:

widths={width}px: sets the widths of the images, default 120px. Note the plural, widths.

This parameter doesn't seem to control the width of the image past 180px, at which point it only controls the width of the thumbnail frame.

180 px

300px

It does absolutely nothing in packed mode.

10px

500px

104.175.80.121 01:16, 9 October 2015 (UTC)Reply

I have the same problems with image heights-property not functioning over 189px.
<gallery mode="packed" heights=189px>
<gallery mode="packed" heights=190px>
-abbedabb (talk) 13:22, 29 December 2015 (UTC)Reply

Image as a background

edit

How do I make the text on a right/left top background image? Also, how do I make that

<div style="display:inline-block; box-shadow:10px 10px 20px #aaa">[[File:Taj without dropshadow.png]]</div>

for a text frame?

edit

Is there a way to do this:

{{MyTemplate |
| photos =
Photo1.jpg{{!}}Description.
Photo2.jpg{{!}}Description.
}}

I know I have to escape the pipe, but trying it various ways just produces nothing:

== Photos ==
<gallery>
{{{photos}}}
</gallery>

Any thoughts? Allenhuffman (talk) 20:35, 9 August 2016 (UTC)Reply

@Allenhuffman: You need to use #tag: --Zebulon84 (talk) 22:04, 10 August 2016 (UTC)Reply
== Photos ==
{{#tag:gallery|
{{{photos}}}
}}
@Zebulon84: Fantastic! Thank you. Could we edit this to include a reference to that in the gallery section? Allenhuffman (talk) 14:37, 12 August 2016 (UTC)Reply
edit

Why this code doesn't work?

<gallery mode="packed-overlay" widths=375px heights=250px> 
Image:http://i164.photobucket.com/albums/u8/hemi1hemi/COLOR/COL9-6.jpg|link=|''[[Article|Artcile]]'' lorem.....
</gallery>
Because you can only load images uploaded to the project, not images from external websites. --Dvorapa (talk) 15:21, 4 January 2019 (UTC)Reply

Setting width of slideshow image has no effect

edit

It seems that using a gallery with the new slideshow attribute one cannot control the dimensions of the images. I tried setting widths=350px as an attribute of the gallery tag, but the images were still displayed in their original (larger) sizes. Is this limitation by design or is the widths parameter for slideshows supposed to work? If "widths" cannot be set for slideshows, I think you should say so on the help page.

I am also facing the same problem. A response would help.--Arjunaraoc (talk) 10:51, 11 March 2019 (UTC)Reply
Same. Was this solved in the year since it was asked last? --2A0D:6FC0:F15:D600:B0A3:B330:158:C1C8 14:06, 15 January 2022 (UTC)Reply
If the gallery-tag contains showthumbnails, the widths and heights attributes applies to the thumbnails beneath the slideshow, not the slideshow itself. Please feel free to add the information to the help page for others to benefit. An [phab:T154013|open task]] in phabricator seems to suggest this is not beeing done anytime soon. You could post it as a suggestion to the technical team in the ongoing m:Community Wishlist Survey 2022Abuluntu (talk) 14:34, 15 January 2022 (UTC)Reply

Galleries: packed-hover replaced with packed-overlay on Desktop

edit

When using Chrome 58, whether I am logged in or not, packed-hover galleries will always across all wikis be displayed as packed-overlay galleries for me. I understand that this is the fallback for mobile displays, but this is the case for my regular Chrome installation on Windows 10, whereas Firefox will correctly show the -hover variant. I notice that I explicitly get served <ul class="gallery mw-gallery-packed-overlay"> tags rather than <ul class="gallery mw-gallery-packed-hover">, and when I manually change the css class in html, the gallery works fine. Does someone know what could be causing this? Which attribute is used to determine whether to serve the -hover or the -overlay css class? Any help is appreciated. Thanks, Julian Herzog (talk) 10:32, 10 April 2017 (UTC)Reply

Also interested (but using Firefox). Please ping me if there are news. --Valerio Bozzolan (talk) 19:24, 22 October 2017 (UTC)Reply

Images within a bulleted list

edit

I have found that when I embed an image in a bulleted list the list starts over again instead of continuing with higher numbers. Ex: This is what I want to create...

- How to clean the floor

 1. Find a broom
   [image of broom]
 2. Sweep the floor
 3. Deposit waste into the trash
 4. Find a mop
   [image of mop]
 5. Find a bucket

What I am rendering currently...

- How to clean the floor

 1. Find a broom 
   [image of broom]
 1. Sweep the floor
 2. Deposit waste into the trash
 3. Find a mop
   [image of mop]
 1. Find a bucket

Has anyone found a way to resolve this? Many thanks in advance!

  • It's nothing to do with images specifically, the reset in numbering comes from breaking continuity in the ordered list marker at the beginning of each line. If you want a newline without disrupting the numbering use a <br>; e.g.,
  1. Find a broom
     
  2. Sweep the floor.
--Clump (talk) 22:41, 26 March 2018 (UTC)Reply

Picture in snippet when searching on google

edit

Often when you search for an article, google will display a snippet of that article with a picture on the right. Often these articles will have a number of pictures, yet only one is chosen to be displayed before you click it. Does anyone know how if there is a way to chose which picture is displayed? It is not always the first one. Thank you Nate Hooper (talk) 09:08, 4 August 2018 (UTC)Reply


How to change the default Horizontal alignment of the frame or thumb[nail] formats

edit

"Note that when using the frame or thumb[nail] formats, the default horizontal alignment will be right"

How can I change right to "center"?

— Preceding unsigned comment added by Libattery (talkcontribs) 04:41, 31 August 2018 (UTC)Reply

Picture-in-picture

edit

Is there a way to use image syntax, or divs, to display one picture over another, in a "picture-in-picture" format? For example, without modifying the image itself, to display the main image and a magnified detail of a portion of it in the corner?199.247.46.139 17:57, 5 March 2019 (UTC)Reply

Yes, create an outer div with position:relative, and insider wrap your image in a div that has position:absolute. Specify z-index's to ensure one is on top of the other. For example, one image on top of another:

To have a zoomed inset scale the inner image and wrap it in another div that uses a relative position and overflow:hidden to shift the viewport. For example,

--Clump (talk) 18:42, 5 March 2019 (UTC)Reply

Advice regarding gallery: “The File: prefix can be omitted. However, it is helpful to include it”

edit

“The File: prefix can be omitted. However, it is helpful to include it” – well, as long it is English and spelled File: this is not directly breaking the workflow.

  • However, if it is not an English wiki there would be inserted Fichier: or Plik: or Datei: or Bild: – and this is causing a problem.
  • If you transfer a gallery line into another wiki project, you can c&p the entire line. If you are lucky, even the legend of that image may be kept untranslated.
  • If you insert a superfluous namespace name as suggested now, this requires additional work and breaks translation business.
  • It is also not a solution to always insert File: – that is unreadable and unpolite against people in non-latin projects, who cannot read that File:, and it is unnecessarily confusing for source code editors in any non-English project.
  • VisualEditor is currently tempting to insert always Αρχείο: – that is blocking transfer among wikis.
  • From my point of view best recommendation is to omit the redundant and entirely superfluous and confusing namespace identifier.
  • German Wikipedia has removed the namespace prefix from more than three quarters of all gallery lines.

Greetings --PerfektesChaos (talk) 14:20, 17 December 2019 (UTC)Reply

support for 2x DPI? (HiDPI, Retina, High Resolution)

edit

it seems to me that we should be able to specify an image as having a DPI of 144 (or 2x, or something), and have MediaWiki "just know" to serve it up at HiDPI when displayed on a screen that supports it, or resized to fit in the same frame (effectively 72dpi, or 1x) on screens that do not support it. no need to resample, just resize it when displayed, scaled to the bounding box.

or something. some way to serve HiDPI images that doesn't require an (unsupported) extension. am i off my rocker?

Davecotter (talk) 03:20, 16 April 2020 (UTC)Reply

Ironically, I came here to search for a way to automatically specify this in WikiSyntax, and was rather surprised to find that it wasn't part of the specs! I wonder if a reasonable alternative is to hand-craft a template for this purpose?
Gwyneth Llewelyn (talk) 20:23, 11 September 2022 (UTC)Reply

Why File: has conflict with Extension:CommentStreams?

edit

As I provided screenshot here: https://i.stack.imgur.com/Fkdr6.jpg Why CommentStreams appears next to the pdf thumbnail rather than below it? Isn't it a bug? Here is my usage: == Guide == [[File:TerraformingMars.pdf|page=1|thumb|right|راهنمای فارسی - سایت: بازی نوین، مترجم: نیما مسقدی]] == Comments == <comment-streams/> Farvardyn (talk) 18:18, 6 May 2020 (UTC)Reply


Try adding a en:Template:Clear or <br clear="all"> at end of sections 🤔
== Guide ==  

[[File:TerraformingMars.pdf|page=1|thumb|right|راهنمای فارسی - سایت: بازی نوین، مترجم: نیما مسقدی]]
{{clear}}<!-- or <br clear="all"> -->
== Comments ==

<comment-streams/>

Also see! [1]


--Mkouklis(2) (talk) 07:34, 10 May 2020 (UTC)Reply

upright resizing

edit

There is no description about upright image resizing effect, and no example. Also this options seems to have no effect. Is it still supported in MediaWiki or does it have been removed without page being updated ?

--DavidL (talk) 16:42, 17 June 2020 (UTC)Reply

Here are three examples of upright in use (0.1, blank, 2.0):
 
 
 
Use your browser's Find function to see the extensive documentation on the upright option. Jonesey95 (talk) 01:48, 19 June 2020 (UTC)Reply
Thanks for the examples.
It's seems to be limited to two display modes: thumb and frameless only.
This one, for example, does not work : [[File:Example.jpg|border|upright=0.1]]
 
This limitation is not documented on the page.
--DavidL (talk) 17:03, 2 July 2020 (UTC)Reply
I am just finding this thread again after seeing a similar problem at en:Template talk:Infobox museum. I have documented this limitation just now. My guess is that since upright applies a multiple of the thumbnail size, the File: invocation requires an option that specifies that the thumbnail size should be used. Those options are thumb and frameless. Jonesey95 (talk) 19:30, 19 June 2023 (UTC)Reply
edit

Am I not able to link to an anchor (such as a heading on the same or other internal page) when using the =link option for images? I have tried using =link=#Heading name and =link=Page name#Heading Name but the hash and everything after it just gets ignored. Dave247 (talk) 22:22, 15 July 2021 (UTC)Reply

@Dave247: There should be no equals sign before link: [[File:Example.jpg|32px|link=#Using anchors with link option]] . —Tacsipacsi (talk) 23:58, 15 July 2021 (UTC)Reply
@Tacsipacsi: Ah sorry that was a typo. I also should of been more specific that I was trying to get it to work in a gallery tag and for some reason assumed if it didn't work there then it didn't work at all. Dave247 (talk) 02:02, 17 July 2021 (UTC)Reply

@Dave247: For me it works in a gallery as well:

<gallery>Example.jpg|link=#Using anchors with link option</gallery>

results in

Tacsipacsi (talk) 13:32, 17 July 2021 (UTC)Reply

@Tacsipacsi: Hmm, good to know it's not a Mediawiki thing then. I've been trying to do this on a Fandom wiki so either they are doing something weird, it's a bug or I've just completely screwing it up this whole time. Thanks for conforming that for me though as I can potentially use it as proof if it is indeed a bug. Dave247 (talk) 05:43, 19 July 2021 (UTC)Reply
@Dave247: Oh yeah, Fandom. They seem to have totally rewritten how links on images work: without any |link= override, the images themselves link to the full-size image files (in vanilla MediaWiki as well as on Wikimedia, they link to the file description page), and description pages can be accessed with a separate information icon, which appears only for logged-in users (logged-out users can’t even see the description pages). —Tacsipacsi (talk) 22:46, 19 July 2021 (UTC)Reply

Insert image to frame or thumbnail

edit

The page says that an image may be rendered as a thumbnail image if one writes thumb={filename}. It isn’t true. Images provided as a caption texts will render.

Example

edit
[[File:Information example page.jpg|thumb=Information example page.jpg]]

renders

edit
 
[[File:Information example page.jpg|thumb=file:Information example page.jpg]]

renders

edit
Error creating thumbnail:
[[File:Information example page.jpg|frame|[[File:Information example page.jpg|50px|right]]]]

renders

edit
 
 

The above can be done using any format which accepts captions. May I rewrite the sentence or have I missed something? Abuluntu (talk) 00:27, 18 September 2021 (UTC)Reply

Change default link= parameter

edit

Hi there, anybody knows how to disable or change default link on images?

For example, when I use [[File:filename.png|200px]], I not need to open image page by clicking on image, like when I use [[File:filename.png|200px|link=]]

How I can set "Empty links" for all images on my wiki which have no link= parameters (need to use linked images only if i set link= parameter manually)

Image renaming

edit

Can one rename an image? My problem stems from an image that was named Smuggler.Yosef.png. Many of us know that Windows File Explorer treats everything prior to the first decimal as the file 'name' and everything after it as an extension. Thus if I try to upload a replacement file called Smuggler.png, I get a message that the file already exists even though the only similar file is Smuggler.Yosef.png. And I can't simply copy the existing .png and re-upload it with a different name as it is not my work. Fitzron (talk) 18:27, 27 March 2024 (UTC)Reply

Caption on the right side of a thumb image

edit

I have a situation like the following: a small, vertical image with a caption and a short block of text next to it.

Lorem ipsum
 
A short cap­tion for a narrow, verti­cal image

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam nec lectus augue. Curabitur tincidunt bibendum luctus. Cras quis feugiat ipsum, cursus tempus purus. Nullam vel scelerisque nisi, vel condimentum justo. Suspendisse metus sem, facilisis eget leo quis, maximus viverra enim. Fusce vel neque et augue placerat ultricies sed et justo.

Dolor sit amet

Donec id bibendum purus. Mauris interdum, urna sed aliquam iaculis, urna ligula euismod massa, sed faucibus velit lectus quis eros. Aenean vulputate dolor vel auctor rutrum. Duis id enim at magna aliquet ultricies a nec purus.

Using a {{clear}} before the next heading prevents the caption from being next to unrelated text, but at the price of creating a large gap especially on wide screens. It would be even better if there was a way to put the caption on the right side of the image instead of below. — Keepright! ler (talk) 10:13, 17 July 2024 (UTC)Reply

Have you tried using {{Clear left }} instead? The template does not exist here (it exists on en.WP), but I put its code below to illustrate how it works.
Lorem ipsum
 
A short cap­tion for a narrow, verti­cal image

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam nec lectus augue. Curabitur tincidunt bibendum luctus. Cras quis feugiat ipsum, cursus tempus purus. Nullam vel scelerisque nisi, vel condimentum justo. Suspendisse metus sem, facilisis eget leo quis, maximus viverra enim. Fusce vel neque et augue placerat ultricies sed et justo.

Dolor sit amet

Donec id bibendum purus. Mauris interdum, urna sed aliquam iaculis, urna ligula euismod massa, sed faucibus velit lectus quis eros. Aenean vulputate dolor vel auctor rutrum. Duis id enim at magna aliquet ultricies a nec purus.

That is the usual resolution for gaps like this. Jonesey95 (talk) 22:40, 26 September 2024 (UTC)Reply
I resorted to not use {{clear}} at all, but my actual question was whether something like the following would be possible without any extremely crude HTML/CSS hacking:
Lorem ipsum
 
A short cap­­tion for a narrow, verti­­cal image
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam nec lectus augue. Curabitur tincidunt bibendum luctus. Cras quis feugiat ipsum, cursus tempus purus. Nullam vel scelerisque nisi, vel condimentum justo. Suspendisse metus sem, facilisis eget leo quis, maximus viverra enim. Fusce vel neque et augue placerat ultricies sed et justo.
Dolor sit amet
Donec id bibendum purus. Mauris interdum, urna sed aliquam iaculis, urna ligula euismod massa, sed faucibus velit lectus quis eros. Aenean vulputate dolor vel auctor rutrum. Duis id enim at magna aliquet ultricies a nec purus.
Keepright! ler (talk) 16:56, 28 September 2024 (UTC)Reply

real url image

edit

Hi, I'm using dompdf to generate pdf documents from my wiki. The document is generated very well but there is a problem with the images, since they do not appear. Analyzing the problem it seems that the cause is not in dompdf but in the url of the mediawiki images.

The url of [[File:Example.jpg]] is https://web.xyz/index.php/File:example.jpg

And not the real url of the image, but https://web.xyz/images/thumb/1/4/example.jpg so that makes the image not load, since it is not the real address

I already tried to use {{filepath:example.jpg}}, but the real url appears but the thumbnail of the image.

What can be done in mediawiki so that the thumbnail appears but with the real url? thankyou Tlacoache (talk) 02:31, 23 August 2024 (UTC)Reply

Contradictory description of the "upright" parameter

edit

The paragraph "Format" states:

When the height of an image in thumbnail is bigger than its width (i.e. in portrait orientation rather than landscape) and you find it too large, you may try the option upright=N, where N is the image's aspect ratio (its width divided by its height, defaulting to 0.75). 

while the paragraph "Syntax" above says:

upright — Resizes an image to a multiple of the user's thumbnail size preferences (see $wgThumbLimits) – or the default thumbnail size, for logged-out users or logged-in users who have not changed their preferences – to fit within reasonable dimensions. This option is often useful for images whose height is larger than their width. Requires either thumb or frameless. Setting |upright=1.0| will display the image at the user's default image width. |upright=2.0| will display the image at double the user's default width.
The image will always retain its aspect ratio.
Images in non-scalable media types can be reduced in size, but not increased; e.g., bitmap images cannot be scaled up.
The upright setting does not require an equals sign, i.e. |upright 2.0| works the same as |upright=2.0|.
When used without a value or an equals sign (e.g., |upright|), defaults to |upright=0.75| (although |upright=| is the same as |upright=1.0|)

I assume that the latter is correct and the former needs to be changed accordingly.

It also seems that the statements

The image will always retain its aspect ratio.
Images in non-scalable media types can be reduced in size, but not increased; e.g., bitmap images cannot be scaled up.
The default maximum size depends on the format and the internal image dimensions (according to its media type).

do not solely apply to the sub-paragraph "upright" but to the whole pararaph "Resizing option: one of" and should be indented accordingly.

best, KaiKemmann (talk) 01:06, 18 November 2024 (UTC)Reply

Return to "Images" page.