Det finns många olika metoder för att implementera lazy loading på din webbplats. Du är välkommen att ta en titt på vår rankade lista över de bästa pluginsen för WordPress som stöder långsam laddning.
Det finns många gratis plugins i WordPress-katalogen som kan användas för att lazy loada bilder och videor. Efter att ha övervägt några dussin plugins och testat några har vi hittat två plugins som avsevärt ökar webbplatsens prestanda. Om du är angelägen om att implementera lazy loading, överväg alternativen nedan.
Använda WP Rocket (Premium)
WP Rocket är det enklaste sättet att implementera långsam laddning på din webbplats. Dessutom tar processen att aktivera det mindre än en minut. LazyLoad är namnet på pluginet som WP Rocket inkluderar som sin version av lazy image loading.
När LazyLoad är aktiverat kommer WP Rocket omedelbart att stoppa WordPress inbyggda bildinläsning för att förhindra eventuella problem.
Följ stegen nedan för att aktivera WP Rockets LazyLoad-funktion: -
- Du kan aktivera LazyLoad genom att gå till Inställningar > WP Rocket > Mediapanel i din WordPress-installation.
- Klicka på "Aktivera för bilder" under LazyLoad-området högst upp på skärmen.
- Klicka på "Spara ändringar" efter att du har gjort ditt val.
Det är allt annat som måste göras. Som ett resultat kommer besökare att uppleva långsam laddning av foton.
LazyLoad erbjuder lazy loading för ytterligare HTML-element, såsom iframes och videor, till skillnad från den nativa metoden som WordPress erbjuder. Dessutom kommer den att använda lazy loading för bakgrundsbilder om sådana bilder appliceras inline för specifika HTML-komponenter.
Om du vill använda WordPress inbyggda funktion för lazy-loading av bilder kan du inaktivera LazyLoad-alternativet i WP Rocket. Å andra sidan stöds inte den nya laddningsfunktionen av alla webbläsare ännu. Dessutom är installationen av WordPress endast fokuserad på foton. Därför är WP Rockets LazyLoad fortfarande det överlägsna alternativet, särskilt om din webbplats har många bilder, videor och inbäddningar.
Saker att tänka på när du aktiverar WP Rockets Native Lazy Loading
Även om WP Rocket inte inkluderar automatisk kompatibilitet med Chrome-webbläsare som använder inbyggd lazy loading, har du fortfarande möjlighet att välja stöd för Chromes inbyggda lazy loading genom att aktivera det via ett hjälpprogram. Likaså är det fallet även om WP Rocket inte inkluderar automatisk kompatibilitet med andra webbläsare som använder inbyggd lazy loading.
Du kan säkerställa följande saker genom att använda detta hjälpsamma plugin:
- Var och en av dina foton kommer att innehålla den grundläggande HTML-syntaxen för att använda inbyggd lazy loading; webbläsare som är kompatibla med Chrome kommer automatiskt att använda inbyggd lazy loading; alla andra webbläsare kommer automatiskt att använda WP Rockets LazyLoad.
- Du har möjlighet att fortsätta använda vår robusta LazyLoad-teknik eller byta till Chromes inbyggda funktion för lazy loading.
Det är helt upp till dig! Först, testa båda metoderna på din plats och välj den som fungerar bäst för dig.
Använda a3 Lazy Load (gratis)
Om du letar efter ett gratis alternativ rekommenderar vi att du använder a3 L az y Load- pluginet. Du kan inaktivera lazy loading för specifika bilder och sidor med hjälp av a3-pluginet. Dessutom tillåter det fördröjd laddning av videor på din webbplats :
Dessutom underlättar detta plugin långsam inläsning av externa bilder och videor. WordPress kärnimplementering utför inte en sådan åtgärd.
Du kan installera och aktivera det här pluginet från din WordPress-instrumentpanel. Nu kan du anpassa verktygets inställningar.
Steg 2: Justera inställningarna för plugin-bilden
Gå sedan till Inställningar > a3 Lazy Load. Om du tittar under Lazy Load Activation aktiveras plugin-programmet som standard efter installationen.
Öppna nu fliken LazyLoad-bilder. Du kan (1) välja vilka webbplatsbilder som ska fördröjas och (2) tillhandahålla en reservfunktion för webbläsare som vägrar att acceptera JavaScript. För bilder som du inte vill ska fördröja laddningen kan du (3) ställa in en CSS-klass:
Standardinställningarna har alla alternativ aktiverade . Vi rekommenderar starkt att du behåller den här inställningen. Skapa en CSS-klass som låter dig hoppa över uppskjuten inläsning för specifika bilder.
Steg 3: Justera plugin-videoinställningarna
Fliken Lazy Load-videor och iframes är nästa steg. Med a3 Lazy Load kan du välja fördröjd laddning för specifika klipp precis som du kan med bilder.
Pluginet tillåter videor i (1) innehåll och widgetar och tillhandahåller (2) en reservfunktion för webbläsare som inte stöder JavaScript:
Du kan ange en CSS-klass i videoinställningarna (3) för att exkludera specifika videor från uppskjuten laddning. Om du vill ha en enklare konfiguration, använd samma klass som du valde i bildavsnittet.
Fler plugins för WordPress som laddar lat
Förutom WP rocket och a3 Lazy Load finns det flera användbara plugins för lazy load som du kan överväga:
- Lat laddning för videor
- BJ Lat Ladda
- Ladda fler produkter för WooCommerce
- WordPress oändlig scrollning – Ajax Ladda mer
- Disqus villkorlig belastning
- Lat laddning för kommentarer
Slutliga tankar
Det är viktigt att vara medveten om eventuella konflikter när du uppdaterar eller modifierar din webbplats. Kolla in den här listan över vanliga problem i samband med lazy load om du upptäcker att lazy loading har orsakat att någon aspekt av din webbplats blir obrukbar.
Det är möjligt att det kan uppstå inkompatibiliteter till följd av att funktionen för lazy loading inte tillämpas på bilder som laddas upp av plugins som Revolution Slider och Envira Gallery. Hela listan över kompatibla plugins finns här.
Den här artikeln, liksom många andra, finns på Seahawk Media Blog .
