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 enkelt skapar responsiva gallerier för images i WordPress med Envira

Att skapa ett bildgalleri i WordPress kan vara frustrerande om de inbyggda funktionerna inte uppfyller dina behov. Många galleri-plugins lovar bra resultat men är ofta svåra att använda och gör din webbplats långsammare.

Envira Gallery erbjuder en enkel lösning. Det gör att du enkelt kan skapa fantastiska, responsiva bildgallerier i WordPress.

I den här artikeln visar vi hur du snabbt kan skapa och anpassa bildgallerier med hjälp av Envira.

How to easily create responsive WordPress image galleries with Envira

Varför är Envira Gallery bättre?

If you run a photography or portfölj site with a lot of images, then you already know the problems that come with creating an image gallery.

You might for example encounter issues with site speed, lack of organization, browser compatibility, device compatibility, and difficult setup.

Till skillnad från andra galleriplugins är Envira Gallery extremt snabb samtidigt som den är fullpackad med funktioner som responsiv design, lightbox- och bildspelsfunktionalitet, dra-och-släpp-byggare, mallar och videostöd.

Det har också andra tillägg, som skydd, som hjälper dig att skydda dina bilder. Å andra sidan hjälper taggtillägget dig att organisera alla dina bilder, djuplänka, fullskärm och superstorlek.

Envira kan också enkelt integreras med andra verktyg och plattformar som Instagram, Dropbox, WooCommerce och Pinterest.

Med detta i åtanke, låt oss ta en titt på processen för att skapa ett bildgalleri med Envira.

Lägga till ett responsivt bildgalleri med Envira Gallery

Envira Gallery är det bästa tillägget för image gallery för WordPress på marknaden.

I den här handledningen kommer vi att använda Envira Gallery Pro-versionen för att låsa upp fler funktioner. Du kan dock även skapa bildgallerier med hjälp av en gratisversion av Envira Gallery.

Envira Gallery website

Först måste du installera och aktivera insticksprogrammet Envira Gallery. Om du behöver hjälp kan du läsa vår guide om hur du installerar ett WordPress-tillägg.

Vid aktivering måste du gå till Envira Gallery Settings och ange din licensnyckel, som du hittar i ditt Envira Gallery-kontoområde.

Add the Envira Gallery license key

Därefter anger du nyckeln och klickar på knappen ”Verify Key”.

För att skapa ett nytt galleri måste du gå till Envira Gallery ” Add New från WordPress instrumentpanel.

Add new gallery

Du kan sedan ange ett namn för ditt galleri högst upp och klicka på knappen ”Välj filer från din dator” för att ladda upp bilder till det.

Envira Gallery låter dig också välja bilder från andra källor för ditt galleri. Du kan helt enkelt ladda upp bilder till mediebiblioteket i WordPress och använda dem i galleriet.

Editera inställningar för Imagely Gallery i Envira Gallery

När du har valt bilderna bör du kunna se miniatyrbilderna av bilderna.

View images in the gallery

Du kan ordna om images genom att helt enkelt drag and dropa dem i den order du vill visa.

Om du klickar på ikonen med pennan ser du fler alternativ. Till exempel kan du infoga metadata för image som titel och alt-tag.

Med Envira Gallery kan du lägga till HTML i bildtiteln och lägga till en länk till en sida eller webbplats i fältet ”Image Hyperlink”.

Add metadata to gallery images

När du är nöjd med metadata kan du klicka på fliken ”Configuration” för att konfigurera inställningarna för ditt bildgalleri.

Du kan välja hur just det här galleriet ska visas. Det finns till exempel olika gallerilayouter att välja mellan, och du kan aktivera latent laddning och latent ladd ningsfördröjning.

Set up config settings

Om du bläddrar nedåt ser du fler inställningar.

Med Envira Gallery kan du ändra row-höjd och marginaler, visa beskrivningar av bildgallerier, editera dimensionerna och storleken på images med mera.

Additional config settings for gallery

Därefter kan du växla till fliken ”Lightbox” och konfigurera inställningarna för lightboxen som visar hela bilderna när de klickas på.

Det finns alternativ för att välja ett tema, visa en bildtext eller titel, bildstorlek, aktivera pilvisning, dölja eller visa verktygsfältet för ljuslådegalleri, välja effekter för att öppna och stänga ljuslådan med mera.

Lightbox settings for image gallery

