techboys.de: Ratgeber für Netzwerksicherheit, VPNs & IPTVtechboys.de: Ratgeber für Netzwerksicherheit, VPNs & IPTV
  • Smart Home
  • TV & Streaming
  • Tech
  • VPN & Netzwerk
Du liest: How to: WordPress Widgets auf Smartphones verbergen
Teilen
Aa
techboys.de: Ratgeber für Netzwerksicherheit, VPNs & IPTVtechboys.de: Ratgeber für Netzwerksicherheit, VPNs & IPTV
Aa
  • Die 10 besten VPN im Vergleich
  • Tech
  • Reviews
  • Dreambox
Suchbegriff eingeben
  • Smart Home
  • TV & Streaming
  • Tech
  • VPN
Du hast bereits ein Konto? Anmelden
Folge Uns
  • Kontakt
  • Impressum
  • Datenschutzerklärung (EU)
  • Cookies
© 2022 techboys.de. Erstellt mit Liebe & Vielzuviel Espresso.

Du bist hier: Home » WordPress

WordPress

How to: WordPress Widgets auf Smartphones verbergen

Gary Madeo
Aktualisiert: 2. März 2020 um 18:28 Uhr
Veröffentlicht am 13. Januar 2020 1.9k Mal gelesen
Teilen
3 Min
WordPress mit Widget Options 1 • techboys.de: Ratgeber für Netzwerksicherheit, VPNs & IPTV
Teilen

Wie man Widgets in der WordPress-Seitenleiste auf Smartphones und Tablets ganz leicht verbergen kann, erkläre ich in diesem einfachen Tutorial.

Trotz sogenannter responsive Themes und angepasster  Darstellung auf mobilen Endgeräten steht man als WordPress-Admin vor einem kleinen Problem: auf Smartphone-Displays, und mögen diese auch immer größer werden, ist der Platz beschränkt.

1. Schritt: ZigWidgetClass Plugin installieren

ZigWidgetClass

Alternativ der Link zum manuellen Installieren.

Mit Hilfe dieses Plugin ist schon einmal die Hauptarbeit getan – also fast. Wie man ein Plugin aus dem Administrator-Bereich installiert, erspare ich mir an dieser Stelle, da ich davon ausgehen kann, dass ihr das auch ohne reichhaltige Bebilderung gut hinbekommt.

- Werbung -
Ad image

2. Schritt:Code-Schnipsel erstellen

In diesem Fall gehen wir davon aus, dass wir die Widgets auf Smartphones verbergen wollen, wenn der Benutzer im sog. Portrait-Modus auf eure Webseite surft. Hält er das Gerät dagegen quer, wird das Widget angezeigt. Das Verhalten steuert ihr mit der Angabe (max-width: xxxpx).

@media only screen and (max-width:480px) {
 .mobile_free {
 display: none !important;}
 }

Den nun erstellten Code-Schnipsel versteht euer WordPress Theme zunächst nicht, ihr müsst das neue Vokabular in eure Style.css einfügen. Die meisten aktuellen WordPress Themes bieten mittlerweile eine Option für eigene custom.css-Anpassungen. Wenn gar nichts hilft und keine andere Option vorhanden ist, dann kopiert das direkt in eure style.css – die Änderungen sind aber beim nächsten Update des Themes weg! Alternative: Jetpack etwa bietet eigens ein Modul hierfür an– falls ihr Jetpack eh bereits nutzt, könnt ihr dieses Option aktivieren.

3. Schritt: Widgets editieren

Wir werden nun die erstellte Klasse mobile_free in alle Widgets einfügen, die wir ausblenden wollen. Persönlich handhabe ich es so, dass ich grundsätzlich alle WordPress Widgets im Portrait-Modus verbergen möchte.

Über Design->Widgets gelangt ihr in den Bereich, der eure Widgets-Darstellung kontrolliert. Wählt nun ein Widget aus. Ihr werdet nun eine neue Option finden, nämlich CSS-Classes. Hier fügt ihr nun die Klasse mobile_free ein, siehe Screenshot:

Hide on Mobile e1427178958804 • techboys.de: Ratgeber für Netzwerksicherheit, VPNs & IPTV
Euer Widgets-Bereich sieht abhängig vom Theme anders aus. Klappt aber eines der Widgets auf und ihr werdet den Eintrag “ZigWidget Class Plugin” finden.

Das war es auch schon. Das Widget sollte nun auf Smartphones nicht mehr dargestellt werden und hier einen deutlichen Performance-Gewinn für WordPress bescheren. Fügt die Angabe nun in alle Widgets ein, die ihr verbergen wollt.

THEMA: CSS Tutorials, WordPress
Diesen Beitrag teilen
Facebook Twitter Whatsapp Whatsapp Email Link kopieren
Avatar-Foto
von Gary Madeo Gründer und Autor
Folgen:
Vor Jahren nebenher aus Spaß an der Freude gegründet, wird er dieses Projekt so schnell nicht mehr los. Bloggt und kümmert sich um die gesamte Technik hinter einem Tech-Blog. Schreibt zur Ablenkung über Fußball, meist ohne Magenschmerzen zu bekommen.
Vorheriger Beitrag SOUNDFORM ELITE™ Hi Fi Smart Speaker Wireless Charger 4 • techboys.de: Ratgeber für Netzwerksicherheit, VPNs & IPTV Belkin und Devialet stellen smarten HiFi-Lautsprecher mit drahtloser Ladefunktion vor
Nächster Beitrag Die besten VPN-Anbieter VPN-Anbieter Test 2020: Acht VPNs im Speed-Vergleich

Unsere Themen

Apple

28 Beiträge
Enigma2

TV & Streaming

21 Beiträge

