Template:ImageText

From Beasts of Bermuda
Jump to: navigation, search


This template allows you to add images on top of a piece of text.

The element will be an inline block, meaning several can appear in one line. You can give them all a specific width and height to get a nice consistent layout.


Standard width/height is 100:

{{ ImageText | file:Nesting_MAINPAGE.png | Nesting }}
{{ ImageText | Enhanced Growth.png | Enhanced Growth }}
{{ ImageText | The Elements.png | Just a test with very very long text }}

Result:


           [[File:
           Nesting_MAINPAGE.png
           |100x100px
           |Nesting
           |link=
           ]]
           Nesting



           [[File:
           Enhanced Growth.png
           |100x100px
           |Enhanced Growth
           |link=
           ]]
           Enhanced Growth



           [[File:
           The Elements.png
           |100x100px
           |Just a test with very very long text
           |link=
           ]]
           Just a test with very very long text




Limiting width only; note this may cause the text to overflow as seen here:

{{ImageText | Nesting_MAINPAGE.png | Nesting | w = 50 }}
{{ImageText | Enhanced Growth.png | Enhanced Growth | w = 50 }}

Result:


           [[File:
           Nesting_MAINPAGE.png
           |50x100px
           |Nesting
           |link=
           ]]
           Nesting



           [[File:
           Enhanced Growth.png
           |50x100px
           |Enhanced Growth
           |link=
           ]]
           Enhanced Growth




Limiting height only:

{{ImageText | Nesting_MAINPAGE.png | Nesting | h = 50 }}
{{ImageText | Enhanced Growth.png | Enhanced Growth | h = 50 }}

Result:


           [[File:
           Nesting_MAINPAGE.png
           |100x50px
           |Nesting
           |link=
           ]]
           Nesting



           [[File:
           Enhanced Growth.png
           |100x50px
           |Enhanced Growth
           |link=
           ]]
           Enhanced Growth




Limiting width and height:

{{ImageText | Nesting_MAINPAGE.png | Nesting | w = 50 | h = 50 }}
{{ImageText | Enhanced Growth.png | Enhanced Growth | w = 50 | h = 50 }}

Result:


           [[File:
           Nesting_MAINPAGE.png
           |50x50px
           |Nesting
           |link=
           ]]
           Nesting



           [[File:
           Enhanced Growth.png
           |50x50px
           |Enhanced Growth
           |link=
           ]]
           Enhanced Growth




You might have noticed the text is often too wide for the icon... You can specify a font size:

{{ImageText | Nesting_MAINPAGE.png | Nesting | w = 80 | h = 80 | font size = 80% }}
{{ImageText | Enhanced Growth.png | Enhanced Growth | w = 80 | h = 80 | font size = 80% }}

Result:


           [[File:
           Nesting_MAINPAGE.png
           |80x80px
           |Nesting
           |link=
           ]]
           Nesting



           [[File:
           Enhanced Growth.png
           |80x80px
           |Enhanced Growth
           |link=
           ]]
           Enhanced Growth