EN
Unser Responsive Content Shortcode bietet dir die Möglichkeit, Inhalte teilweise nur für bestimmte Endgeräte anzuzeigen. So können etwas Beschreibungstexte auf dem Smartphone zusammengefasst ausgegeben werden, um die Seite nicht zu lang erscheinen zu lassen.
Responsive Content ist gerade in aller Munde und je nach Projekt sollte man diesen Punkt definitiv nicht vernachlässigen. Gerade im Modebereich ist die Zahl der Mobilen User mittlerweile über dem der Desktop-Anwender und wenn du dann einen 2.000 Wörter Artikel zum Thema „rote Damen Pumps“ auf deiner Seite hast, wird es einen Benutzer sehr schnell vergraulen. Daher haben wir uns etwas einfallen lassen: Zwei Shortcodes zum Anzeigen und Verstecken von Inhalten je nach Browserauflösung.
hidden-Shortcode
Code
[pastacode lang=“php“ manual=“%26%23091%3Bhidden%20screen%3D%22xs%22%5DDieser%20Text%20wird%20nur%20bei%20einem%20Smartphone%20nicht%20angezeigt!%26%23091%3B%2Fhidden%5D%0A%26%23091%3Bhidden%20screen%3D%22lg%22%5DDieser%20Text%20wird%20nur%20bei%20einem%20gro%C3%9Fen%20Desktop%20nicht%20angezeigt!%26%23091%3B%2Fhidden%5D“ message=““ highlight=““ provider=“manual“/]
Attribute
Für alle verfügbaren Klassen schaue bitte unter http://holdirbootstrap.de/css/#responsive-utilities
| Name | Inhalt | Bedeutung |
| screen | xs | Wird auf allen Geräten ausgeblendet, die via Prefix definiert sind. (xs, sm, md, lg) |
| display | block, inline, inline-block | siehe: hier |
visible-Shortcode
Code
[pastacode lang=“php“ manual=“%26%23091%3Bvisible%20screen%3D%22xs%22%5DDieser%20Text%20wird%20nur%20bei%20einem%20Smartphone%20angezeigt!%26%23091%3B%2Fvisible%5D%0A%26%23091%3Bvisible%20screen%3D%22lg%22%5DDieser%20Text%20wird%20nur%20bei%20einem%20gro%C3%9Fen%20Desktop%20angezeigt!%26%23091%3B%2Fvisible%5D“ message=““ highlight=““ provider=“manual“/]
Attribute
Für alle verfügbaren Klassen schaue bitte unter http://holdirbootstrap.de/css/#responsive-utilities
| Name | Inhalt | Bedeutung |
| screen | xs | Wird auf allen Geräten angezeigt, die via Prefix definiert sind. (xs, sm, md, lg) |
War dieser Artikel hilfreich?
Keine Kommentare vorhanden