Billedlistesektion

Brug sektionen Billedliste, når du vil vise et sæt billeder og relevant tekst.

Ved at bruge denne sektion kan du nemt linke forskellige sider på hjemmesiden eller tilføje links, hvor du også vil tilføje et billede og en beskrivelse for hvert link.

I denne artikel:

1. Hvad er en billedliste?
2. Tilføjelse af en billedlistesektion til siden
3. Tilføj og rediger listeelementer
4. Rækkefølge listeelementer
5. Sletning af listeelementer
6. Ændring af sektionslayout
7. Stilmuligheder
8. Karruselstilen
9. Levende eksempel

Billedliste

• En billedliste er en samling af billeder, hvor du kan tilføje en beskrivelse til billedet og tilføje et link eller en knap for at forbinde det med en hvilken som helst anden side på hjemmesiden eller ethvert andet link.

Tilføj billedlistesektion

• Et afsnit kan tilføjes til en side. Du kan enten tilføje et afsnit til en allerede eksisterende side eller oprette en ny side på din hjemmeside.
• På din side, klik på blåt + ikon at tilføje en Ny afdeling til din side.

• Du vil nu se sektionskategorier på venstre side.
• Vælg den Liste (1) kategori og klik på Billedliste fane (2), hvor du kan vælge imellem forskellige layouts af billedlisten (3).

• Vælg et sektionslayout, og klik på det for at tilføje det til din side.

Tilføj og rediger listeelementer

Tilføj listeelement

Når du har tilføjet afsnittet:

• Klik på Rediger billedliste (1) knappen for at åbne panelet med listeelementer.

• Klik på Tilføj vare (2) knappen for at tilføje et nyt listeelement.
• Du kan vælge at Dopliker eller slet (3) listepunkterne.

Rediger listeelement

Klik på det listeelement, du vil redigere. Det åbner de særlige redigeringsmuligheder for listeelementer.

Herfra kan du:

• Upload/fjern billede (1) for listepunktet. Du kan også indstille Billedaccentfarve herfra, som vil blive vist på billedet.
• Føj til Titel (2), Undertekst (3)og Beskrivelse (4) på ​​listepunktet.
• Du finder muligvis ikke muligheden for undertekst og beskrivelse i bestemte listeelementer afhængigt af det layout, du vælger.
  Inden du tilføjer beskrivelsen, skal du kontrollere denne artiklen.

• Klik på Link Builder-ikonet for Titellink (5) for at åbne linkbyggeren for at linke listeelementets titel til en hvilken som helst side. Vide mere om Link Builder.
• Indstil linket til at åbne i en ny fane eller i samme fane (6).
• Tilføj enhver form for Link (7) til listepunktet. Du kan tilføje et knap/billedlink/socialt ikon/tekstlink. Lær mere.
• Gem (8) dine ændringer.

Se redigering af et billedlisteelement i aktion:

Sekvenslisteelementer

• Du kan nemt trække og slippe listeelementerne for at ændre rækkefølgen.

Se rækkefølge af billedlisteelementer i aktion: 

Slet et listeelement

Når du har tilføjet et listeelement, kan du redigere og slette det.

• Klik på Slette ikonet ved siden af ​​billedlisteelementet.
• Tne, klik på Slette knappen i bekræftelses-popup'en.
• Endelig spare dine ændringer.

Se sletning af et billedlisteelement i aktion: 

Sektionslayout

• Klik på Administrer billedliste (1) knap.
• Vælg den Layout (2) faneblad.
• Type (3) layoutet for din sektion og Gem (4) ændringerne.

Style dit afsnit

• Klik på Administrer billedliste (1) .
• Vælg den Stil (2) fane.
• Skift stilen for sektionselementerne og Gem (3) dine ændringer.

Du vil have flere stilmuligheder for sektionen: 

Varer 

1. Vælg at Vis varer in rækker og kolonner or karrusel 
   • Hvis du har valgt rækker og kolonner valgmulighed, vil listeelementerne blive arrangeret i rækker og kolonner. I dette tilfælde skal du angive antallet af rækker og kolonner.
   • Hvis du har valgt karrusel valgmulighed, vil listeelementerne blive præsenteret som et diasshow. Vide mere.
2. Indstil Antal kolonner for billedlisten. Du kan vælge mellem 1 til 10 kolonner.
3. Angiv Mellemrum mellem kolonner af listepunkterne.
4. Angiv Mellemrum mellem rækker af listepunkterne.
5. Vælg den Indholdsrækkefølge dvs. billederne af de listeelementer, der skal vises først, eller den tilhørende tekst.
6. Juster Indholdet vandret i billedlisten. Du kan indstille dem til at være venstre-, højre- eller centerjusterede.
7. Juster indholdet lodret i billedlisten. Du kan indstille dem til at være top-, center- og bundjusterede.

Hvis indstillingen Karrusel er valgt i trin 1, vil du se følgende yderligere muligheder:

8. Vælg at Sløjfe karrusellen eller ej.
9. I tilfælde af karrusellen skal du vælge Navigationskontrol. Du kan vælge mellem Ingen kontroller, pile – nederst i midten/øverst til højre/nederste højre, Chevron eller prikker.

Mobil skærm

10. Indstil antallet af Gitterkolonner til mobile enheder. Du kan indstille den til maksimalt 3 kolonner.
11. Definer Mellemrum mellem gitter (i pixels).

Billeder 

12. Vælg den Imagisk afgrøde for listepunkterne. Du kan indstille billederne som Firkantet, Cirkel, Vandret, Portræt og Original.
13. Vælg at have en fælles hjørneradius eller en anden hjørneradius for hver side af listeelementerne, og indstil et tal (i px) for Corner Radius af listeelementbillederne. Vide mere.

• Hvis du har valgt opdelte hjørner, kan du indstille forskellige hjørneradius for hvert hjørne.

På Image Hover 

14. Vælg den Billede Hover Farve at være accentfarve eller at være specificeret. Hvis du har valgt accentfarve, og angiv derefter opacitet.
15. Hvis du har valgt angiv farve indstilling og derefter indstille Farve og uigennemsigtighed for bundsvæv for listepunkterne.
16. Indstil Elements farve for sektionens listepunkter.
17. Vælg at Animer listeelementbillederne ved at trykke på Ja. Tjek denne funktion på en live-side.
18. Vælg en Animation stil for billeder, når markøren holdes over dem.

Størrelse & plads 

19. Angiv Breddebillede for listepunkter.
20. Angiv Indholdsbredde for listepunkterne.
21. Angiv Plads under sektionsoverskrift i px.
22. Angiv Plads under billederne af listepunkterne (i %).
23. Angiv Plads under titlerne af listepunkterne (i %).
24. Angiv Plads under underteksterne af listepunkterne (i %).

tekst 

25. Klik på Skift tekststil knappen for at besøge Design afsnit og administrere dine skriftstørrelser og stilarter. 
26. Indstil Titel skrifttype for sektionens listeelementer.
27. Indstil Subtitle skrifttype for sektionens listeelementer.
28. Indstil standard Beskrivelse skrifttype for sektionens listeelementer.

Kort 

29. Se hvordan at administrere kort.

Shadow

30. Skærm – Vælg at vise skyggen bag listeelementerne altid eller kun ved at svæve.
31. stil – Vælg mellem eksisterende forudindstillinger eller opret en brugerdefineret skygge.
    Hvis du har valgt Custom-indstillingen, så besøg denne Box Shadow Generator for at skabe en brugerdefineret skygge. Til sidst skal du kopiere og indsætte box shadow CSS.
32. Hvis du har valgt forudindstillinger, så Vælg Shadow Styles fra dropdown.

Knapper og links

33. Se hvordan at styre stylingen af Knapper og links.
34. Gem alle stilændringer.

Karruselstilen

Karrusel-stilen viser listeelementer som et diasshow, dvs. listeelementerne vil blive cyklet efter hinanden.

Se, hvordan karruselstilen fungerer: 

Her er en live billedliste: 

Se en live demo-side. 

Se hvordan hjørneradius fungerer: 

Relaterede artikler:

• Typer af sektioner
• Tilføj afstandsstykke / skillevæg mellem sektioner
• Byg din hjemmeside