Ocuco-landskapet Slider Med avsnittet i Pixpa kan du lägga till ett visuellt engagerande område på dina sidor samtidigt som du förbättrar SEO. Oavsett om du arbetar med ett galleri, en sida, en mapp, ett kundalbum eller en blogg, hjälper bannern till att sätta tonen och lyfta fram viktigt innehåll.

I den här artikeln
- Vad är en banner
- Lägg till banner på en sida
- Redigera banneravsnitt
- Bannerinnehåll
- Bannerinställningar
- Bannerlayout
Vad är en banner
En banner används för att visa en bannerbild/bildspel/video i full bredd högst upp/nederst i ditt innehåll.
Lägg till bannersektion på en sida
- Ett avsnitt kan läggas till på en sida. Du kan antingen lägga till ett avsnitt på en redan befintlig sida eller skapa en ny sida på din webbplats.
- På din sida, Klicka på blå + ikon att lägga till en Nytt avsnitt till din sida.

- Du kommer nu att se sektionskategorier på vänstra sidan.
- Välj Hjälte sektioner (1) kategori och klicka på Slider flik (2) där du kan välja mellan olika layouter av Baner (3) avsnitt.

- Välj valfri sektionslayout och klicka på den för att lägga till den på din sida.
Redigera banneravsnitt
Om avsnittet redan är lagt till på sidan kan du enkelt redigera det.
- Håll markören över avsnittet och klicka på Redigera innehåll (1) -knapp.

- Ett sidofält öppnas där du kan Redigera (2) bannersektionen.
- Klicka Spara (3)-knappen efter att du har gjort ändringarna.

Innehåll i banneravsnittet
Ocuco-landskapet Fliken Innehåll Under avsnittet Redigera banner kan du lägga till och anpassa innehållet i din banner, oavsett om det är bildbaserat eller videobaserat.
Bannertyp
Välj typ av banner. Du kan välja något av följande alternativ:
- Diabilder – Välj alternativet Slides om du vill visa bilder i bannern. Du kan lägga till flera bildbilder under en banner.
- Video – Om du vill visa videor som bannerbilder väljer du det här alternativet. Under varje banner kan du lägga till flera videobilder.
Bildbilder
När Bilder är valt under Bannertyp kan du skapa ett bildspel genom att ladda upp flera bilder som bannerbilder.
- Lägg till flera bilder genom att klicka på + Lägg till bilder knapp.
- Ändra ordning dem med hjälp av drahandtagen.
- Redigera eller ta bort enskilda bilder med hjälp av respektive ikoner.

Redigera bild/textbild
- Bild
- Klicka på Ladda knappen för att ändra bild/bild. Klicka på Radera knappen för att radera bilden.
- Ändra bildens brännpunkt bara genom att klicka på bilden var som helst.
- Mobilbild – Ladda upp en mobil bannerbild. Vi rekommenderar att du lägger till porträttbilder här.
- Ange alternativ text för bildrutan. Detta hjälper för SEO-ändamål.

- Bildtext – Ange bildtexten som kommer att visas över bilden. Du kan göra texten fet, kursiv, understruken, länka den och göra mycket mer.
Se även: Pixpa textredigerare.

- Bildlänk
-
- Klicka på inställningsikonen och ange överläggslänken för bilden.
- Du kan ange vilken sida som helst på/utanför din webbplats, din e-post eller ett kontaktnummer.
Kontrollera även: Länkande text/knapp
- Knappen & Länkar
-
- Lägg till upp till 10 knappar/länkar till bildinnehållet.
- Du kan lägga till en vanlig knapp, textlänk eller använda en bild/ikon som knapp.
Kontrollera även: Knapp och länkar
- Slå Spara knappen för att spara dina ändringar.

Videobilder
När Videobild Om alternativet är valt kan du bädda in en YouTube- eller Vimeo-video i din banner. Följande konfigurationsalternativ är tillgängliga:
1. YouTube/Vimeo-länk – Ange en direktlänk till din video. Format som stöds inkluderar:
- YouTube: https://www.youtube.com/watch?v=XXXXXXXXXXX
- Vimeo: https://vimeo.com/XXXXXXXXXXX
2. Visa video – Välj hur videon visas på din webbplats:
- Autoplay: Videon bäddas in direkt och spelas upp automatiskt på alla enheter (avstängd som standard).
- Autospel – Endast dator: Videon bäddas in direkt och spelas upp automatiskt endast på datorn (avstängt som standard).
- Öppna i Lightbox: Om du klickar på förhandsgranskningen av videon öppnas den i ett popup-fönster.
3. Mobil bild – Ladda upp en reservbild som visas på mobila enheter där automatisk uppspelning av video kanske inte fungerar eller stöds. Detta säkerställer att din banner förblir visuellt tilltalande på alla skärmstorlekar.
4. Ange Alt-tagg (valfritt) – Lägg till en alt-tagg för att förbättra SEO och tillgänglighet. Denna beskriver reservbilden för skärmläsare eller i fall där bilden inte kan visas.

5. Bildtext – Ange bildtexten som kommer att visas över bilden. Du kan göra texten fet, kursiv, understruken, länka den och göra mycket mer.
Se även: Pixpa textredigerare
6. Bildlänk
- Klicka på inställningsikonen och ange överläggslänken för bilden.
- Du kan ange vilken sida som helst på/utanför din webbplats, din e-post eller ett kontaktnummer.
Kontrollera även: Länkande text/knapp
7. Knapp & Länkar
- Lägg till upp till 10 knappar/länkar till bildinnehållet.
- Du kan lägga till en vanlig knapp, textlänk eller använda en bild/ikon som knapp.
Kontrollera även: Knapp och länkar
8. Spara – Slå Spara knappen för att spara dina ändringar

