Sådan opbygger du en produktkøreplansside i Elementor

En produktkøreplan bygget som en lodret tidslinje med fire trin

Nøgle takeaways

  • Elementor har ingen køreplanswidget, så en Elementor-køreplan er normalt bygget med en tidslinjewidget, hvor hvert element er én funktion eller fase.
  • Master Addons Timeline-widgetten lader hvert element vise et brugerdefineret mærke i stedet for en dato, som passer til køreplansstatusser såsom afsendt, igangværende, næste og udforskende.
  • En køreplan for offentlige produkter fungerer bedst med statusetiketter eller kvartaler, fordi nøjagtige datoer på en køreplan bliver til løfter, som kunderne husker.
  • Tidslinje-widgetten kan vise en køreplan lodret med venstre, center, overlejring eller højre justering eller som en vandret karrusel med pile.
  • Den fokuserede tilstand i Timeline-widgettens Style-fane giver det element, en besøgende har rullet til sin egen kortbaggrund og punktfarve.

En Elementor køreplansside viser kunderne, hvad du har sendt, hvad du bygger, og hvad der kommer derefter. elementor indeholder ikke en køreplanswidget, men en køreplan er en tidslinje med statusser i stedet for datoer, så en tidslinjewidget udfører jobbet. Denne vejledning bruger Master Addons Tidslinje widget.

Eksemplet er en fire-element software køreplan: Afsendt, I gang, Næste op og Exploring. Den samme bygning virker for en kursusplan, en byggeplan eller en onboarding proces. Du vil opsætte emnerne, bytte datoer for etiketter, vælge et layout og style faserne.

Hvad går på en produkt roadmap side

En produkt roadmap side lister planlagt arbejde i rækkefølge af, hvor tæt det er at frigive. Hver post har brug for tre ting: en status, et kort navn og en sætning på, hvad kunden får.

De fleste offentlige køreplaner bruger et af to systemer til status:

systemEksempel etiketterBrug den når
StatuslabelsSendt, I gang, Næste op, UdforskningDu ønsker ikke at forpligte dig til datoer
TidsspandeQ1 2027, Q2 2027, SenereDu planlægger i kvartaler og kan stå bag dem
Præcise datoer14. marts 2027Datoen er fast, såsom en begivenhed eller en lancering

Status etiketter er det sikreste valg for software. En gled dato på en offentlig side bliver screenshottet, og en etiket som “Next up” kan ikke glide.

Sådan opbygger du køreplanen i Elementor

Du skal bruge Elementor og Master Addons. Selve køreplanen er én Tidslinje widget indstillet til Brugerdefineret tidslinje.

Trin 1: Planlæg faserne

Skriv listen, før du åbner redaktøren. Fire til otte elementer er rigeligt. For dette eksempel:

skiltsærpræEn-linje beskrivelse
AfsendtCheckout redesignEn side checkout med gemte vogne.
I gangTeamarbejdsområderDelte projekter, roller og kommentarer.
Næste opMobil appiOS- og Android-apps med offlinetilstand.
UdforskningOffentlig APIWebhooks og en REST API til integrationer.

Trin 2: Tilføj tidslinje-widgetten

Rediger din køreplansside med Elementor, søg i widgetpanelet efter Tidslinje og træk det ind på siden. Behold Tidslinje Type på Brugerdefineret tidslinje. Widgetten starter med tre prøveemner. Brug Tilføj vare for en fjerde, eller duplikatikonet på en række for at kopiere en.

Ny på widgetten? Sådan oprettes en tidslinje i Elementor går gennem hver kontrol.

Trin 3: Udskift datoer med brugerdefinerede etiketter

Åbn det første element. Ændre udstille fra Dato til Brugerdefineret etiket, skriv derefter status i skilt felt. I indholdseditoren skal du gøre den første linje til en overskrift med funktionsnavnet og skrive beskrivelsen under den.

Elementor Tidslinjeelement med Vis indstillet til Brugerdefineret etiket og etiketten Næste op, bruges til et produkt køreplan
Vis indstillet til Brugerdefineret etiket, med “Næste op” i feltet Etiket. Etiketten vises, hvor datoen ville være.

Gentag for hvert element. Det valgfrie lænke felt gør et helt kort klikbart, hvilket er nyttigt til at sende en afsendt funktion til dets udgivelsespost eller dets dokumenter.

Produktkøreplan bygget med Elementor Timeline-widgetten, der viser afsendte, igangværende, næste og udforskningsfaser
Den færdige køreplan i standardcenterjusteringen med fire statusetiketter i stedet for datoer.

Trin 4: Vælg et layout

Midterlayoutet ovenfor skifter kort til venstre og højre. To andre layout passer godt til en køreplan.

