Hendelseskalender er standard hendelseskalender for WordPress. Det fungerer godt med Divi, men for å legge den til oppsettene dine Divi, må du bruke en kortkode. Styling gjøres fra innstillingsfanen i WordPress-dashbordet. Dette gjør det vanskelig å integrere stilen med layouten din Divi. En tredjeparts plugin kalt Divi Events Calendar -modul løser dette problemet ved å vise hendelseskalenderen som en Divi-modul. I denne artikkelen vil vi se Divi Events Calendar-modulen og se hva den kan gjøre.
Installasjon av Divi events kalendermodul
Først installerer du plugin-modulen fra hendelseskalender . Hvis dette programtillegget ikke er installert, vil du få en feilmelding som forteller deg at det må installeres og gi en lenke til WordPress-siden for programtillegget.
Last ned og aktiver deretter plugin-modulen til Divi Events Calendar Module og aktiver den.
For eksemplene mine opprettet jeg et sett med arrangementer for Divi og WordPress med forskjellige kategorier, arrangører, steder og datoer.
Divi Events Calendar -modul
To nye moduler er lagt til Divi Builder. Den første, kalt Divi Events Calendar, viser hendelser som kort i en liste omtrent som blogginnlegg. Den andre, kalt Divi Event Calendar View, viser hendelsene i en kalender. Kalendervisningsmodulen er fortsatt i beta. Den har for øyeblikket begrenset funksjonalitet. Vi vil se på begge modulene.
For det første bruker jeg oppsettpakken for Meetup Schedule. Jeg byttet ut hendelsene på denne siden med Divi Events Calendar-modulen.
Innholds-fanen
Modulen viser automatisk hendelser. Den inkluderer standard Divi-faner. Fanen Innhold legger til innhold og elementer. Den legger til en blå bakgrunn som standard.
Innhold
seksjon Innhold lar deg angi antall hendelser som skal vises, kategorier som skal inkluderes, datoformat, utdragslengde og offsetnummer. I dette eksemplet har jeg begrenset hendelsene til 2 i kategorien Divi Events. Jeg satte offset til 1.
Elements
Elements lar deg velge hvilke elementer som skal vises. Dette inkluderer det fremhevede bildet, arrangøren av showet, nettadressen til nettstedet Web, dato, klokkeslett, sted, sted, utdrag, kategori, mer info-knapp og tidligere hendelser (som begrenser modulen til kun å vise tidligere hendelser). Jeg konfigurerte den til å skjule det fremhevede bildet og showarrangøren.
Design-fanen
Fanen Design legger til alternativer for layout, miniatyrbilde, titteltekst, detaljtekst, ekstrahert tekst og Vis mer-knappen. Tekst fungerer på samme måte som den vanlige tekstmodulen. Vi ser nærmere på oppsettet, miniatyrbildet og knappen Vis mer. Skyggelegging av rammer og bokser fungerer for individuelle kort. Dette er noe jeg ønsket å se i mange Divi-moduler.
Disposisjon
Oppsettet lar deg velge antall kolonner (1-4), bildejustering (venstre eller øverst), bakgrunnsfarge, margin og polstring. Jeg la bildet på toppen og endret bakgrunnen til hvit. Blå vises alltid mellom kortene.
For dette eksemplet satte jeg kolonnene til 2 og la til en margin og polstring for å få kortene til å passe mot den blå bakgrunnen, og skape en kant.
Her er eksemplet med 3 kolonner. Jeg kan justere url-teksten slik at den passer. På tre kolonner er ikke plassering av bildet et alternativ.
Denne har 2 kolonner med bildene til venstre.
Klistremerket
Miniatyrinnstillinger inkluderer margin, polstring, bredde, hjørner, kantstiler, kantbredde, kantfarge og kantstil. I dette eksemplet setter jeg fyllet til 75 for å bringe bildet til midten av kartet og bredden til 100.
For dette eksemplet satte jeg hjørnene til 36 piksler og ga den en kantbredde på 9 piksler. Jeg stylet fargene på grensen og ga den en innfelt stil.
Texte
Jeg justerte tittelteksten for å matche oppsettet, med Roboto lett vekt og alle hetter. Jeg forlot utdraget og den detaljerte teksten som standard.
Vis mer-knappen
I dette eksemplet brukte jeg stilen til knappelayouten. Jeg satte størrelsen til 14 piksler, justerte bakgrunnsfargen, endret bredden og radiusen på rammen, og valgte Roboto med fet skrift i alle bokstaver. Jeg forlot standard sveveeffekten, noe som øker størrelsen på knappen som du kan se på den øverste knappen. Jeg la også standardteksten, som sier VIS.
For dette eksemplet brukte jeg de fleste innstillingene fra de forrige eksemplene, men med noen få modifikasjoner. Jeg fjernet den blå bakgrunnen, endret radiusen på grensen og fjernet grensen. Jeg begrenset også kategoriene til bare å vise Divi-hendelser (en av de to kategoriene med eksempler jeg opprettet). Grensen er satt til 2 hendelser.
For dette eksemplet har jeg satt oppsettet til å vise 3 kolonner. Jeg fjernet knappekanten og sentrerte knappjusteringen. Jeg fjernet også URL-en, endret fargen på detaljteksten, endret knappeteksten og ga kortene en skygge slik at de skilte seg ut mot bakgrunnen.
Divi arrangementskalendermodul
Her er en oversikt over den andre modulen. Det gir en kalendervisning av hendelsene dine. Kalenderen inkluderer måned, år, navigering og fremhever dagens dato. Dette er hendelsessiden til Art Gallery Layout Pack. Når du holder musepekeren over en hendelse, vises et popup-vindu som inneholder informasjonen. Dette er standardvisningen.
Fanen Design legger til parametere for modulteksten. Det vil valgfritt inkludere innstillinger for tittel, måned osv. I dette eksemplet har jeg justert vekt, farge og størrelse på teksten. Dette justerer datoene i kalenderen.
For dette eksemplet endret jeg skriftfamilien til Roboto og justerte farge, størrelse, bokstavavstand og linjehøyde. Jeg ga også teksten en skygge for å hjelpe den til å skille seg ut. All tekst unntatt “I dag” -knappen påvirkes av størrelse, avstand og høyde.
Du kan også justere rammen, bakgrunner, bokseskygger osv. I dette eksemplet har jeg satt modulteksten til store bokstaver. Dette inkluderer teksten til måneden og dagen. Jeg justerte også bakgrunnen, ga modulen en kantlinje (ved bruk av dobbel kantstil) og ga den en bokseskygge. Rammen har samme farge som teksten.
For denne har jeg tatt med farger og skyggeinnstillinger for layoutboksen. Jeg elsker måten det fungerer med layoutdesignet. Selv med det begrensede antall justeringer er kalendervisningsmodulen verdt å bruke med Divi-oppsettene dine.
Priser og dokumentasjon
Du kan få Calendar of Events-modulen på utvikler nettsted for $35. Det inkluderer ubegrenset bruk av nettstedet Web, livstidsstøtte og oppdateringer, og en 30-dagers pengene-tilbake-garanti.
Dokumentasjonen er dekket med en video og en kort artikkel for å guide deg gjennom installasjonen, og noen korte artikler for å vise hvordan du bruker den og hvordan du gjør oppdateringer. Jeg har vært heldig at jeg ikke trengte å konsultere dokumentasjonen (modulene er veldig intuitive), men jeg er glad for å se at den er tilgjengelig når den er nødvendig.
Andre ressurser
- Hvordan lage kalendere med hendelseskalender
- Slik konfigurerer du WP Events Manager-plugin
- 10 plugins for å integrere en kalender på WordPress
- 10 plugins for å administrere hendelser på WordPress
Slutt tanker
Dette er vårt syn på plugin-modulen Divi Events Calendar Module for Divi. Modulene fungerer som alle Divi-moduler, så det er enkelt å utforme hendelsene dine til å fungere med Divi-layoutene dine. Hovedkalendermodulen inkluderer til og med polstring, margin- og kantjusteringer for de enkelte elementene i modulen. Dette gir deg kontrollen over å utforme dem som individuelle kort.
Det lar deg legge inn kategoriene som skal vises hvis du vil ha mer kontroll. Dette er det eneste som fungerer annerledes enn andre moduler som lar deg velge alternativene fra en rullegardinliste. Jeg foretrekker rullegardinmenyen. Dette er noe jeg ønsker å se forandring i fremtiden. Jeg vil også kunne velge arrangementer basert på lokasjoner, arrangører av arrangementer osv.
Selve arrangementskalenderen er et flott verktøy for alle nettstedet Web. Det er nyttig for fotoshoots, konserter, produktutstillinger, handelsarrangementer, møter og mye mer. Hvis du vil bruke Event Calendar-pluginet med Divi-nettstedet ditt, er Divi Events Calendar-plugin verdt en titt.
Takk for denne flotte artikkelen!
Spørsmål: Jeg har opprettet en "Agenda" -side med Divi -hendelseskalenderen ved å følge forklaringene dine.
Alt fungerer, det er kult.
Når jeg går inn på detaljene for en hendelse (se mer), har jeg imidlertid en lenke "Alle hendelser" over beskrivelsen av hendelsen.
Denne lenken tar meg tilbake til standard "Arrangementskalender" -siden og ikke til "Kalender" -siden.
Hvordan du endrer denne lenken (eller parametrene) for å gå tilbake til den første "Agenda" -siden.
takk