Bannertext och knappar
- Ange om texten och knapparna ska vara samma för alla bilder eller olika för varje bild. När du väljer Samma för alla bilder alternativ, den Bannertext och Knappar kommer att användas.
- När du har valt Olika för varje bild alternativet kommer texten och knapparna som anges för en viss bild att användas.

Bannertext
- Ange bannertexten som kommer att vara gemensam för alla bilder.
Se även: Pixpa textredigerare

Knappar och länkar
- Dessa knappar/länkar visas över dina bannerbilder (gemensamt för alla bilder).
Kontrollera även: Knapp och länkar - När du har gjort dina ändringar klickar du på Spara knappen längst upp till höger för att tillämpa dem på din banner.

Bannerinställningar
Under fliken Bannerinställningar får du följande alternativ:
Bannervisningsläge
-
- Skala och passform – Bilderna får plats inom bannerns bredd och höjd.
- Anpassa till bredd (Endast skrivbord) – Bilder skalas till bannerbredd. Bannerhöjden ärver bildhöjden.
- Banner Desktop Höjd – Ange skrivbordsbannerhöjden om du har valt Full blödning or skala och passform alternativet i fältet Visningsläge.
- Banner mobil höjd – Ange den mobila bannerns höjd.

Kontroller för bildskärm
De här inställningarna kan du anpassa hur bilder visas och övergångarna inom banneravsnittet.
-
Stil för bildövergång – Välj hur bilderna ska ändras. Du kan välja alternativ som Blekna, Horisontell bild eller vertikal bild för en smidig övergång mellan bilderna.
-
Bilder per rad – Ange hur många rader med bilder som ska vara synliga samtidigt.
- Bilder per kolumn – Definiera hur många kolumner med bilder som ska visas. Detta styr hur många bilder som visas sida vid sida på varje rad.
- Avstånd mellan bilder – Justera avståndet mellan enskilda bilder med den här inställningen. Du kan öka avståndet i pixlar för att kontrollera den visuella separationen mellan bilderna.
- Innehållsposition – Ange innehållets position inuti bannern.
- Innehållsbredd – Ange bredden för bannerinnehållet.

Bannerstyling
- Bakgrundsfärg – Ställ in bakgrundsfärgen för bannern.
- Överläggsfärg – Ställ in överläggsfärgen för bannern.
- Navigationsstil – Ange navigeringsstilen för bannern. Du kan välja mellan Chevron, Long Arrows och Short Arrows. Välj Ingen om du vill inaktivera navigeringskontrollerna.
- Navigationsfärg – Ange färgen på navigeringskontrollerna på bannern.
- Aktivera rullningspil – Välj det här alternativet för att visa en nedrullningspil över bannern.
- Hörnradie – Anpassa rundheten på bannerbildens hörn. Du kan antingen använda samma radie på alla hörn eller ange olika värden för varje hörn individuellt.

karusell
De här inställningarna definierar hur bilder flyttas och beter sig automatiskt inom banner- eller karusellsektionen.
- Aktivera smidig rullning – Aktivera detta för att göra bildövergångar mjukare och få en sömlös rullningseffekt.
- Aktivera automatisk uppspelning av bilder – När det är aktiverat övergår bilderna automatiskt utan användarinteraktion.
- Visa autouppspelningsförlopp – Visar en visuell indikator som visar tiden före nästa bildövergång.
- Fördröjning av autouppspelning – Ställ in tidsintervallet mellan automatiska bildövergångar (t.ex. var fjärde sekund).
- Karusellslinga – Aktivera detta för att få bilderna att kontinuerligt växla tillbaka till den första bilden efter den sista.

Knappar
Dessa alternativ möjliggör anpassning av knapparna som visas i bannern
- Knappstorlek - Välj storlek på knappen från tillgängliga alternativ, till exempel liten, medel eller stor.
- Justering – Ställ in knappjusteringen inom sektionen (vänster, centrerad eller höger).
- Mellanrum mellan knappar – Justera det horisontella avståndet mellan flera knappar för en balanserad layout.
- Utrymme ovanför knappar – Definiera det vertikala avståndet mellan texten och knapparna (mätt i pixlar).
- Textlänkstorlek – Ange teckenstorleken för alla textbaserade knappar eller länkar.
- Bildknappstorlek – Justera storleken på knappar som innehåller ikoner eller bilder.
- Knappbredd – Välj hur bred knappen ska visas, med alternativ som standard, stor, extra stor eller full bredd.

Läs mer om hur du utformar knappar och länkar.
sociala Ikoner
Dessa inställningar möjliggör anpassning av utseendet och stilen på ikoner för sociala medier som visas i banneravsnittet.
- Ikonstorlek – Justera storleken på ikonerna för sociala medier (i pixlar) så att de passar bannerns övergripande design.
- Ikontyp – Välj ikonstilen (till exempel Klassisk, Kontur eller Heldragen) som matchar bannerns tema.
- Ikonfärg – Välj hur ikonfärgen definieras. Alternativen inkluderar:
- Länktext – Använder samma färg som avsnittets länktext.
- Anpassad – Tillåter manuellt val av en anpassad färg.
- Varumärkesfärg – Tillämpar varje plattforms officiella varumärkesfärg (till exempel blå för Facebook).
- Välj färg – När Anpassad är valt kan du med det här alternativet välja en specifik färg för ikonerna.

Bannerlayout
Du kan enkelt ändra layouten på en banner. Veta mer om bannerlayouterna.
