Quelltext der Seite Vorlage:Hinweisbaustein

<onlyinclude>{{#ifeq: {{{POSITION}}} | unten | <nowiki />
<!-- Aufzählungen brechen -->}}{{#switch: {{{POSITION|innerhalb}}}
  |oben|unten|innerhalb|=<div class="mw-highlight rahmenfarbe1 navigation-not-searchable {{#ifeq: {{{noprint|}}} | 1 | noprint}} {{{class|}}}" style="border{{#switch: {{{POSITION|}}}|oben=-bottom|unten=-top}}-style: solid; border{{#switch: {{{POSITION|}}}|oben=-bottom|unten=-top}}-width: 1px; {{#switch: {{{POSITION|}}} |oben= |unten=clear: both; |#default=clear: left;}} {{#switch: {{{POSITION|}}} |oben|unten= |#default= {{#switch: {{{vollbreit|1}}} |0=display: table;}} }} {{#if: {{{SCHRIFT%|}}} | font-size:{{{SCHRIFT%}}}%;}} margin-{{#if: {{#switch: {{{POSITION|}}} |oben|unten=1}} | {{#switch: {{{POSITION|}}} |oben=bottom|unten=top}}:1em | bottom:1em; margin-top:1em}}; padding: 0.25em; overflow: hidden; word-break: break-word; word-wrap: break-word; {{{style|}}}" {{#if: {{{id|}}} | id="{{{id}}}"}}>{{#if: {{{ICON|}}} | 
<div class="noviewer noresize {{#ifeq: {{{ICON.nomobile|}}} | 1 | nomobile}} {{{ICON.class|}}}" style="display: table-cell; padding-bottom: 0.2em; padding-left: 0.25em; padding-right: 1em; padding-top: 0.2em; vertical-align: middle;" {{#if: {{{ICON.id|}}} | id="{{{ICON.id}}}"}} aria-hidden="true" role="presentation">{{{ICON}}}</div>}}
<div style="display: table-cell; vertical-align: middle; width: 100%;">
<div {{#if:{{{TEXTBREITE|}}} | {{#switch: {{lc:{{{TEXTBREITE|}}}}} |0|-|none= |#default=style="max-width:{{{TEXTBREITE|70}}}em"}}}} {{#if: {{{lang|}}} | lang="{{{lang}}}"}} {{#if: {{{dir|}}} | dir="{{{dir}}}"}} {{#if: {{{role|}}} | role="{{{role}}}"}}>
{{{INHALT}}}</div>
</div></div>
  |#default=<div class="error">FEHLER – [[Vorlage:Hinweisbaustein]] mit unbekannter POSITION</div>}}</onlyinclude>

<noinclude>{{Dokumentation/Dokuseite}}</noinclude>
{{TemplateData|JSON=
{ "description": "'''Hinweisbaustein''' in dezenter Gestaltung wie in Artikeln üblich; barrierefrei",
  "params": {
     "INHALT":
        { "label":       "Nutztext",
          "description": "Textbereich",
          "type":        "content",
          "required":    true },
     "POSITION":
        { "label":       "Position",
          "description": "Position im Artikel",
          "type":        "line",
          "required":    false,
          "suggestedvalues": [
            { "code":  "oben",
              "label": "Kopf der Seite, volle Breite" },
            { "code":  "innerhalb",
              "label": "beliebig in der Seite" },
            { "code":  "unten",
              "label": "Fuß der Seite, volle Breite" }
                             ],
          "default":     "innerhalb",
          "example":     "oben" },
     "vollbreit":
        { "label":       "",
          "description": "(nur <code>[[#templatedata:POSITION|POSITION=innerhalb]]</code>) Box soll ganze verfügbare Breite einnehmen (Vorgabe) oder ggf. auf die Breite des Inhalts reduziert werden",
          "type":        "boolean",
          "required":    false,
          "default":     "1",
          "example":     "0" },
     "class":
        { "label":       "",
          "description": "zusätzliche Klassen als Leerzeichen-getrennte Aufzählung",
          "type":        "line",
          "required":    false },
     "noprint":
        { "label":       "",
          "description": "vom Druck ausschließen",
          "type":        "boolean",
          "required":    false,
          "default":     "0",
          "example":     "1" },
     "style":
        { "label":       "",
          "description": "zusätzliche CSS-Deklarationen",
          "type":        "line",
          "required":    false },
     "SCHRIFT%":
        { "label":       "Schriftgröße",
          "description": "Schriftgröße in Prozent",
          "type":        "number",
          "required":    false,
          "default":     "100",
          "example":     "92" },
     "TEXTBREITE":
        { "label":       "Textbreite",
          "description": "Maximale Länge der Fließtext-Zeilen (nicht die Breite der Box) in&nbsp;<code>em</code> zur besseren Lesbarkeit auf breiten Bildschirmen; mit <code>-</code> oder <code>0</code> ohne Breitenbeschränkung",
          "type":        "line",
          "required":    false,
          "default":     "70",
          "example":     "-" },
     "id":
        { "label":       "Anker",
          "description": "Fragmentbezeichner (Sprungziel)",
          "type":        "line",
          "required":    false },
     "role":
        { "label":       "ARIA-Rolle (für Nicht-Sehende)",
          "description": "[[Accessible Rich Internet Applications|ARIA]]-Rolle",
          "type":        "line",
          "required":    false,
          "suggestedvalues": [
            { "code":  "navigation",
              "label": "Baustein ist wesentlich für die Navigation zwischen Seiten oder über die gesamte Seite, etwa im Zusammenhang mit Begriffsklärungshinweisen usw." },
            { "code":  "contentinfo",
              "label": "Baustein beschreibt kurzgefasst den Inhalt der gesamten Seite, etwa [[Vorlage:Begriffsklärung]]" }
                             ] },
     "lang":
        { "label":       "Sprache",
          "description": "Sprachcode nach [[ISO 639]]",
          "type":        "line",
          "required":    false },
     "dir":
        { "label":       "Schreib&shy;richtung",
          "description": "Schreibrichtung (nicht erben)",
          "type":        "line",
          "required":    false,
          "default":     "(ltr)",
          "example":     "rtl" },
     "ICON":
        { "label":       "Icon",
          "description": "Eyecatcher (redundant)<noexport>.<br />
Icons sind nur dekorativ, und die vom Publikum erwartete Funktion wäre, dass sie ggf. mit einer Projektseite verlinkt sind oder überhaupt nicht.<br />
Es dürfen deshalb nur Public-Domain-Grafiken verwendet werden, weil eine Verlinkung mit der Lizenz an dieser Stelle sehr irritierend wäre.<br />
Falls ein Tooltip-Text als letzter Datei-Parameter angegeben wurde, muss auch mittels <code>&#124;alt=&#124;</code> die Interpretation des Tooltips als Bildbeschreibung unterbunden werden.</noexport>",
          "type":        "content",
          "required":    false },
     "ICON.class":
        { "label":       "Icon class",
          "description": "Klassen für Icon als Leerzeichen-getrennte Aufzählung",
          "type":        "line",
          "required":    false },
     "ICON.id":
        { "label":       "Icon id",
          "description": "Fragmentbezeichner für Icon",
          "type":        "line",
          "required":    false },
     "ICON.nomobile":
        { "label":       "Icon mobil",
          "description": "Icon auf Mobilgeräten nicht anzeigen",
          "type":        "boolean",
          "required":    false,
          "default":     "0",
          "example":     "1" }
            },
  "format": "block"
}
|TOC=1}}

== Kopiervorlagen ==
<syntaxhighlight lang="wikitext" copy="1">
{{Hinweisbaustein |INHALT=}}
{{Hinweisbaustein
 |POSITION=
 |noprint=1
 |ICON=
 |INHALT=
}}
</syntaxhighlight>

== Beispiele ==
<syntaxhighlight lang="wikitext" style="white-space:pre-wrap; overflow:auto;">
{{Hinweisbaustein |INHALT=Kopf des Artikels |POSITION=oben |ICON=[[Datei:Face-smile.svg|22px|verweis=|alt=|Geht ja gut los]]}}
</syntaxhighlight>
{{Hinweisbaustein |INHALT=Kopf des Artikels |POSITION=oben |ICON=[[Datei:Face-smile.svg|22px|verweis=|alt=|Geht ja gut los]]}}

<syntaxhighlight lang="wikitext" style="white-space:pre-wrap; overflow:auto;">
{{Hinweisbaustein |INHALT=Dies ist ein Smiley. |ICON=[[Datei:Face-smile.svg|22px|verweis=|alt=|Lächel!]]}}
</syntaxhighlight>
{{Hinweisbaustein |INHALT=Dies ist ein Smiley. |ICON=[[Datei:Face-smile.svg|22px|verweis=|alt=|Lächel!]]}}

<syntaxhighlight lang="wikitext" style="white-space:pre-wrap; overflow:auto;">
{{Hinweisbaustein |INHALT=Nutztext zu Fuß |POSITION=unten}}
</syntaxhighlight>
{{Hinweisbaustein |INHALT=Nutztext zu Fuß |POSITION=unten}}

== Barrierefreiheit ==
Dieses Muster verzichtet auf [[Hilfe:Textgestaltung/Barrierefreiheit#Layout-Tabelle|Layout-Tabellen]] und blendet das Icon bei [[Screenreader]]n aus.
{{Dokumentation/Siehe auch|Liste=
* [[Vorlage:Standardbaustein]] – weitere Designvarianten

Es entspricht näherungsweise:
* [[Vorlage:Bausteindesign1]] – <code>POSITION=oben</code>
* [[Vorlage:Bausteindesign2]] – <code>POSITION=unten</code>
* [[Vorlage:Bausteindesign3]] – <code>POSITION=innerhalb</code>
}}
<includeonly>
[[Kategorie:Vorlage:für Vorlagen]]
</includeonly>