När du är klar med dina lightbox-inställningar vill du bläddra ner till botten av lightbox-fliken till avsnittet miniatyrbilder.

Dessa miniatyrbilder visas under ljuslådan när en användare klickar på en bild. Genom att klicka på en miniatyrbild kan användarna bläddra i galleriet.

Adjust thumbnails settings

Envira Gallery låter dig också ändra inställningarna för hur your gallery ska se ut på mobilen.

Byt bara till fliken ”Mobile” och aktivera möjligheten att skapa mobilanpassade galleribilder, redigera mobilmått, justera radhöjd, aktivera titel med mera.

Mobile gallery settings

Slutligen kan du gå till fliken ”Övrigt” för att se ytterligare inställningar för ditt bildgalleri.

Det finns till exempel möjlighet att ändra galleriets slug, ange anpassad CSS, importera ett galleri och mycket mer.

Miscellaneous settings in Envira

Du kan också exportera galleriet och kopiera bilder.

När du är nöjd med inställningarna för galleriet kan du trycka på knappen ”Publicera” för att göra galleriet tillgängligt.

Publish your image gallery

När du har publicerat ser du kortkoderna som du kan infoga i ett inlägg, en sida eller en widget för att visa ditt galleri.

För mer information, se vår guide om hur du lägger till shortcodes i WordPress.

Copy image gallery shortcodes

Lägga till ett gallery direkt i ett post eller page i WordPress

Nu när du har skapat ett bildgalleri med hjälp av Envira Gallery är nästa steg att lägga till det i ett blogginlägg eller på en landningssida.

När du är i WordPress innehållsredigerare, gå vidare och klicka på ”+” -knappen för att lägga till Envira Gallery-blocket.

Envira gallery block

När du har lagt till blocket kan du välja ditt galleri genom att klicka på rullgardinsmenyn i blocket Envira Gallery.

Du kommer då att se en preview av ditt image gallery i block editor. När du är nöjd med dess appearance publicerar du helt enkelt ditt post eller din page. You can then visit your website to see a responsive image gallery in action.

Image gallery preview

Bonustips för användning av Envira Gallery i WordPress

Envira Gallery levereras också med premiumtillägg som utökar funktionaliteten och ger fler funktioner.

Du kan till exempel förhindra bildstöld genom att inaktivera högerklickning på bilder med hjälp av Envira Gallery. Du kan också använda dess vattenstämpeltillägg för att lägga till vattenstämplar på bilder i galleriet.

Du kan också integrera Envira Gallery med WooCommerce för att skapa fantastiska produktbildgallerier. Detta gör att du kan visa anpassade produktbilder i olika layouter.

Du kan till och med organisera gallerier med hjälp av taggar och skapa filtrerbara portfolios. Detta är verkligen användbart om du har flera gallerier och vill göra det enklare för användarna att sortera objekt som de är intresserade av.

Preview of a Filterable Portfolio Gallery

Förvandla din vision till en fantastisk WordPress-webbplats med WPBeginners expertteam! Våra begåvade designers kommer att skapa en webbplats som perfekt förkroppsligar ditt varumärke. Vi hanterar allt från anpassad design till bästa praxis för SEO. Börja bygga din vackra webbplats idag!

Vi hoppas att den här artikeln hjälpte dig att skapa responsiva bildgallerier i WordPress med Envira. Du kanske också vill läsa våra guider om hur du lägger till flera gallerier i WordPress-inlägg och -sidor och hur du lägger till en Flickr-widget i WordPress.

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