Games

99 Beiträge
techboys.de Kontakt

Reviews

88 Beiträge
Smart Home

Smart Home

79 Beiträge
Tech bei techboys.de

Tech

129 Beiträge

VPN

45 Beiträge

WordPress

17 Beiträge

Beliebte Beiträge

NordVPN-Router einrichten
🛡️ VPN-Router Anleitung | Tutorial für NordVPN-Einsteiger 📚
22. April 2023
Tivusat OScam 1 1 • techboys.de: Ratgeber für Netzwerksicherheit, VPNs & IPTV
Tivùsat OScam geht nicht mehr? Das kannst Du jetzt tun!
28. Dezember 2022
NordVPN Test 2023 2 • techboys.de: Ratgeber für Netzwerksicherheit, VPNs & IPTV
NordVPN Test 2023 – Bekannt, beliebt und gut?
ExpressVPN Test 2023
🔝 ExpressVPN Test 2023 – Wo wir sind, ist oben!
pexels photo 7238759 1 • techboys.de: Ratgeber für Netzwerksicherheit, VPNs & IPTV
Die beste deutsche Streamerin 2023
10. März 2023

Alle News. Jederzeit.

Keine weiteren Beiträge mehr verpassen.

Ich habe die Allgemeinen Geschäftsbedingungen gelesen und stimme ihnen zu.

Smart Home

Ikea Symfonisk Standleuchte • techboys.de: Ratgeber für Netzwerksicherheit, VPNs & IPTV
Ikea Stehlampe im Smart Home: Sprachsteuerung mit Alexa, Siri und Google Assistant 🛋️💡🎙️
1. Mai 2023 229 Mal gelesen
Govee Deals • techboys.de: Ratgeber für Netzwerksicherheit, VPNs & IPTV
Govee Deals: mit bis zu 30 % Rabatt ins neue Jahr starten
1. Januar 2023 403 Mal gelesen
Philips Hue natuerlichesLicht • techboys.de: Ratgeber für Netzwerksicherheit, VPNs & IPTV
Philips Hue natürliches Licht ist endlich da, sorgt aber für Ärger!
23. Dezember 2022 1k Mal gelesen

Beliebte Beiträge

NordVPN-Router einrichten
🛡️ VPN-Router Anleitung | Tutorial für NordVPN-Einsteiger 📚
22. April 2023 9.7k Mal gelesen
Tivusat OScam 1 1 • techboys.de: Ratgeber für Netzwerksicherheit, VPNs & IPTV
Tivùsat OScam geht nicht mehr? Das kannst Du jetzt tun!
28. Dezember 2022 6.5k Mal gelesen
NordVPN Test 2023 2 • techboys.de: Ratgeber für Netzwerksicherheit, VPNs & IPTV
NordVPN Test 2023 – Bekannt, beliebt und gut?
25. März 2023 2.1k Mal gelesen

Über uns!

techboys.de: Ratgeber für Netzwerksicherheit, VPNs & IPTV

Du möchtest mit uns zusammenarbeiten?

Du hast einen heißen Tipp für uns oder auch einfach nur eine Frage?

Nachricht
Erstellt mit Liebe ❤ & vielzuviel ☕ Espresso. © 2012- 2023 techboys.de.
  • Kontakt
  • Impressum
  • Datenschutzerklärung (EU)
  • Cookies
techboys.de: Ratgeber für Netzwerksicherheit, VPNs & IPTV
Cookie-Einstellungen
Um dir ein optimales Erlebnis zu bieten, verwenden wir Technologien wie Cookies, um Geräteinformationen zu speichern und/oder darauf zuzugreifen. Wenn du diesen Technologien zustimmst, können wir Daten wie das Surfverhalten oder eindeutige IDs auf dieser Website verarbeiten. Wenn du deine Zustimmung nicht erteilst oder zurückziehst, können bestimmte Merkmale und Funktionen beeinträchtigt werden.
Funktional Immer aktiv
Die technische Speicherung oder der Zugang ist unbedingt erforderlich für den rechtmäßigen Zweck, die Nutzung eines bestimmten Dienstes zu ermöglichen, der vom Teilnehmer oder Nutzer ausdrücklich gewünscht wird, oder für den alleinigen Zweck, die Übertragung einer Nachricht über ein elektronisches Kommunikationsnetz durchzuführen.
Vorlieben
Die technische Speicherung oder der Zugriff ist für den rechtmäßigen Zweck der Speicherung von Präferenzen erforderlich, die nicht vom Abonnenten oder Benutzer angefordert wurden.
Statistiken
Die technische Speicherung oder der Zugriff, der ausschließlich zu statistischen Zwecken erfolgt. Die technische Speicherung oder der Zugriff, der ausschließlich zu anonymen statistischen Zwecken verwendet wird. Ohne eine Vorladung, die freiwillige Zustimmung deines Internetdienstanbieters oder zusätzliche Aufzeichnungen von Dritten können die zu diesem Zweck gespeicherten oder abgerufenen Informationen allein in der Regel nicht dazu verwendet werden, dich zu identifizieren.
Marketing
Die technische Speicherung oder der Zugriff ist erforderlich, um Nutzerprofile zu erstellen, um Werbung zu versenden oder um den Nutzer auf einer Website oder über mehrere Websites hinweg zu ähnlichen Marketingzwecken zu verfolgen.
Optionen verwalten Dienste verwalten Anbieter verwalten Lese mehr über diese Zwecke
Einstellungen
{title} {title} {title}
 

Lade Kommentare …
 

    Logo techboys.de: Ratgeber für Netzwerksicherheit, VPNs & IPTV
    Willkommen zurück!

    Anmelden!

    Passwort vergessen?