Venstrejusteret. Åbn i fanen Stil opsætning og sæt Vandret Juster til venstre. Hvert kort sidder på den ene side med sin etiket inde i det. Dette lyder som en liste, som er lettere at scanne, når beskrivelserne kører længere.

Venstrejusteret produktkøreplan i Elementor med hvert kort på den ene side af tidslinjelinjen
Venstre justering holder hver fase i én kolonne.

Vandret. I fanen Indhold, indstil Tidslinje stil til Vandret Tidslinje. Faserne bliver til en karrusel med etiketterne over stregen. Dette tager én række, så det passer på en startside eller under en prissætningstabel.

Vandret produkt køreplan karrusel i Elementor med afsendt, i gang og næste op over linjen
De samme elementer som en vandret køreplan med pilnavigation.

Karruselindstillingerne er dækket ind sådan oprettes en horisontal tidslinje i Elementor.

Trin 5: Stil faserne

Åbn fanen Stil, og arbejd gennem fire sektioner.

  • kort: polstring, grænseradius og titel- og indholdsfarver. Fanen Fokuseret styler det kort, den besøgende har rullet til.
  • Datoer: typografi og farve til statusmærkaterne. Fed med en mærkefarve gør dem læst som tags.
  • række: Baggrunden er det fulde spor, og Progress Color udfyldes, mens den besøgende ruller.
  • punkter: en prik, et ikon eller et billede, med separate Standard-, Hover- og Fokuserede farver.

Hvert element har også sin egen Style-fane i panelet Content, for punkt- og farveindstillinger på det pågældende element alene. Brug det til at give det afsendte element en anden punktfarve end resten, så færdigt arbejde er synligt med et øjeblik.

Vil du se flere layouts først? de Elementor Tidslinje widget page har live-demoer, inklusive en horisontal køreplan.

Hvad skal man lægge rundt om køreplanen

En køreplansside læser bedre med lidt kontekst over og under tidslinjen.

  • En kort intro det siger, hvor ofte siden opdateres.
  • Et feedback link under tidslinjen til en formular eller en funktionsanmodningstavle.
  • En ændringslog for det, der allerede er afsendt. Den changelogs widget viser versionsposter på samme side.
  • Numbers, hvis du har dem. En række af opgøre widgets kan vise funktioner, der er afsendt i år.
  • En fremskridtsindikator for et stort projekt, ved hjælp af Progress Bar-widget.

Hvis køreplanen kun er for kunder, skal vejledning om visningsbetingelser viser, hvordan du skjuler en sektion for loggede besøgende.

Ofte stillede spørgsmål

Har Elementor en køreplans-widget?

Nej. Elementor og Elementor Pro har ingen køreplan eller tidslinje widget. De fleste Elementor køreplaner er bygget med en tidslinje widget fra en addon, med hvert element, der bruges som én fase eller funktion.

Kan jeg vise en køreplan uden datoer i Elementor?

Ja. I Master Addons Timeline widget skal du indstille Vis til brugerdefineret etiket på hvert element og skrive en status som afsendt eller Næste op. Etiketten træder i stedet for datoen ved siden af punktet.

Skal en offentlig køreplan være lodret eller vandret?

Brug lodret, når hver fase har et par linjer beskrivelse, og vandret, når køreplanen er en kort stribe af tre til seks faser inde i en anden side. Tidslinje widget skifter mellem dem med Timeline Style kontrol.

Hvordan markerer jeg et køreplanspunkt som udført?

Skift dens etiket til Afsendt og giv den en anden punktfarve i varens egen Style-fane. Du kan også tilføje et Link til udgivelsesposten, så besøgende kan læse, hvad der er ændret.

Endelige tanker

En Elementor køreplan er én Tidslinje widget med fire til otte Brugerdefinerede Tidslinje elementer, Vis indstillet til Brugerdefineret etiket, og en status i hvert Etiket felt. Vælg center, venstre eller vandret for layoutet, og brug derefter afsnittene Kort, Datoer, Linje og Punkter til at gøre afsendt arbejde står bortset fra planlagt arbejde.

Start fra en demo på Tidslinje widget side og udskift prøveemnerne med dine egne faser.

Billede af Roy Jemee
Roy Jemee
Jeg er Roy Jemee, Content Wrangler og Marketer hos Pixar Labs, der arbejder på Master Addons for Elementor. Jeg skriver tutorials, optager videoerne og holder dokumentationen aktuel, så du altid ved, hvordan du bruger hver funktion. Jeg håndterer også support, så hvis du rammer en hage, er jeg den person, der hjælper dig med at rette det. Rigtige svar, fra en person, der bruger disse værktøjer hver dag.

Efterlad et svar

Din e-mailadresse vil ikke blive offentliggjort. Påkrævede felter er markeret *