34 kommentarerLämna ett svar

  1. Syed Balkhi says

    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. THANKGOD JONATHAN says

    Please how about embeded images. Can I use embeded images to create gallery with Envira plugin. If not how do I ensure the images does not affect my website speed. In cases where I have large number of galleries in a photography blog.

  3. Jiří Vaněk says

    Just recently, I was creating a website for a kindergarten, and part of the website included an extensive gallery. I ended up using Elementor and found my way around it. However, the organization of photos isn’t very good. Thank you for the tip. If I’m doing a redesign of the website or creating another one with a large gallery, I will definitely give this plugin a try.

  4. Ralph says

    This looks really nice. I won’t use it as i don’t have almost any images for my blog (it is technical) but my wife blogs about furniture so this may find a good use!

  5. Moinuddin Waheed says

    I have used many image plugins back in 2017 and due to heavy load time on my website I left most of them. I don’t know if installing all these plugins make the website somewhat slower or it is good to install and the code itself takes care of the speed of the website.
    The problem comes with the quality of the image. usually we get high quality images on our phones and when we upload those on our websites it get stuck due to its image size. if we crop do something we compromise with the image quality.
    I hope all these hurdles will be fixed by envira plugin.

  6. Sameer Hussain says

    Now this is something that can come handy any day. Because images are a big part of your website and ultimately blogging success. Thanks for this.

  7. R Taylor says

    We have read this several times and watched the videos and still can’t figure out how to add caption and have it actually show when published. We have Pro but are screen is different, example when it says to ”add gallery” (block beside ”add media”) our version doens’t show it this way. We aren’t sure if that is where are issue starts or not.

    • WPBeginner Support says

      Envira has likely updated their interface since this article was created so you could check with Envira’s support. More than likely there could be a styling issue where your theme does not show the caption for some reason.

      Administratör

  8. Marilyn Pongracz says

    An Envira tech person got back to me, and I had to disable Essential Grid to make it work in the Highend Theme.

  9. Marilyn Pongracz says

    I tried a gallery and it was easy to create, but with some long and some short captions, it didn’t look very good. Lightbox didn’t work, either, even when I disabled my theme’s lightbox. Then I tried disabling Envira, and my theme’s lightbox won’t work.

  10. Kenny Lambert says

    Envira is a piece of rubbish – would not work on my website and even though I have deleted the gallery and the plugin this [envira-gallery id=”91″] still shows on my homepage and I can’t get rid of it

    • WPBeginner Support says

      Hi Kenny,

      Envira uses shortcodes to display galleries. You have to add these shortcodes to display galleries and you can remove them by simply editing the post and page and removing the shortcode. Hope this helps.

      Administratör

  11. Amber says

    I love the Envira Plugin, but I can’t figure out how to have the gallery images link to the attachment page/post – it just links to the image, which is great if using lightbox (which I don’t want to do)…any ideas?

  12. Rohit Kumar says

    I have been using theme ”Being Hueman” on my blog but images are cut off. you can visit my blog and see yourself. I am not able to fix it and moreover, I have not seen any help on google so I have to write this comment to seek your help.

    Regards,

    Rohit Kumar

  13. WPBeginner Staff says

    Shortcodes are not enabled by default for widgets. To enable shortcodes in widgets please add this code in your site’s functions.php file or a site-specific plugin.

    add_filter(’widget_text’,’do_shortcode’);

  14. Mathias says

    How can I insert the shortcode for the gallery into a widget in my sidebar? It did not work when I copied the short code into a text widget in my sidebar. thanks

  15. Elise says

    Hi! I’m creating a site for an art gallery. I would like to use the Envira plug in. Can you recommend a good theme to use or purchase that would go well with the Envira plug in? And at some point I would like to add ecommerce, does Envira support that or is that a theme issue?

  16. Roma Cantuaria says

    Hello. I’m trying the Envira Lite right now. The design is perfect and the program is very easy to use. However, I’m facing two problems. Firstly, my photos are taking too long to load. Secondly, even after the page is completely loaded, a kind of loading icon under my gallery continues to appear. I’d like a little help from you guys.

    The link to my gallery: http://www.casasemparede.com/teste-7/

  17. Kaley Perkins says

    Just bought the plugin but never saw a place to enter the code for the 20% off. Not a big deal for sure with all of the AMAZING value you provide, and QUITE possibly user error on my behalf being so eager to get it downloaded and working, but heads-up.

  18. Stephen Starr says

    I’m testing Envira Lite, on a custom these. Not sure where this code belongs:

    You can also place this gallery into your template files by using the template tag(s) below:

    if ( function_exists( ’envira_gallery’ ) ) { envira_gallery( ’467’ ); }
    if ( function_exists( ’envira_gallery’ ) ) { envira_gallery( ’posada-life-in-picture’, ’slug’ ); }

    Here’s my gallery that doesn’t have the lightbox function:
    http://posadalife.stephenbstarrdesign.info/posada-life-in-pictures/

  19. Clare Chate says

    Hey there, the two main features I’m currently looking for in a good gallery for my clients, is

    (1) Categories / Folders (that may be a given, excuse my ignorance! :-) )
    and
    (2) Social media sharing on images

    Does this one have those options?

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.