Template:ImageLink: Difference between revisions
Jump to navigation
Jump to search
No edit summary |
No edit summary |
||
| Line 2: | Line 2: | ||
<div style="display: flex; justify-content: center; align-items: center; width: {{{w|100}}}px; height: {{{h|100}}}px;" | <div style="display: flex; justify-content: center; align-items: center; width: {{{w|100}}}px; height: {{{h|100}}}px;" | ||
>[[File:{{{1}}}|{{{w|100}}}x{{{h|100}}}px|{{{3|{{{2}}}}}}|link={{{2}}}]]</div> | >[[File:{{{1}}}|{{{w|100}}}x{{{h|100}}}px|{{{3|{{{2}}}}}}|link={{{2}}}]]</div> | ||
<div style="width: {{{w|100}}}px; text-align: center;" | <div style="width: {{{w|100}}}px; text-align: center; {{#if: {{{font size|}} | font-size: {{{font size}}}; }}" | ||
>[[{{{2}}}|{{{3|{{{2}}}}}}]]</div> | >[[{{{2}}}|{{{3|{{{2}}}}}}]]</div> | ||
</div></includeonly><noinclude> | </div></includeonly><noinclude> | ||
| Line 14: | Line 14: | ||
<pre> | <pre> | ||
{{ImageLink|Frenzy Icon.png|Origins}} | {{ImageLink | Frenzy Icon.png | Origins}} | ||
{{ImageLink|Defensive Duellist Icon.png|Character Creation#Backgrounds|Backgrounds}} | {{ImageLink | Defensive Duellist Icon.png | Character Creation#Backgrounds | Backgrounds }} | ||
{{ImageLink|Passive Feature Generic Icon.png|Feats|Just a test with very very long text}} | {{ImageLink | Passive Feature Generic Icon.png | Feats | Just a test with very very long text }} | ||
</pre> | </pre> | ||
Result: | Result: | ||
{{ImageLink|Frenzy Icon.png|Origins}} | {{ImageLink | Frenzy Icon.png | Origins}} | ||
{{ImageLink|Defensive Duellist Icon.png|Character Creation#Backgrounds|Backgrounds}} | {{ImageLink | Defensive Duellist Icon.png | Character Creation#Backgrounds | Backgrounds }} | ||
{{ImageLink|Passive Feature Generic Icon.png|Feats|Just a test with very very long | {{ImageLink | Passive Feature Generic Icon.png | Feats | Just a test with very very long text }} | ||
---- | ---- | ||
| Line 30: | Line 30: | ||
<pre> | <pre> | ||
{{ImageLink|Frenzy Icon.png|Origins|w=50}} | {{ImageLink | Frenzy Icon.png | Origins | w = 50 }} | ||
{{ImageLink|Defensive Duellist Icon.png|Character Creation#Backgrounds|Backgrounds|w=50}} | {{ImageLink | Defensive Duellist Icon.png | Character Creation#Backgrounds | Backgrounds | w = 50 }} | ||
</pre> | </pre> | ||
Result: | Result: | ||
{{ImageLink|Frenzy Icon.png|Origins|w=50}} | {{ImageLink | Frenzy Icon.png | Origins | w = 50 }} | ||
{{ImageLink|Defensive Duellist Icon.png|Character Creation#Backgrounds|Backgrounds|w=50}} | {{ImageLink | Defensive Duellist Icon.png | Character Creation#Backgrounds | Backgrounds | w = 50 }} | ||
---- | ---- | ||
| Line 44: | Line 44: | ||
<pre> | <pre> | ||
{{ImageLink|Frenzy Icon.png|Origins|h=50}} | {{ImageLink | Frenzy Icon.png | Origins | h = 50 }} | ||
{{ImageLink|Defensive Duellist Icon.png|Character Creation#Backgrounds|Backgrounds|h=50}} | {{ImageLink | Defensive Duellist Icon.png | Character Creation#Backgrounds | Backgrounds | h = 50 }} | ||
</pre> | </pre> | ||
Result: | Result: | ||
{{ImageLink|Frenzy Icon.png|Origins|h=50}} | {{ImageLink | Frenzy Icon.png | Origins | h = 50 }} | ||
{{ImageLink|Defensive Duellist Icon.png|Character Creation#Backgrounds|Backgrounds|h=50}} | {{ImageLink | Defensive Duellist Icon.png | Character Creation#Backgrounds | Backgrounds | h = 50 }} | ||
---- | ---- | ||
| Line 58: | Line 58: | ||
<pre> | <pre> | ||
{{ImageLink|Frenzy Icon.png|Origins|w=50|h=50}} | {{ImageLink | Frenzy Icon.png | Origins | w = 50 | h = 50 }} | ||
{{ImageLink|Defensive Duellist Icon.png|Character Creation#Backgrounds|Backgrounds|w=50|h=50}} | {{ImageLink | Defensive Duellist Icon.png | Character Creation#Backgrounds | Backgrounds | w = 50 | h = 50 }} | ||
</pre> | </pre> | ||
Result: | Result: | ||
{{ImageLink|Frenzy Icon.png|Origins|w=50|h=50}} | {{ImageLink | Frenzy Icon.png | Origins | w = 50 | h = 50 }} | ||
{{ImageLink|Defensive Duellist Icon.png|Character Creation#Backgrounds|Backgrounds|w=50|h=50}} | {{ImageLink | Defensive Duellist Icon.png | Character Creation#Backgrounds | Backgrounds | w = 50 | h = 50 }} | ||
---- | |||
You might have noticed the text is often too wide for the icon... You can specify a font size: | |||
<pre> | |||
{{ImageLink | Frenzy Icon.png | Origins | w = 80 | h = 80 | font size = 80% }} | |||
{{ImageLink | Defensive Duellist Icon.png | Character Creation#Backgrounds | Backgrounds | w = 80 | h = 80 | font size = 80% }} | |||
</pre> | |||
Result: | |||
{{ImageLink | Frenzy Icon.png | Origins | w = 80 | h = 80 | font size = 80% }} | |||
{{ImageLink | Defensive Duellist Icon.png | Character Creation#Backgrounds | Backgrounds | w = 80 | h = 80 | font size = 80% }} | |||
</noinclude> | </noinclude> | ||
Revision as of 01:51, 31 July 2023
This template allows you to add images on top of links.
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:
{{ImageLink | Frenzy Icon.png | Origins}}
{{ImageLink | Defensive Duellist Icon.png | Character Creation#Backgrounds | Backgrounds }}
{{ImageLink | Passive Feature Generic Icon.png | Feats | Just a test with very very long text }}
Result:
Limiting width only; note this may cause the text to clip as seen here:
{{ImageLink | Frenzy Icon.png | Origins | w = 50 }}
{{ImageLink | Defensive Duellist Icon.png | Character Creation#Backgrounds | Backgrounds | w = 50 }}
Result:
Limiting height only:
{{ImageLink | Frenzy Icon.png | Origins | h = 50 }}
{{ImageLink | Defensive Duellist Icon.png | Character Creation#Backgrounds | Backgrounds | h = 50 }}
Result:
Limiting width and height:
{{ImageLink | Frenzy Icon.png | Origins | w = 50 | h = 50 }}
{{ImageLink | Defensive Duellist Icon.png | Character Creation#Backgrounds | Backgrounds | w = 50 | h = 50 }}
Result:
You might have noticed the text is often too wide for the icon... You can specify a font size:
{{ImageLink | Frenzy Icon.png | Origins | w = 80 | h = 80 | font size = 80% }}
{{ImageLink | Defensive Duellist Icon.png | Character Creation#Backgrounds | Backgrounds | w = 80 | h = 80 | font size = 80% }}
Result:
