Webbplatsgalleri

Pixpa ger dig mycket kontroll över hur du visar bilder i dina gallerier.

Med hjälp av alternativen för galleristil kan du helt kontrollera dina bilders visning i galleriet tillsammans med gallerilayouten.

Dricks: Stilalternativ för hela galleriet tillämpas automatiskt på alla nya gallerier du skapar.
Se även: Hur åsidosätter man den webbplatsomfattande galleristilen i ett specifikt galleri?


I den här artikeln:

    1. Galleri Layout
    2. Rutnätstil
    3. Rutnät färger
    4. Hover stil
    5. bild~~POS=TRUNC
    6. Bildkant
    7. Ljuslåda
    8. Mobil display

Du kan anpassa gallerialternativen för hela webbplatsen från avsnittet Design (1).

När du är inne i designsektionen klickar du på fliken Gallerier (2).

Alternativt kan du också använda studions sökalternativ.

  • ange Gallerier (1) i sökfältet.
  • Från de relaterade resultaten, klicka på Design – Gallerier alternativ (2).


  1. Layout : Välj en layout som ska tillämpas på galleriet.
    Lär dig hur du ändrar gallerilayouten.
  2. Bredd : Välj galleriets bredd.
    • 'Full bredd' kommer att visa galleriet samtidigt som det täcker hela bredden utan att lämna någon marginal.
    • 'Boxed' kommer att visa galleriet samtidigt som det lämnar lite utfyllnad till höger och vänster på skärmen.
    • 'Webbplatsens bredd' kan anges i designdelen. Du kan ange en fast bredd här.
      Det kommer att visa galleriet genom att följa den angivna fasta bredden.


 

  1. Galleravstånd : Ange avståndet mellan bilderna i rutnätslayouter. (0–250 pixlar) 
  2. Bild hörn radie: Använd en kantradie för att göra bildens hörn rundade i gallerirutnäten.

Till exempel har Lantern - temats hemgalleri 142px rutnätsavstånd.

Efter att du har tillämpat Bildhörnradie skulle du se rundade kanter på bilderna som i Beyond -mallen.


Basopacitet: Om du har valt hovringstypen som bildens accentfärg, ange rutnätets basopacitet härifrån.

 

  1. bas: Basfärgen används för att bilda rutnät och är synlig endast ett ögonblick innan bilderna laddas. Du har två alternativ för rutnätets basfärg.
    • Välj färg: Välj det här alternativet för att ställa in en specifik färg för rutnätsbasen. Ange valfri färg och opacitet för rutnätsbasen.
    • Accentfärg: Använd bildaccentfärger för rutnätsbasen. Detta kommer att ge ett flerfärgat rutnät med accentfärgerna för varje bild.
  2. Basens opacitet: Om du har valt bastypen som accentfärg, ställ in rutnätets basopacitet härifrån. 
  3. Håll muspekaren:  Detta påverkar rutnätet när markören förs över bilden.
    • Välj färg: Ställ in standardfärgen för svävaren och dess opacitet om du har valt Välj färg för dina rutnätsbilder. 
    • Accentfärg: Använd bildaccentfärger för rutnätsbasen. Detta kommer att ge ett flerfärgat rutnät med accentfärgerna för varje bild.
  4. Hover opacitet: Om du har valt svävningstypen som accentfärg, ställ in rutnätsbasens opacitet härifrån. 

 

Bildens accentfärg är den dominerande färgen på en bild som väljs när du laddar upp en bild.


Svävningseffekten kommer endast att användas i rutnätslayouten. Du kan visa följande alternativ vid hovring i rutnätsläge.

  1. Ingen effekt – För ingen effekt på bilder i rutnätsläge.
  2. Färg – För endast svävfärg på dina bilder i rutnätsläge.
  3. Färg och bildtitel – För bildens svävningsfärg med bildens titel. Du kan ställa in svävningsfärgen och bildtitelns textfärg/typsnitt/storlek/vikt i nästa alternativ.
  4. Färg och ikon – För bildens svävarfärg med en ikon.
  5. Färg, bildtitel och ikon – För bildsvävningsfärg, bildtitel och ikon. Du kan också lägga till ikoner på dina bilder som plus, pil, kors och öga. 


Hover ikon

  • Hover-ikoner används endast i rutnätslayouter för gallerier. Du kan välja att visa en ikon för dina bilder i rutnätsläge.
  • Alternativen är – plus, pil, kryss och öga. Detta är endast tillämpligt när ikonen är vald i hover effekt falla ner. 


  1. Detta tillämpas när du väljer att visa bildtitlar vid hovring.


Pixpa erbjuder en mångsidig funktion för bildkanter som låter dig förbättra din webbplats visuella attraktionskraft genom att lägga till kantlinjer runt bilder. Klicka här för att lära dig mer om bildkanter.


1. Öppna Lightbox

  • När bilder visas i ett rutnät öppnas den i ljusbordsläge (helbildsvisning) genom att klicka på en bild.
  • Du kan aktivera eller inaktivera detta härifrån. 

Kontrollera Lightbox-läget i aktion :


2. Aktivera zoom

  • Aktivera/inaktivera zoom över bilder i ljusbordsläge.
  • Zoomfunktionen fungerar även på stationära och mobila webbplatser.


3. Visningsalternativ

  • Välj hur du vill visa dina bilder i helbildsvisning.
  • Du kan välja mellan visa endast bilder, bild med miniatyrer, bild med bildtexter på bottenoch bild med bildtexter till höger. 

Till exempel ett galleri med endast visningsbilder.

Till exempel ett galleri med visningsbilder med miniatyrbilder.

Till exempel ett galleri med en visningsbild och bildtext längst ner.

Till exempel ett galleri med en visningsbild med bildtext till höger.


4. Överläggsfärgalternativ

Överläggsfärgen är bakgrundsfärgen som visas när bilder visas i ljusbordsläge. Att justera överläggsfärgen kan hjälpa till att matcha utseendet och känslan i din webbplats design och ge en sammanhängande, polerad presentation av dina bilder i ljusbordsvyn.

  • Välj Anpassad färg alternativet för att ställa in en specifik bakgrundsfärg för alla bilder som visas i ljusbordsläge. Du kan definiera din föredragna färg i Överläggsfärg inställning. Läs mer.
  • Välja Accent Färg för att applicera en unik färg från varje bilds accenttoner. Du kan anpassa detta individuellt för varje bild efter önskemål. Läs mer.
  • Om du väljer alternativet Accentfärg kan du justera Opacitet (transparens) av bakgrundsfärgen.


5. Bildvy

Ange visningsläge för ljuslådan –

  • Skala och passform – Bilder skulle skalas för att passa in i det tillgängliga webbläsarområdet så att hela bilden är synlig. 
  • Full blödning – Bilder skulle ha en storlek för att fylla hela det tillgängliga webbläsarområdet – vissa delar av bilden kan skäras av för att uppnå denna helskärmsvisning. 

Till exempel ett galleri med s- skalning och anpassningsläge där bilderna skulle passa in i den tillgängliga webbläsarhöjden.

Till exempel ett galleri med utfallsläge där bilderna skulle sträckas ut för att fylla den tillgängliga webbläsarbredden.


6. Kontroller

I ljusbordsvyn väljer du hur du vill visa navigeringskontroller som bildinformationsikon, galleriinformationsikon, korsikon, webbläsarpassningsikon osv. Alternativen är:

  1. Alltid synlig (visa alltid navigeringskontroller ovanpå bilderna)
  2. Visa på svävaren (navigeringskontroller visas bara när du flyttar markören på skärmen)
  3. dold (navigeringskontroller kommer aldrig att visas). 

Till exempel ett galleri med navigeringskontroller som alltid är synliga .

Till exempel ett galleri med navigeringskontroller som visas vid muspekning .

Till exempel ett galleri med dolda navigeringskontroller.


7. Nästa/Föregående stil

Välj hur du vill visa dina navigeringspilar i helbildsvisningen.

  1. Flytande : Navigeringspilarna kommer att flyta. Flytta markören över bilden och klicka på skärmen när pilen visas för att navigera genom bilderna. 
  2. Chevron
  3. Pilar
  4. Visa pil i cirkel
  5. dold : Inaktivera navigeringspilarna helt. 


8. Bildfilnamn

  • Välj att visa filnamnet när bilden visas i ljusbordsläge.

Se i aktion: 


9. Max bildstorlek

Den här inställningen styr den maximala upplösningen som dina galleribilder visas med i lightbox-läge. Du kan välja mellan följande alternativ:

  • Auto - Anpassar automatiskt bildstorleken baserat på tittarens skärm och enhetens upplösning. Systemet väljer intelligent den mest lämpliga versionen av bilden för att säkerställa optimal skärpa och prestanda.
  • Fasta storlekar – 2048px, 1500px, 1000px, 800px eller 500px. Om du väljer en fast storlek visas alla lightbox-bilder upp till den maximala upplösningen, beroende på användarens enhet eller skärmstorlek.
Anmärkningar

Om den ursprungliga bilden du laddade upp har en mindre upplösning än den valda storleken visas den i sin ursprungliga upplösning . Den kommer inte att förstoras eller skalas upp.


Inställningar för bildspel

  1. Bildspel: Klicka på självspelande för att starta bildspelet automatiskt i full bildvisare. Du kan också inaktivera bildspelet.
  2. Fart : Välj övergångshastighet. Du kan välja mellan 1 till 10 sekunder.
  3. Övergång: Välj övergångsstil för bildspelet.

 

Se bildspel i aktion: 


Färgalternativ

Den här funktionen gör att accentfärgen på bilder kan användas som bakgrund när bilder visas i ljuslådans läge . Detta förbättrar den visuella upplevelsen genom att justera bakgrunden med bildens accentfärg.

  1. Använd accentfärg som nyans:
    • Som standard Lightbox bakgrundsfärg kommer att tillämpas när du visar bilder i ljusbordsläge.
    • När du aktiverar det här alternativet visas Accent Färg associerade med bilderna kommer att användas som bakgrundsfärgen för Lightbox, vilket ger ett mer dynamiskt och visuellt sammanhängande utseende.
  2. Nyans Opacitet:
    • Du kan hantera opaciteten för Accent Färg Tint med skjutreglaget Tint.
    • Justering av opaciteten blandar Accent Färg med Lightbox-bakgrundsfärgen, så att du kan uppnå en sömlös och professionell estetik.


  1. Visa som: Välj att visa galleriet som en Bildreglage eller i rutnätsläge i mobilvyn. 
  2. Rutnätskolumner: Välj mellan 1 kolumn eller 2 kolumn vy för rutnätsvisning i mobilvy.
  3. Galleravstånd : Ställ in ränna mellan bilder i mobilvy.


 

Hittar du inte det du letar efter?

Ta kontakt med en Pixpa-expert.

Pixpa Studio har precis uppdaterats. Vi uppdaterar för närvarande alla skärmdumpar från hjälpartiklarna.