Trusted WordPress tutorials, when you need them most.
Beginner’s Guide to WordPress
WPB Cup
25 Million+
Websites using our plugins
16+
Years of WordPress experience
3000+
WordPress tutorials
by experts

Hur man döljer ett WordPress widget på mobilen (lätt för Beginner)

Vill du dölja ett specifikt WordPress widget för mobila användare?

Widgets är dynamiskt content som ofta visas i sidofältet eller footern på en website. Ibland kan en widget se bra ut på en stationär dator eller bärbar dator men ej på mindre mobila enheter.

I den här artikeln kommer vi att visa dig hur du döljer en WordPress widget på mobila enheter utan att skriva någon kod.

Hiding a WordPress widget on mobile devices

Varför dölja en widget på mobilen i WordPress?

Your website kan se bra ut på stora skärmar på datorer, men det betyder inte nödvändigtvis att den kommer att se bra ut på mindre skärmar också.

Även om layouten inte omedelbart ser rörig ut när du viewar mobilversionen av din WordPress site, är det viktigt att alltid rulla längst ner.

I de flesta responsiva WordPress themes kommer widgetar att visas på olika ställen beroende på storleken på besökarens vy. Ofta flyttar WordPress teman widgets längst ner på sidan.

Låt oss titta på ett exempel.

Följade image visar hur en site ser ut på en stationär dator. Som you kan se visas widgetar för search högst upp i sidebaren.

An example of a WordPress search widget

Widgeten för sidebar visas dock under innehållet när den viewas på en smartphone.

Det innebär att visitorerna måste rulla längst ner på sidan för att kunna searcha dina blogginlägg, produkter eller annat content.

An example of duplicate search widgets, on a smartphone or tablet

Ännu värre är att detta beteende ibland resulterar i att två identiska widgetar visas bredvid varandra.

Många bloggare i WordPress placerar till exempel en widget med kontaktinformation både i sidebaren och i footern. Om dessa widgetar flyttas kan mobila besökare se samma widgetar bredvid varandra.

Med det sagt, låt oss se hur du enkelt kan dölja ett widget på mobilen i WordPress.

Så här döljer du en widget på mobilen i WordPress

Det enklaste sättet att dölja widgets för mobila användare är att använda pluginet Widget Options. Med detta plugin kan du visa olika widgetar beroende på datum, användarens roll, device och mer.

Först måste du installera och aktivera pluginet Widget Options. För mer detaljer, se vår Step-by-Step guide om hur du installerar ett plugin för WordPress.

Efter aktivering måste du gå till sidan Appearance ” Widgets i din WordPress dashboard.

The widgets section of the WordPress admin

På den här vyn ser du alla widgetar som du har lagt till på din WordPress website.

För att edit:a en widget klickar du bara på widgets namn.

Expand your widget to view the options

I widgetinställningarna kommer du att se några nya sektioner som lagts till av Widget Options plugin.

Börja med att clicka på den lilla mobile iconen och se till att ”Hide/Show” dropdown visar ”Hide on checked devices”.

How to hide and show widgets to mobile users

Därefter kontrollerar du bara varje device där du vill dölja widgeten.

Du kommer vanligtvis att vilja kontrollera boxen bredvid ”Tablet” och ”Mobile”.

Hiding a widget on mobile devices

Därefter klickar du på knappen ”Save” för att lagra dina ändringar.

Gå nu vidare och besök din WordPress website med en mobil device. Widgeten kommer inte längre att visas i widgetar area.

An example of a WordPress widget, seen on a mobile device

Så här gör du en mobilversion av en widget i WordPress

Ibland kanske du vill visa en version av en widget för mobila besökare och en annan för användare av stationära datorer.

Till exempel kanske du vill visa dina fem senaste inlägg på datorn men bara tre inlägg på mobila enheter så att vyn inte ser rörig ut.

För att göra det behöver du helt enkelt add to två separata widgetar för senaste inlägg på din site. För mer information, vänligen se vår Step-by-Step guide om hur man lägger till widgetar i WordPress.

Du kan sedan konfigurera en widget så att den visas på stationära datorer och den andra så att den visas på mobila enheter.

Öppna först den widget som du vill visa för användare på skrivbordet. Klicka sedan på den lilla mobila ikonen och se till att dropdown-rutan ”Dölj/visa” är inställd på ”Dölj på kontrollerade enheter”.

Därefter går du vidare och kontrollerar boxarna bredvid ”Tablet” och ”Mobile”.

Displaying a widget on desktops only

Nu kommer widgeten bara att visas för visitors som använder en stationär dator.

Därefter kan du göra några ändringar i widgeten. Till exempel skriver vi ”5” i boxen bredvid ”Antal posts som ska visas”.

När du är slutförd, glöm inte att trycka på knappen ”Save” för att spara dina settings.

Saving widget settings in WordPress

Efter det är du redo att göra den andra widgeten endast mobil.

Upprepa helt enkelt samma process som beskrivs ovan, men den här gången kontrollerar du boxen bredvid ”Desktop” för att dölja widgeten på stationära enheter.

Showing a WordPress widget on mobile devices but not on desktops

Du kan nu göra ändringar i din mobila widget. Du kan till exempel skriva ”3” i boxen ”Number of posts to show”.

Som vanligt klickar du på ”Save” när du är slutförd. You har nu en skrivbordsversion och en mobilversion av samma widget.

Vi hoppas att den här artikeln hjälpte dig att lära dig hur du döljer en widget på mobila enheter i WordPress. Du kanske också gillar att kolla in vår lista över de mest användbara widgetarna för din site, eller se vår guide om hur du visar eller döljer widgetar på specifika pages.

If you liked this article, then please subscribe to our YouTube Channel for WordPress video tutorials. You can also find us on Twitter and Facebook.

Avslöjande: Vårt innehåll stöds av våra läsare. Det innebär att om du klickar på några av våra länkar, kan vi tjäna en provision. Se hur WPBeginner finansieras, varför det är viktigt, och hur du kan stödja oss. Här är vår editoriala process.

Avatar

Editorial Staff at WPBeginner is a team of WordPress experts led by Syed Balkhi with over 16 years of experience in WordPress, Web Hosting, eCommerce, SEO, and Marketing. Started in 2009, WPBeginner is now the largest free WordPress resource site in the industry and is often referred to as the Wikipedia for WordPress.

Den ultimata WordPress-verktygslådan

Få GRATIS tillgång till vår verktygslåda - en samling WordPress-relaterade produkter och resurser som varje professionell användare bör ha!

Reader Interactions

13 kommentarerLämna ett svar

  1. Syed Balkhi

    Hey WPBeginner readers,
    Did you know you can win exciting prizes by commenting on WPBeginner?
    Every month, our top blog commenters will win HUGE rewards, including premium WordPress plugin licenses and cash prizes.
    You can get more details about the contest from here.
    Start sharing your thoughts below to stand a chance to win!

  2. Hajime

    Thank you for the easy to understand guide. However, in my AvadaTheme, the device selection tab and checkboxes do not seem to appear.
    My AvadaTheme is V7.6.1. Is there a difference in specifications between versions?

    • WPBeginner Support

      There may be a conflict between the plugin and your theme, we would recommend checking with the plugin’s support and they should be able to assist!

      Administratör

  3. Aymen Boukhatem

    thank you so much for your help <3

    • WPBeginner Support

      You’re welcome :)

      Administratör

  4. Soorya

    Thanks for the guide. It was so helpful

    • WPBeginner Support

      Glad our guide was helpful! :)

      Administratör

  5. FRB Dogs "Rich"

    This was a great article to quickly allow me to hide extraneous footers that look like duplicates when on a mobile display as the side & footers were on the bottom. I hide one of them on a mobile device and voila! Looks so much more professional. Thank you!

    • WPBeginner Support

      You’re welcome, glad our guide was helpful :)

      Administratör

  6. Jean-Claude

    Thank you. Very helpful!

    JC

    • WPBeginner Support

      You’re welcome :)

      Administratör

  7. Mamooty Reev

    Does the plugin use php, js, or css to conditionally hide the widgets?

    • WPBeginner Support

      For a question like that, you would want to reach out to the plugin’s support and they would be able to let you know the current method being used.

      Administratör

Lämna ett svar

Tack för att du väljer att lämna en kommentar. Tänk på att alla kommentarer modereras enligt våra policy för kommentarer, och din e-postadress kommer INTE att publiceras. Vänligen använd INTE nyckelord i namnfältet. Låt oss ha en personlig och meningsfull konversation.