Hur man skapar ett cirkeldiagram i WordPress utan kodningskunskap

Att visa ett cirkeldiagram kan vara praktiskt för att presentera olika typer av data på en webbsida. Men om du inte är en kodare eller har tillräckligt med redigeringsförmåga för CSS kan det vara utmanande.

Inte med ElementsKit, förresten!

När du har ElementsKit installerat på din webbplats kan du enkelt lägga till ett cirkeldiagram på en webbsida bara genom att dra och släppa.

I det här blogginlägget får du lära dig hur du skapar cirkeldiagram i WordPress i några enkla steg.

Vad är ett cirkeldiagram?

När data presenteras grafiskt med olika sektioner i en cirkel kallas det ett cirkeldiagram. Data och presentationsstil kan variera, men data kommer att vara i en grafisk cirkel. Ibland kan du anpassa data för cirkeln och komma på något unikt.

Hur skapar man ett cirkeldiagram i WordPress?

Skapa ett cirkeldiagram direkt i din WordPress-instrumentpanel med några enkla steg. Följ riktlinjerna jag har delat här.

Steg 1: Installera plugins

Här är vårt mål att skapa ett cirkeldiagram i WordPress utan att skriva någon kod. Så vi kommer att använda de mest populära plugins Elementor tillägg ElementsKit.

För detta, gå till din WordPress instrumentpanel > Plugins > Lägg till nytt. Nu på översta sökfältet, sök efter Elementor. När du har hittat den, installera och aktivera.

Installera och aktivera ElementsKit på samma sätt.

Steg 2: Välj plugininställningarna

Du måste göra några inställningar i ElementsKit-plugin. För detta, gå till din WordPress-instrumentpanel och håll muspekaren till ElementsKit. Välj nu "Widgets" eftersom du skapar cirkeldiagrammet med Cirkeldiagram-widgeten.

Från listan över widgetar, aktivera widgeten "cirkeldiagram". Jag skulle dock rekommendera att slå på alla widgets för att få den bästa upplevelsen av att bygga webbsidor.

Steg 3: Skapa en ny sida

Nu är du redo att skapa ett diagram på en webbsida. Skapa en sida där du vill visa diagrammet med dina anpassade data. Eller så kan du välja en av de befintliga sidorna.

Vilken sida du än väljer för att visa cirkeldiagrammet, välj "Redigera med Elementor" uppe till höger.

Det kommer att omdirigera dig till redigeringssidan där du kan använda alla funktioner i ElementsKit. 

Steg 4: Lägg till cirkeldiagram-widget

På den vänstra sidopanelen, sök efter Cirkeldiagram-widget och dra och släpp den till sidan.

Om du vill kan du skapa en viss typ av avsnitt innan du drar och släpper widgeten på sidan.

För att lägga till ett avsnitt, klicka på plusikonen och lägg till avsnittet.

Steg 5: Anpassa cirkeldiagrammet

Som standard kommer det att finnas några förinställningar i cirkeldiagrammet. Du kan anpassa dessa inställningar med några få klick.

På innehållsfliken kan du ändra cirkeldiagramsstilen, diagraminnehållet och procentandelen för diagrammet.

Cirkeldiagramstil: Här kan du välja enkelt eller Med innehåll.

Diagraminnehåll: Under det här avsnittet kan du använda procent eller en ikon för diagrammet. Om du väljer en ikon kommer den att visa flera alternativ för att anpassa den. Ladda upp en anpassad ikon för att visa den på diagrammet.

Procentsats: Här kan du välja och ställa in procent för diagrammet.

Gå sedan till stilfliken för att göra lite styling av diagrammet.

Cirkeldiagramstorlek: Justera cirkeldiagramstorleken om du vill. Du kan skriva ner storleken eller dra stapeln för att öka eller minska storleken.

Kantstorlek: Ställ in kantstorleken här med justeringsfältet.

Färgtyp: Välj en anpassad färg för diagrammet som du vill.

Bar färg: Lägg till den stapelfärg som passar till sidans design.

Bar bakgrundsfärg: Lägg till en bakgrundsfärg till cirkeldiagrammet så att det ser bättre ut.

Ikonfärg: Om du har lagt till en ikon för diagrammet kan du här välja en anpassad färg för den.

Om du vill ha mer anpassning, gå till de avancerade inställningarna och gör nödvändiga ändringar för att göra diagrammet användarvänligt.

Steg 6: Anpassa sidutsikterna

Du kan också anpassa sidutsikterna med Elementor. För detta finns en prickad knapp högst upp i sektionen. Klicka på den och den omdirigerar dig till layoutfliken.

Du kommer att få alla alternativ för att anpassa sidans layout.

Steg 7: Förhandsgranska och publicera

Slutligen, om du har gjort allt ordentligt, kontrollera förhandsgranskningen av cirkeldiagrammet. Om det ser perfekt ut, tryck på publicera-knappen.

Några ytterligare resurser du skulle vilja läsa:

Hur man skapar en webbplats för en digital marknadsföringsbyrå [No-Code Style]

Hur man skapar en städföretagswebbplats i WordPress

Hur man skapar en karriärsida på din WordPress-webbplats

Varför ska du använda cirkeldiagram på din webbplats?

Cirkeldiagram gör informationen på en webbplats lätt att förstå. De använder färger och former för att visa procentsatser och jämförelser, vilket gör det enkelt för besökare att förstå komplexa data. Genom att använda cirkeldiagram kan du göra din webbplats mer intressant och hjälpa människor att förstå information bättre.

Slutord

Att skapa ett cirkeldiagram kommer inte att vara en utmanande uppgift för dig. Använd bara kraften. av ElementsKit. Liksom konventionella plugins är det inte för en enda typ av uppgift. Du kan designa en hel webbplats bara med ElementsKit. Så kör på det och börja få den perfekta formen för din webbplats.