HTML
Hier finden Sie eine Reihe von HTML-Tricks, welche auch ausserhalb von WordPress hervorragend funktionieren.
Wir empfehlen Ihnen den Einsatz eines Child-Themes – damit sind Sie sicher, dass Ihre Anpassungen bei einem Theme-Update nicht überschrieben werden. Wie Sie ein Child-Theme erstellen, erfahren Sie im Beitrag «Ein Child-Theme anlegen – ein Must im Webdesign».
Der Mauszeiger kann auf unterschiedlichste Arten dargestellt werden. Zumeist erkennen Webbrowser die gerade benötigte Darstellung von alleine. Wenn Sie nachhelfen müssen – oder eine andere Darstellung erzwingen wollen, – bedarf es eines Eingriffs. Immerhin ist das sehr einfach.
Offen gestanden: Wir haben uns lange überlegt, ob wir diesen Hack vorstellen wollen. Der Vollständigkeit halber tun wir es. Die Deaktivierung des Kontextmenüs – bzw. des Rechtsklicks – schränkt die User allerdings ein. Wir empfehlen darum, sparsam mit diesem Trick umzugehen.
Kennen Sie den progress-Tag in HTML? Oder den meter-Tag? Die beiden haben es in sich, werden aber irgendwo zwischen selten und kaum genutzt. Zeit, die beiden Tags einmal genauer anzusehen. Mit ihnen lassen sich nämlich höchst einfach Fortschrittsbalken und/oder Balkendiagramme erstellen.
Der Browser kann Webseiten als Vollbild-Variante darstellen. Bei dieser wird eine Webseite auf die ganze Bildschirmgrösse ausgedehnt. Dabei verschwinden Bedienelemente wie Titelleiste, Menüs und ebenfalls die Windows-Taskleiste unten. Normalerweise startet man diese Full-Screen-Anzeige mit der «F11»-Taste (auf Macs: Shift+Cmd+F) und kehrt mit derselben Taste (oder Kombination) wieder zurück. Doch das geht auch per Mausklick.
Heute wagen wir uns an einen der cooleren Tricks aus der Praxis von Dr. Code: Wir bauen einen Schalter, mit dem sich zwischen zwei Modulen (oder Zeilen) hin und her schalten lässt. Egal ob ein Bild-, Formular- oder Textmodul (oder ganz was anderes) und jede beliebige Mischung daraus.
Im Slider-Modul des Divi-Themes lässt sich ein Button – etwa für zusätzliche Information o.ä. – anzeigen. Ab und an bräuchte man aber womöglich einen zweiten oder dritten Button. Ein solcher lässt sich ganz einfach erstellen.
Wenn Sie das WPML-Plugin für Ihre übersetzten Websites benutzen, werden Sie ab und an Grenzen finden - vor allem, wenn Sie sprachangepasste Inhalte (Texte, Bilder usw.) in Ihren Templates verwenden. Um solche Templates ebenfalls mehrsprachig zu machen, bietet WPML einen praktischen String an, den Sie nutzen können. Wir stellen Ihnen diesen hier vor.
Wenn Sie eine neue Website aufbauen werden Sie zweifelsohne oft im CSS-Stylesheet unterwegs sein und Anpassungen vornehmen. Praktisch wäre es, wenn Sie da eine Übersichtsseite mit den gängigsten Darstellungen hätten. So sehen Sie am besten, wie die Stylings zusammenpassen. Ein solches Styling-Showcase ist mit unserem Baukasten-Code schnell erstellt.
Das Divi-Theme kommt mit einem eigenen Icon-Font daher. Meist wird der sauber angezeigt - es gibt aber ab und an Pannen. Wenn Sie sicherstellen möchten, dass der Divi-Icon-Font in jedem Fall angezeigt wird, sollten Sie den Font in Ihre Website einbinden. Es ist ganz einfach.
Mal eben mit dem Textmarker was markieren – das sollte man natürlich am Monitor nicht tun. Trotzdem zeigen wir Ihnen, wie Sie Text-Highlights hinzufügen können. Gleich fünf Varianten haben wir am Start.
Den Mobilversionen der Browser lässt sich - vornehmlich unter Android - Farbe geben. Statt in eintönigem Hellgrau erscheint der Mobilbrowser beim Seitenaufruf in Farbe. Ist ganz einfach zu machen und wir zeigen Ihnen wie.
Font Awesome hat einige Icons im Portfolio, welche sich perfekt für eine simple Animation eignen und sich hernach um die eigene Achse drehen oder pulsieren. Das ist denkbar einfach umzusetzen - wir zeigen Ihnen wie.
Keine Inhalte gefunden.
Werbung
