Træk ind Logo Slider widget, tilføje hvert logo som en repeater række, indstille slides-per-view til desktop, tablet og mobil, og slå autospil med loop til. Det er en gratis widget, en af en hel familie af karrusel widgets, og det hele tager cirka fem minutter.
Opsætningen er let. Hvad der ikke er let er at få tolv logoer fra tolv forskellige virksomheder til at se ud som om de hører hjemme i samme række. Det er det faktiske problem med hver logostrimmel, og den anden halvdel af dette dækker det.
Trin 1: Tilføj Logo Slider-widgetten
Søg i Elementor-panelet efter “logo-skyder”, og træk det ind. Det er en del af det gratis Master Addons-plugin, og den frie-versus-Pro opdeling har den fulde liste over, hvad der ellers er i det niveau. Den Logo Slider dokumentation dækker hver kontrol, hvis du vil have referenceversionen. De fleste addon plugins sender et logo widget af en slags, og den karrusel plugin sammenligning siger, hvilke der har lagt det bag en licens.
Trin 2: Tilføj dine logoer
Hvert logo er en repeaterrække: logobilledet, et valgfrit link og et valgfrit svævetekst eller svævebillede. Alt-teksten kommer fra billedets Alt-tekstfelt i Mediebiblioteket.
To ting at gøre her, som de fleste mennesker springer over:
Skriv ægte alternativ tekst. “Acme Corp logo,” ikke “logo-1.png.” En logo strip er et af de få steder, hvor alt tekst bærer ægte information, fordi firmanavnene er indholdet. Skærmlæser brugere får intet fra tolv billeder kaldet “billede.”
Link hvert logo kun hvis destinationen er nyttig. Sammenkædning af klientlogoer til klientwebsteder sender din trafik væk fra en side, hvor den konverterede. Link dem til dine casestudier i stedet, eller link dem slet ikke. En logostrimmel fungerer fint som et statisk tillidssignal.
Trin 3: Layout og adfærd
Logo strimler har forskellige standardindstillinger fra billedkarruseller, fordi jobbet er anderledes. Ingen studerer et logo. De registrerer det på et halvt sekund.
- Slides pr. visning: seks på desktop, fire på tablet, to eller tre på mobil. Højere tæthed end en fotokarrusel, fordi logoer er små, og punktet er mængde.
- Autoplay: på. Dette er det modsatte af testimonial-reglen. Der er intet at læse, så kontinuerlig bevægelse koster intet og viser flere logoer end en statisk række.
- Hastighed: langsommere end føles rigtigt. 4000 til 6000ms. En hurtig logostrimmel lyder som ophidset.
- Sløjfe: på, og sørg for at du har mindst to gange dine slides-per-view. Seks-per-view har brug for tolv logoer minimum eller wrap vil synligt hoppe.
- Pile og prikker: af sted. En logostrimmel er ikke noget, folk navigerer i.
Indstil autospil forsinkelse til 0 og karrusellen bliver et kontinuerligt telt i stedet for at træde dias for dias. Det er det udseende, de fleste moderne websteder bruger til logostrimler, og markeringsguiden dækker indstillingerne i detaljer.
Trin 4: Få uoverensstemmende logoer til at se konsistente ud
Her er det virkelige problem. Du har tolv logoer. Fire er brede ordmærker, tre er firkantede ikoner, to har enorm intern polstring bagt i PNG, og en er en høj stablet lockup. Drop dem i en række i samme bredde, og det ligner en løsesum note.
Størrelse efter bredde er fejlen. Et bredt ordmærke sat til 160px bredt er visuelt lille; et firkantet ikon på 160px bredt er enormt. De er det samme tal, og de ligner ikke noget.
Størrelse efter optisk område i stedet. Eksporter hvert logo på det samme lærred, giv hvert mærke en lignende visuel højde på omkring 40 til 50px i den endelige strimmel, og juster individuelle filer op eller ned, indtil de ser afbalancerede ud. Widgetten viser hvert logo ved den samme Billedopløsning, så denne afbalancering sker i billedfilerne. Skele på rækken: ethvert logo, der springer ud, er for stort, ethvert, der forsvinder, er for lille. Stol på dit øje over tallene, fordi dit øje er, hvad besøgende vil bruge.
Produktkort rammer samme mismatch fra den anden retning, hvor portræt- og firkantede fotos i den ene strimmel er det, der gør en produktkarrusel se billigt ud. Rettelsen der er et fast billedformat snarere end en fast højde.
Yderligere to rettelser til det samme problem:
Beskær den indbagte polstring. Logoer eksporteret fra brand kits bærer ofte generøs clear-space inde i billedfilen. Den polstring er usynlig, og det gør logoet render mindre end sine naboer i samme højde. Beskær til den synlige afgrænsning boks før upload.
Brug SVG, hvor du kan. Logoer er vektorkunstværker. En SVG forbliver skarp i enhver størrelse, vejer en brøkdel af en PNG, og dette er den nyttige del, kan omfarves med CSS, hvilket gør gråtonebehandlingen under triviel.
Trin 5: Gråtonesvæveren
Logoer desatureret i hvile, fuld farve på svæve. Det er standardbehandlingen af en grund: tolv logoer i tolv mærkepaletter er visuelt kaos, og gråtoner gør dem til én sammenhængende tekstur.
Logo Slider har ingen gråtone switch, så der er to måder at gøre det på. Upload gråtonefiler som Client Logo og farveversionerne som Hover Logo Image, eller tilføj et CSS gråtonefilter til logoerne med brugerdefineret CSS og fjern det på hover. Opacitetsindstillingen i Carousel Items kan dæmpe logoer til omkring 0,6 i hvile og 1 på hover. Hvis du bruger CSS, skal du holde overgangen på 200 til 300 ms. Hurtigere end det, og det flimrer; langsommere, og det føles klæbrigt.
Et tilfælde, hvor du ikke bør: Hvis logoerne er presseomtaler snarere end klienter, Forbes og TechCrunch slags strip, lad dem være i farver. Disse logoer genkendes af deres farve, og at afmætte dem koster dig den anerkendelse, du købte.
Den færdige strimmel
Hvor skal man sætte det: umiddelbart under helten, eller umiddelbart under den primære opfordring til handling. Begge stillinger fungerer, fordi begge er øjeblikke, hvor en besøgende beslutter, om at stole på dig.
Hvor ikke at sætte det: sidefoden. En logo strip i sidefoden er dekoration. Ingen ruller til sidefoden for at blive overbevist.
Logo strips er en af de få sektioner, hvor en stock widget slår en designet, hvilket er grunden til, at ingen af de tyve Widget Builder designs forsøger at erstatte det. Hvis du ønsker Pro-designerne til andre sektioner, vil prissætning side har niveauerne.
Hvor mange logoer?
Otte til seksten. Under otte og en rullestrimmel gør opmærksom på, hvor få der er, fordi en statisk række på seks ser mere selvsikker ud end seks logoer, der cykler. Over seksten ser ingen den bagerste halvdel, så før med de navne, folk vil genkende.
Og hvis du kun har fire klienter: vis fire, i en statisk række, i en anstændig størrelse. En karrusel er en måde at håndtere overflod på. At bruge en til at skjule knaphed gør det modsatte af, hvad du ønsker.
Ofte stillede spørgsmål
Har Elementor en logo karrusel widget?
Ikke i kernen. Hverken Elementor gratis eller Pro indeholder en dedikeret logo karrusel, selvom kernen Image Carousel kan vise en simpel række logoer. Den gratis Master Addons Logo Slider tilføjer per-logo links, hover tekst eller hover billeder, værktøjstip, og en marquee-stil strip, når Autoplay Speed er indstillet til 0.
Hvordan får jeg en logokarrusel til at rulle kontinuerligt i Elementor?
Tænd for autospil og uendelig løkke, og indstil derefter forsinkelsen for autospil til 0. En forsinkelse på nul fjerner pausen på hvert dias, så sporet bevæger sig kontinuerligt i stedet for at træde. Indstil hastigheden til 4000 til 6000 ms, så den læser som rolig snarere end hektisk.
Hvordan laver jeg logoer i samme størrelse i en karrusel?
Indstil en fast beholderhøjde, 40 til 50px, og lad bredden køre automatisk, i stedet for at fastsætte bredden. Juster derefter individuelle logoer efter øje, fordi et bredt ordmærke og et firkantet ikon ved samme måling ser helt forskellige størrelser ud. Beskær enhver indbagt polstring ud af billedfilerne først.
Skal logoer være gråtoner eller fuldfarvede?
Gråtoner i hvile med farve på svæve for klient- og partnerlogoer, fordi det forvandler et dusin sammenstødende paletter til én sammenhængende stribe. Hold presse- og medielogoer i fuld farve, fordi de genkendes på deres farve, og at desaturere dem mister genkendelsen.
Hvor mange logoer skal der være i en logokarrusel?
Otte til seksten. Færre end otte ser bedre ud som en statisk række end en bevægelig strimmel, fordi rulning gør opmærksom på, hvor få der er. Mere end seksten betyder, at den bagerste halvdel aldrig ses, så sæt de genkendelige navne først.
Kan jeg linke hvert logo til en anden side?
Ja, hver repeater række har sit eget linkfelt. Overvej om du vil, selvom: at forbinde klientlogoer til klientwebsteder sender konverterende trafik væk. At knytte dem til dine egne casestudier holder den besøgende og gør mere arbejde.
Next
Fotografier frem for logoer? Forskellig widget, forskellige standardindstillinger: sådan oprettes en billedkarrusel i Elementor. Der er også en samling af tyve navngivne skyderdesigns, otte af dem gratis at importere, selvom ingen er en logostrimmel, så for logoer forbliver Logo Slider værktøjet.
Hvis strimlen holder op med at bevæge sig efter en caching-plugin-opdatering, er det et Swiper-initialiseringsproblem og rettelsen er her. Alt karruselformet lever på den Elementor Carousel Widgets page.
