Template:PopupImage
Jump to navigation
Jump to search
[edit] [ ]
Template documentation

![]() | This template uses TemplateStyles |
For the annoying popup images which occasionally show up in articles, giving you a jumpscare instead of a link. Feel free to add this to every article on this site, rendering the entire place unreadable.
Usage
{{PopupImage|Everything was beautiful and nothing hurt|image=Everythingwasbeautifulandnothinghurt.png}}
The above code will produce this:
Everything was beautiful and nothing hurt
.
All parameters
text
– You can also use thetext
parameter, very helpful for when your text contains an=
sign, i.e.{{PopupImage|text=2+2=4|image=Einstein-pipe.jpg}}
image
– The image which will popup, do NOT include theFile:
part of the image name.width
orsize
– Changes the image's width, defaults to 200px, has a hard limit of 600px, so any value larger will just go to 600px.link
– Will change the image's link, does not change the text!alt
– Mouseover text, for the "joke-to-pixel" ratio maximizers.color
– Changes the text color, from "default link blue" to whatever you want.top
– Overrides default top positioning (50%) to whatever you specify, accepts negative numbers.left
– Overrides default left positioning (50%) to whatever you specify, accepts negative numbers.
Putting it all together:
{{PopupImage|text='''If you can solve this problem, you might have an IQ > 300: 2+2=?'''|image=Einstein-pipe.jpg|width=333px|link=Albert Einstein|alt=Here is some alt text you animal|color=green|top=-180px}}
The above code will produce this monstrosity:
If you can solve this problem, you might have an IQ > 300: 2+2=?
Note: You may see pages which specify a height
parameter for this template. This is no longer needed, and will do nothing if used now.
No fun zone
For incorrigible stick-in-the-muds who don't want any surprises, you can add this bit of CSS to your user CSS page. It should warn you of any popup images hiding in the text.
.popup-text::after { content:"popup-image"; white-space: pre; margin-left: 4px; padding: 2px; border:1px solid #EF6C00; border-radius: 2px; background:#FF9800; color: #fff; font-family: monospace; font-size: 90%; }
See also
- {{Show on hover}}
- {{Popout}} - Popout text
- {{Image hover}} - Image hover