Gå till innehållet

Divi tutorial: Hur man använder modulen Rate Tables

Divi: det enklaste WordPress-temat att använda

Divi: Det bästa WordPress-temat hela tiden!

mer 901.000-nedladdningar, Divi är det mest populära WordPress-temat i världen. Den är komplett, lätt att använda och levereras med mer än 62 gratis mallar. [Rekommenderas]

Det är enklare än någonsin att skapa pristabeller för dina produkter online. Skapa så många tabeller som du vill och kontrollera priserna och funktionerna för var och en med hjälp av pristabellerna i ditt Divi WordPress-tema. Du kan till och med komma med en viss plan för att öka antalet omvandlingar. Även om din modul innehåller flera pristabeller kommer den att behandlas som en enda modul och kan placeras under vilken kolumnstorlek som helst.

Så här lägger du till en taxatabellmodul på din sida

Innan du kan lägga till en pristabellmodul på din sida måste du först hoppa in i Divi Builder. När Divi-temat har installerats på din webbplats kommer du att märka en knapp Använd Divi Builder ovanför inläggsredigeraren när du skapar en ny sida. Klicka på den här knappen för att aktivera Divi Builder och få tillgång till alla Divi Builder-moduler. Klicka sedan på knappen Använd Visual Builder för att starta generatorn i visuellt läge. Du kan också klicka på knappen Använd Visual Builder när du surfar på din webbplats i förgrunden om du är ansluten till din WordPress-instrumentpanel.

Modulprissättningstabeller

När du har angett Visual Builder kan du klicka på den grå plusknappen för att lägga till en ny modul på din sida. Nya moduler kan bara läggas till inom rader. Om du börjar en ny sida, kom ihåg att först lägga till en rad på din sida.

divi wordpress pris chart.png

Leta reda på pristabellsmodulen i listan över moduler och klicka på den för att lägga till den på din sida. Listan över moduler är sökbar, vilket innebär att du också kan skriva ordet "pristabeller" och sedan klicka på "enter" för att automatiskt söka och lägga till pristabellsmodulen! När modulen har lagts till hälsas du av listan över modulalternativ. Dessa alternativ är uppdelade i tre huvudgrupper: Innehåll , Conception et advanced .

Användningsfall: Lägg till en pristabell för en produktsida

När du marknadsför dina produkter på en målsida kan prisdiagram visa upp dina olika prisalternativ.

I det här exemplet ska jag lägga till en prissättningstabellmodul för att visa tre prissättningsplaner (eller tabeller) där en av dessa planer sticker ut som en utvald plan för att öka konverteringarna.

WordPress prisbord divi.jpg

Lägg först till ett nytt vanligt avsnitt på sidan där pristabellerna ska visas. Lägg till en rad med full bredd (1 kolumn) i avsnittet och sätt in en prissättningstabell i raden.

pris tabell linje divi.png

Klicka på fliken Innehåll i inställningarna för pristabellerna + Lägg till en ny artikel för att lägga till ditt första bord.

nytt kolumnpris diagram.png

Uppdatera parametrarna för prissättningstabellen enligt följande:

Innehållsalternativ

Titel: Personlig valuta: $ Av: år Pris: 69 Knapptext: Registreringsinnehåll:
Tillgång till alla teman Eviga temauppdateringar Premium teknisk support -Tillgång till alla plugins -Shop överlagringsfiler -Ingen årsavgift
Button URL: [enter button URL] Bakgrund: #ffffff

Designalternativ

Pris Textfärg: # 3e51b5 Använd anpassade knappstilar: JA-knapp Textfärg: #ffffff Knappfärg: # 3e51b5 Knappbredd: 0 pixlar

Spara inställningar

divi wordpress pris diagram example.png

Du duplicerar nu pristabellen du just skapade två gånger för att ha tre pristabeller totalt.

skapandet av flera exempel på tableau.jpg

Uppdatera följande alternativ för tabellen för mellanskurs:

Innehållsfliken

Titel: Utvecklarpris: 89 Innehåll: Tillgång till alla teman Eviga temauppdateringar Högsta tekniska support Tillgång till alla lager i Photoshop-filer - ingen årsavgift Knapp-URL: [ange knapp-URL]

Design fliken

Textfärg: # 0091ca Knappfärg: # 0091ca

För den tredje prissättningstabellen uppdaterar du inställningarna enligt följande:

Innehållsfliken

Titel: Livstidspris: 249 Knapptext: Prenumerera Innehåll: Tillgång till alla teman Eviga temauppdateringar Högsta tekniska support Tillgång till alla plugins Lagerade Photoshop-filer Ingen årsavgift Knapp-URL: [ange URL knapp]

Spara inställningar

Gå tillbaka till inställningarna för prissättningstabellen och uppdatera följande:

Innehållsalternativ

Presenterad bakgrundsfärg för tabellen: #0091ca

Designalternativ

Bollfärg: # 3e51b5 Färg på bordsfärg: # 0091ca

resultat av divi.jpg pristabell

Spara inställningar

Gå tillbaka och redigera sektionsinställningarna för att ge avsnittet en bakgrundsfärg på #3e51b5.

Det är allt. Nu har du en pristabell med tre alternativ med det mellersta alternativet som ett utvalt objekt som sticker ut från resten.

pris tabell alternativ divi.jpg

Innehållsalternativ för prissättningstabeller

På fliken innehåll hittar du alla innehållselement i modulen, till exempel text, bilder och ikoner. Allt som styr vad visas i din modul hittas alltid på den här fliken.

pris tabell design option.png

+ Lägg till en ny artikel

Det är här du lägger till nya pristabeller i din modul. Genom att klicka på "+ lägg till nytt objekt" öppnas en helt ny lista med designalternativ som är specifika för den pristabellen. Se nedan för individuella pristabellinställningar.

När du har lagt till din första flik visas ett grått fält med din pristabellstitel i form av en etikett. Det grå fältet har också tre knappar som låter dig redigera, duplicera eller ta bort tabellen.

Visa kula

Som standard visas pristabellartiklar som punktlistor. Om du vill ta bort kulor från funktionslistan kan du stänga av det här alternativet.

Bakgrundsfärg på den presenterade tabellen

Varje pristabell kan "presenteras". Utvalda tabeller är markerade i raden, vilket skiljer dem från andra alternativ. Med den här inställningen kan du bara ändra bakgrundsfärgen för utvalda tabeller.

Tabellrubrikens bakgrundsfärg

Ovanför varje pristabell finns ett rubrikområde som innehåller ditt bords titel och undertext. Du kan styra bakgrundsfärgen för detta område oberoende av bakgrundsfärgen på huvudtabellen genom att välja önskad färg från färgväljaren.

Utvalda tabellrubrik

Varje pristabell kan "presenteras". Utvalda tabeller är markerade i raden, vilket skiljer dem från andra alternativ. Med den här inställningen kan du bara ändra bakgrundsfärgen på rubriken för valda tabeller.

Bakgrundsfärg

Som standard har pristabellerna en vit bakgrundsfärg. Om du vill använda en annan färg för din prissättningstabellbakgrund kan du ställa in din anpassade färg här med färgväljaren.

Admin-etikett

Detta ändrar moduletiketten i konstruktorn för enkel identifiering. När du använder vyn WireFrame i Visual Builder visas dessa etiketter i modulblocket i Divi Builder-gränssnittet.

Prissättningstabellens designalternativ

På fliken Design hittar du alla stilalternativ för modulen, som teckensnitt, färger, storlek och avstånd. Det här är fliken du använder för att ändra utseendet på din modul. Varje Divi-modul har en lång lista med designinställningar som du kan använda för att ändra vad som helst.

array design option.png

uppriktning

Som standard vänster funktionslistor i pristabellen. Om du vill justera dem kan du aktivera det här alternativet.

Ta bort skugga från utvalt bord

Som standard har pristabeller en subtil skugga bakom varje tabell. Om du vill ta bort den här skuggan kan du aktivera det här alternativet.

Artiklar från listan i mitten

Här kan du välja att centrera artiklarna i tabellen.

Bollfärg

Som standard ärver kulor i listan över pristabeller ditt temas accentfärg. Om du vill använda en annan färg kan du ställa in den här med färgväljaren.

Färg på det presenterade bordet

Om du vill använda en annan färg för kulorna i prissättningstabellerna kan du ställa in den färgen här med hjälp av färgväljaren.

Rekommenderad tabellhuvud Textfärg

Det här alternativet styr färgen på textfärgen på din tabellrubrik. Om du ändrar bakgrundsfärgen på tabellhuvudet kan du också ändra det här alternativet för att säkerställa läsbarhet.

Huvudteckensnitt

Du kan ändra typsnittet i rubriktexten genom att välja önskat typsnitt i rullgardinsmenyn. Divi levereras med dussintals fantastiska teckensnitt som drivs av Google-teckensnitt. Som standard använder Divi teckensnittet Open Sans för all text på din sida. Du kan också anpassa stilen på din text med fetstil, kursiv, versaler och understrukna alternativ.

Rubrikstorlek

Här kan du justera storleken på rubriktexten. Du kan dra avståndsreglaget för att öka eller minska storleken på din text eller direkt ange värdet för önskad textstorlek i inmatningsfältet till höger om reglaget. Inmatningsfälten stöder olika måttenheter, vilket innebär att du kan ange "px" eller "em" beroende på ditt storleksvärde för att ändra enhetstyp.

Skapa enkelt din webbplats med Elementor

Med Elementor kan du enkelt skapa en webbdesign med ett professionellt utseende. Sluta betala dyra för vad du kan göra själv. [Fritt]

Rubriktextfärg

Som standard visas alla textfärger på Divi i vitt eller mörkgrått. Om du vill ändra färgen på rubriktexten väljer du önskad färg i färgväljaren med det här alternativet.

Rubrikbokstavsavstånd

Bokstavsavstånd påverkar utrymmet mellan varje bokstav. Om du vill öka utrymmet mellan varje bokstav i rubriktexten, använd avståndsreglaget för att justera utrymmet eller ange önskad avståndsstorlek i inmatningsfältet till höger om reglaget. Inmatningsfälten stöder olika måttenheter, vilket innebär att du kan ange "px" eller "em" beroende på ditt storlek för att ändra enhetstyp.

Rubrikrad Höjd

Radhöjden påverkar utrymmet mellan varje rad i rubriktexten. Om du vill öka utrymmet mellan varje rad använder du skjutreglaget för att justera mellanslag eller anger önskad avståndsstorlek i inmatningsfält till höger om markören. Inmatningsfälten stöder olika måttenheter, vilket innebär att du kan ange "px" eller "em" beroende på ditt storlek för att ändra enhetstyp.

Färg på texten i den presenterade tabellen

Detta ändrar textfärgen för din utvalda tabell. Om du ändrar bakgrundsfärgen på din tabell kan du behöva ändra det här alternativet för att säkerställa läsbarheten.

Kroppsfont

Du kan ändra ditt kroppsteckensnitt genom att välja önskat typsnitt i rullgardinsmenyn. Divi levereras med dussintals fantastiska teckensnitt som drivs av Google-teckensnitt. Som standard använder Divi Open Sans-teckensnittet för all text på din sida. Du kan också anpassa stilen på din text med fetstil, kursiv, versaler och understrukna alternativ.

Kroppstypstorlek

Här kan du justera din kroppsstorlek. Du kan dra avståndsreglaget för att öka eller minska storleken på din text eller direkt ange värdet för önskad textstorlek i inmatningsfältet till höger om reglaget. Inmatningsfälten stöder olika måttenheter vilket innebär att du kan ange "px" eller "em" beroende på ditt storleksvärde för att ändra dess enhetstyp.

Kroppstextfärg

Som standard visas alla textfärger på Divi i vitt eller mörkgrått. Om du vill ändra färgen på din text väljer du önskad färg från färgväljaren med det här alternativet.

Spacing av kropps bokstäver

Bokstavsavstånd påverkar utrymmet mellan varje bokstav. Om du vill öka utrymmet mellan varje bokstav i din text, använd skjutreglaget för att justera mellanslag eller ange önskad avståndsstorlek i inmatningsfältet till höger om skjutreglaget. Inmatningsfälten stöder olika måttenheter vilket innebär att du kan ange "px" eller "em" beroende på ditt storleksvärde för att ändra dess enhetstyp.

Höjd på kroppslinjen

Radhöjd påverkar utrymmet mellan varje textrad i din kropp Om du vill öka utrymmet mellan varje rad, använd avståndsreglaget för att justera mellanslag eller ange önskad avståndsstorlek i inmatningsfältet till höger om markören. Inmatningsfälten stöder olika måttenheter vilket innebär att du kan ange "px" eller "em" beroende på ditt storleksvärde för att ändra dess enhetstyp.

Textfärg på tabellen undertexter

Detta ändrar texttextfärgen för din utvalda tabell. Om du ändrar bakgrundsfärgen på din tabell kan du behöva ändra det här alternativet för att säkerställa läsbarheten.

Textningstypsnitt

Du kan ändra typsnittet för din texttext genom att välja önskat typsnitt i rullgardinsmenyn. Divi levereras med dussintals fantastiska teckensnitt som drivs av Google-teckensnitt. Som standard använder Divi Open Sans-teckensnittet för all text på din sida. Du kan också anpassa stilen på din text med fetstil, kursiv, versaler och understrykningsalternativ.

Textstorlek eller textningstypstorlek

Här kan du justera storleken på din text under rubriken. Du kan dra avståndsreglaget för att öka eller minska storleken på din text eller direkt ange värdet för önskad textstorlek i inmatningsfältet till höger om reglaget. Inmatningsfälten stöder olika måttenheter vilket innebär att du kan ange "px" eller "em" beroende på ditt storleksvärde för att ändra dess enhetstyp.

Textfärg på underrubriken

Som standard visas alla textfärger i Divi i vitt eller mörkgrått. Om du vill ändra textfärgen för din text väljer du önskad färg från färgväljaren med det här alternativet.

Avstånd mellan bokstäver i underrubriker

Bokstavsavstånd påverkar utrymmet mellan varje bokstav. Om du vill öka utrymmet mellan varje bokstav i din texttext använder du skjutreglaget för att justera mellanslag eller anger önskad avståndsstorlek i inmatningsfältet till höger om skjutreglaget. Inmatningsfälten stöder olika måttenheter, vilket innebär att du kan ange "px" eller "em" beroende på ditt storlek för att ändra enhetstyp.

Höjden på underrubriken

Radhöjd påverkar utrymmet mellan varje rad i din texttext. Om du vill öka utrymmet mellan varje rad, använd avståndsreglaget för att justera utrymmet eller ange önskad avståndsstorlek i inmatningsfältet till höger om reglaget. Inmatningsfälten stöder olika måttenheter vilket innebär att du kan ange "px" eller "em" beroende på ditt storleksvärde för att ändra enhetstyp.

Valuta Valuta och frekvens

Du kan ändra valutateckensnitt och frekvenstext genom att välja önskat teckensnitt från rullgardinsmenyn. Divi levereras med dussintals fantastiska teckensnitt som drivs av Google-teckensnitt. Som standard använder Divi teckensnittet Open Sans för all text på din sida. Du kan också anpassa stilen på din text med fetstil, kursiv, versaler och understrykningsalternativ.

Valuta Valutastorlek och frekvens

Här kan du justera din valutastorlek och frekvenstext. Du kan dra avståndsreglaget för att öka eller minska storleken på din text eller direkt ange önskat textstorleksvärde i inmatningsfältet till höger om reglaget. Inmatningsfälten stöder olika måttenheter, vilket innebär att du kan ange "px" eller "em" beroende på ditt storleksvärde för att ändra enhetstyp.

Valutatekstfärg och frekvens

Som standard visas alla textfärger i Divi i vitt eller mörkgrått. Om du vill ändra färgen på din valuta och frekvenstext väljer du önskad färg från färgväljaren med det här alternativet.

Spacing av bokstäver och valutor

Bokstavsavstånd påverkar utrymmet mellan varje bokstav. Om du vill öka utrymmet mellan varje bokstav i din valuta- och frekvenstext använder du avståndsreglaget för att justera utrymmet eller anger önskad avståndsstorlek i inmatningsfältet till höger om reglaget. Inmatningsfälten stöder olika måttenheter vilket innebär att du kan ange "px" eller "em" beroende på ditt storleksvärde för att ändra enhetstyp.

Linje med frekvensvaluta

Linjehöjd påverkar utrymmet mellan varje rad i din valuta och frekvenstext. Om du vill öka utrymmet mellan varje rad använder du skjutreglaget för att justera utrymmet eller anger önskad avståndsstorlek i fältet till höger om markören. Inmatningsfälten stöder olika måttenheter vilket innebär att du kan ange "px" eller "em" beroende på ditt storleksvärde för att ändra enhetstyp.

Utvalda färgpris

Detta ändrar färgen på priserna för ditt utvalda bord. Om du ändrar bakgrundsfärgen på din tabell kan du behöva ändra det här alternativet för att säkerställa läsbarheten.

Pris polis

Du kan ändra teckensnittet i din pristext genom att välja önskat teckensnitt i rullgardinsmenyn. Divi levereras med dussintals fantastiska teckensnitt som drivs av Google-teckensnitt. Som standard använder Divi Open Sans-teckensnittet för all text på din sida. Du kan också anpassa stilen på din text med fetstil, kursiv, stora bokstäver och alternativ för understrykning.

Prisstorlek

Här kan du justera storleken på din pristext. Du kan dra avståndsreglaget för att öka eller minska storleken på din text eller direkt ange önskat textstorleksvärde i inmatningsfältet till höger om reglaget. Inmatningsfälten stöder olika måttenheter vilket innebär att du kan ange "px" eller "em" beroende på ditt storleksvärde för att ändra enhetstyp.

Pris textfärg

Som standard visas alla textfärger i Divi i vitt eller mörkgrått. Om du vill ändra färgen på din pristext väljer du önskad färg från färgväljaren med det här alternativet.

Spacing av prisbokstäver

Bokstavsavstånd påverkar utrymmet mellan varje bokstav. Om du vill öka utrymmet mellan varje bokstav i din pristext, använd avståndsreglaget för att justera utrymmet eller ange önskad avståndsstorlek i inmatningsfältet till höger om reglaget. Inmatningsfälten stöder olika måttenheter, vilket innebär att du kan ange "px" eller "em" beroende på ditt storleksvärde för att ändra enhetstyp.

Höjden av prissystemet

Radhöjd påverkar utrymmet mellan varje rad i din pristext Om du vill öka utrymmet mellan varje rad, använd avståndsreglaget för att justera utrymmet eller ange önskad avståndsstorlek i inmatningsfältet till höger om markören. Inmatningsfälten stöder olika måttenheter vilket innebär att du kan ange "px" eller "em" beroende på ditt storleksvärde för att ändra dess enhetstyp.

Använd gränsen

Om du aktiverar det här alternativet placeras en kant runt din modul. Denna kant kan anpassas med följande villkorliga parametrar.

Färg på gränsen

Det här alternativet påverkar färgen på din kant. Välj en anpassad färg från färgväljaren för att tillämpa den på din kant.

Bredden av gränsen

Som standard är gränserna 1 pixel breda. Du kan öka detta värde genom att dra områdesreglaget eller ange ett anpassat värde i inmatningsfältet till höger om reglaget. Anpassade måttenheter stöds, vilket innebär att du kan ändra standardenheten från "px" till något annat som em, vh, vw etc.

Gränsstil

Gränser stöder åtta olika stilar: solid, prickad, dubbel, spår, topp, överlägg och start. Välj önskad stil i rullgardinsmenyn för att tillämpa den på din gräns.

Använd anpassade stilar för knappen

Om du aktiverar detta alternativ visas olika inställningar för knappanpassning som du kan använda för att ändra utseendet på modulens knapp.

Knapptextstorlek

Denna inställning kan användas för att öka eller minska storleken på texten i knappen. Knappen anpassar sig när textstorleken ökar och minskar.

Knapptextfärg

Som standard antar knapparna accentfärgen för ditt tema som definierats i Theme Customizer. Med det här alternativet kan du tilldela en anpassad textfärg till knappen i den här modulen. Välj din anpassade färg med hjälp av färgväljaren för att ändra knappfärg.

Knapp bakgrundsfärg

Som standard har knapparna en transparent bakgrundsfärg. Detta kan ändras genom att välja önskad bakgrundsfärg från färgväljaren.

Bredden på knappgränsen

Alla Divi-knappar har en två pixlar kant som standard. Denna gräns kan ökas eller minskas med den här inställningen. Gränser kan tas bort genom att ange värdet 2.

Knapp kantfärg

Som standard antar knappgränserna ditt temas accentfärg enligt definitionen i Theme Customizer. Med det här alternativet kan du tilldela en anpassad kantfärg till knappen i den här modulen. Välj din anpassade färg med hjälp av färgväljaren för att ändra färgen på knappramen.

Knappen gränsradie

Gränsens radie påverkar rundan på hörnen på dina knappar. Som standard har knapparna i Divi en liten kantradie som avrundar hörnen med 3 pixlar. Du kan minska detta värde till 0 för att skapa en fyrkantig knapp eller öka det avsevärt för att skapa knappar med cirkulära kanter.

Spacing av bokstäverna

Bokstavsavstånd påverkar utrymmet mellan varje bokstav. Om du vill öka utrymmet mellan varje bokstav i din knapptext använder du skjutreglaget för att justera mellanslag eller anger önskad avståndsstorlek i inmatningsfältet till höger om skjutreglaget. Inmatningsfälten stöder olika måttenheter vilket innebär att du kan ange "px" eller "em" beroende på ditt storleksvärde för att ändra enhetstyp.

Boutton polis

Du kan ändra teckensnittet för din knapptext genom att välja önskat teckensnitt i rullgardinsmenyn. Divi levereras med dussintals fantastiska teckensnitt som drivs av Google-teckensnitt. Som standard använder Divi Open Sans-teckensnittet för all text på din sida. Du kan också anpassa stilen på din text med fetstil, kursiv, stora bokstäver och alternativ för understrykning.

Lägg till en knappikon

Inaktiverad, den här inställningen tar bort ikoner från din knapp. Som standard visar alla Divi-knappar en pilikon.

Knappikon

Om ikoner är aktiverade kan du använda den här inställningen för att välja vilken ikon du vill använda i din knapp. Divi har olika ikoner att välja mellan.

Knapp ikon färg

Om du justerar den här inställningen ändras färgen på ikonen som visas på din knapp. Som standard är ikonfärgen densamma som knappens textfärg, men den här inställningen låter dig justera färgen oberoende av varandra.

Knappikons placering

Du kan välja att visa ikonen för din knapp till vänster eller höger om din knapp.

Visa endast ikon när du svävar över knappen

Som standard visas knappikoner bara när du svävar. Om du vill att ikonen alltid ska visas stänger du av den här inställningen.

Textfärg vid knapptryckning

När knappen hålls över en besökares mus kommer den här färgen att användas. Färgen ändras från basfärgen som definierades i tidigare inställningar.

Höger knapp bakgrundsfärg

När knappen hålls över en besökares mus kommer den här färgen att användas. Färgen ändras från basfärgen som definierades i tidigare inställningar.

Färghake Gränssnittsknapp

När knappen hålls över en besökares mus kommer den här färgen att användas. Färgen ändras från basfärgen som definierades i tidigare inställningar.

Höger Border Radius Button

När knappen hålls över en besökares mus kommer detta värde att användas. Värdet ändras från basvärdet som definierats i tidigare inställningar.

Pekskärmknapp

När knappen hålls över en besökares mus kommer detta värde att användas. Värdet ändras från basvärdet som definierats i tidigare inställningar.

Avancerade valutakortsalternativ

På den avancerade fliken hittar du alternativ som mer erfarna webbdesigners kan hitta användbara, till exempel anpassade CSS- och HTML-attribut. Här kan du använda anpassad CSS på något av modulens många element. Du kan också tillämpa anpassade CSS-klasser och ID på modulen, som kan användas för att anpassa modulen i ditt barns temas style.css-fil.

avancerade alternativ divi prisdiagram.png

CSS ID

Ange ett valfritt CSS-ID som ska användas för den här modulen. Ett ID kan användas för att skapa en anpassad CSS-stil eller för att länka till vissa delar av din sida.

CSS klass

Ange de valfria CSS-klasserna som ska användas för den här modulen. En CSS-klass kan användas för att skapa anpassad CSS-styling. Du kan lägga till flera klasser, åtskilda av ett mellanslag. Dessa klasser kan användas i ditt Divi-underordnade tema eller i det anpassade CSS-stilarket som du lägger till på din sida eller på din webbplats med hjälp av Divi-temalternativ eller Divi Builder-sidinställningarna.

Anpassad CSS

Anpassad CSS kan också tillämpas på modulen och vilken modul som helst. I avsnittet Anpassad CSS hittar du ett textfält där du kan lägga till anpassade CSS-formatmallar direkt till varje element. CSS-poster i dessa inställningar är redan inslagna i stiltaggar. Så skriv bara in CSS-reglerna åtskilda av semikolon.

synlighet

Med det här alternativet kan du styra enheterna där din modul visas. Du kan välja att inaktivera din modul på surfplattor, smartphones eller stationära datorer individuellt. Detta är användbart om du vill använda olika mods på olika enheter, eller om du vill förenkla mobildesignen genom att eliminera vissa element från sidan.

Innehållsalternativ för individuella prissättningstabeller

individuell sektionspris tabell.png

Titel

Titeln du sätter in här kommer att användas för detta (Premium) prissättningsalternativ.

Textning

Undertexten du infogar här kommer att visas under din titel.

Utforma

Ange symbolen för önskad valuta här.

Från

Om din prissättning är prenumerationsbaserad, ange prenumerationscykeln här (till exempel År).

Prix

Ange produktvärdet här.

Knapptext

Ange knappen på knappen här.

Innehåll

I det här fältet kan du ange listan över funktioner som medföljer eller inte följer med din produkt. Separera varje lista på en ny rad och starta varje rad med en + eller - symbol. A + anger en inkluderad funktion, medan A - anger en utesluten funktion.

Knappadress

Längst ner i varje tabell kan du infoga en Call to Action-knapp genom att infoga en giltig webbadress i det här fältet. Lämna detta och
tomt knappfält om du inte vill ha en knapp i pristabellen.

Bakgrundsfärg

Definiera en anpassad bakgrundsfärg för din modul eller lämna tom för att använda standardfärgen.

Designalternativ för individuella prissättningstabeller

pris kolumn kolumn stil divi.png

Gör den här tabellen tillgänglig

Välj att lägga fram denna pristabell eller inte med den här rullgardinsmenyn. Detta gör att styrelsen kan sticka ut från resten.

Artikelfärg exkluderad

För objekt i din lista som har ställts ut som uteslutna med symbolen - kan du justera deras färg med den här inställningen. Du kanske till exempel vill ändra färgen till röd eller minska deras opacitet för att visuellt indikera att artiklarna är uteslutna från det aktuella paketet.

Rubrikrubrik

Du kan ändra typsnittet i rubriktexten genom att välja önskat typsnitt i rullgardinsmenyn. Divi levereras med dussintals fantastiska teckensnitt som drivs av Google-teckensnitt. Som standard använder Divi teckensnittet Open Sans för all text på din sida. Du kan också anpassa stilen på din text med fetstil, kursiv, versaler och understrukna alternativ.

Rubrikstorlek

Här kan du justera storleken på rubriktexten. Du kan dra avståndsreglaget för att öka eller minska storleken på din text eller direkt ange värdet för önskad textstorlek i inmatningsfältet till höger om reglaget. Inmatningsfälten stöder olika måttenheter, vilket innebär att du kan ange "px" eller "em" beroende på ditt storleksvärde för att ändra enhetstyp.

Rubriktextfärg

Som standard visas alla textfärger i Divi i vitt eller mörkgrått. Om du vill ändra färgen på rubriktexten väljer du önskad färg från färgväljaren med det här alternativet.

Avstånd mellan rubrikbokstäver

Bokstavsavstånd påverkar utrymmet mellan varje bokstav. Om du vill öka utrymmet mellan varje bokstav i rubriktexten, använd avståndsreglaget för att justera utrymmet eller ange önskad avståndsstorlek i inmatningsfältet till höger om reglaget. Inmatningsfälten stöder olika måttenheter, vilket innebär att du kan ange "px" eller "em" beroende på ditt storlek för att ändra enhetstyp.

Rubrikrad Höjd

Radhöjden påverkar utrymmet mellan varje rad i rubriktexten. Om du vill öka utrymmet mellan varje rad använder du skjutreglaget för att justera mellanslag eller anger önskad avståndsstorlek i inmatningsfält till höger om markören. Inmatningsfälten stöder olika måttenheter, vilket innebär att du kan ange "px" eller "em" beroende på ditt storlek för att ändra enhetstyp.

Kroppsfont

Du kan ändra ditt kroppsteckensnitt genom att välja önskat typsnitt i rullgardinsmenyn. Divi levereras med dussintals fantastiska teckensnitt som drivs av Google-teckensnitt. Som standard använder Divi Open Sans-teckensnittet för all text på din sida. Du kan också anpassa stilen på din text med fetstil, kursiv, versaler och understrukna alternativ.

Kroppstypstorlek

Här kan du justera din kroppsstorlek. Du kan dra avståndsreglaget för att öka eller minska storleken på din text eller direkt ange värdet för önskad textstorlek i inmatningsfältet till höger om reglaget. Inmatningsfälten stöder olika måttenheter vilket innebär att du kan ange "px" eller "em" beroende på ditt storleksvärde för att ändra dess enhetstyp.

Kroppstextfärg

Som standard visas alla textfärger i Divi i vitt eller mörkgrått. Om du vill ändra färgen på din text väljer du önskad färg från färgväljaren med det här alternativet.

Spacing av kropps bokstäver

Bokstavsavstånd påverkar utrymmet mellan varje bokstav. Om du vill öka utrymmet mellan varje bokstav i din text, använd skjutreglaget för att justera mellanslag eller ange önskad avståndsstorlek i inmatningsfältet till höger om skjutreglaget. Inmatningsfälten stöder olika måttenheter vilket innebär att du kan ange "px" eller "em" beroende på ditt storleksvärde för att ändra dess enhetstyp.

Höjd på kroppslinjen

Radhöjd påverkar utrymmet mellan varje textrad i din kropp Om du vill öka utrymmet mellan varje rad, använd avståndsreglaget för att justera mellanslag eller ange önskad avståndsstorlek i inmatningsfältet till höger om markören. Inmatningsfälten stöder olika måttenheter vilket innebär att du kan ange "px" eller "em" beroende på ditt storleksvärde för att ändra dess enhetstyp.

Textningstypsnitt

Du kan ändra typsnittet för din texttext genom att välja önskat typsnitt i rullgardinsmenyn. Divi levereras med dussintals fantastiska teckensnitt som drivs av Google-teckensnitt. Som standard använder Divi teckensnittet Open Sans för all text på din sida. Du kan också anpassa stilen på din text med fetstil, kursiv, versaler och understrykningsalternativ.

Textstorlekstorlek

Här kan du justera storleken på din text under rubriken. Du kan dra avståndsreglaget för att öka eller minska storleken på din text eller direkt ange värdet för önskad textstorlek i inmatningsfältet till höger om reglaget. Inmatningsfälten stöder olika måttenheter vilket innebär att du kan ange "px" eller "em" beroende på ditt storleksvärde för att ändra dess enhetstyp.

Texttextfärg

Som standard visas alla textfärger i Divi i vitt eller mörkgrått. Om du vill ändra textfärgen för din text väljer du önskad färg från färgväljaren med det här alternativet.

Spacing av undertext bokstäver

Bokstavsavstånd påverkar utrymmet mellan varje bokstav. Om du vill öka utrymmet mellan varje bokstav i din texttext använder du skjutreglaget för att justera mellanslag eller anger önskad avståndsstorlek i inmatningsfältet till höger om skjutreglaget. Inmatningsfälten stöder olika måttenheter, vilket innebär att du kan ange "px" eller "em" beroende på ditt storlek för att ändra enhetstyp.

Höjd på underrubriken

Radhöjd påverkar utrymmet mellan varje rad i din texttext. Om du vill öka utrymmet mellan varje rad, använd avståndsreglaget för att justera utrymmet eller ange önskad avståndsstorlek i inmatningsfältet till höger om reglaget. Inmatningsfälten stöder olika måttenheter vilket innebär att du kan ange "px" eller "em" beroende på ditt storleksvärde för att ändra enhetstyp.

Valuta Valuta och frekvens

Du kan ändra valutateckensnitt och frekvenstext genom att välja önskat teckensnitt från rullgardinsmenyn. Divi levereras med dussintals fantastiska teckensnitt som drivs av Google-teckensnitt. Som standard använder Divi teckensnittet Open Sans för all text på din sida. Du kan också anpassa stilen på din text med fetstil, kursiv, versaler och understrykningsalternativ.

Teckenstorlek för valuta och frekvens

Här kan du justera din valutastorlek och frekvenstext. Du kan dra avståndsreglaget för att öka eller minska storleken på din text eller direkt ange önskat textstorleksvärde i inmatningsfältet till höger om reglaget. Inmatningsfälten stöder olika måttenheter, vilket innebär att du kan ange "px" eller "em" beroende på ditt storleksvärde för att ändra enhetstyp.

Textfärg för valuta och frekvens

Som standard visas alla textfärger i Divi i vitt eller mörkgrått. Om du vill ändra färgen på din valuta och frekvenstext väljer du önskad färg från färgväljaren med det här alternativet.

Spacing av bokstäver och valutor

Bokstavsavstånd påverkar utrymmet mellan varje bokstav. Om du vill öka utrymmet mellan varje bokstav i din valuta- och frekvenstext använder du avståndsreglaget för att justera utrymmet eller anger önskad avståndsstorlek i inmatningsfältet till höger om reglaget. Inmatningsfälten stöder olika måttenheter vilket innebär att du kan ange "px" eller "em" beroende på ditt storleksvärde för att ändra enhetstyp.

Valuta- och frekvenslinje

Linjehöjd påverkar utrymmet mellan varje rad i din valuta och frekvenstext. Om du vill öka utrymmet mellan varje rad, använd områdesreglaget för att justera mellanslag eller ange önskad avståndsstorlek i fält till höger om markören. Inmatningsfälten stöder olika måttenheter, vilket innebär att du kan ange "px" eller "em" beroende på ditt storlek för att ändra enhetstyp.

Prispolitik

Du kan ändra typsnittet i din pristext genom att välja önskat typsnitt i rullgardinsmenyn. Divi levereras med dussintals fantastiska teckensnitt som drivs av Google-teckensnitt. Som standard använder Divi Open Sans-teckensnittet för all text på din sida. Du kan också anpassa stilen på din text med fetstil, kursiv, versaler och understrukna alternativ.

Prisstorlek

Här kan du justera storleken på din pristext. Du kan dra avståndsreglaget för att öka eller minska storleken på din text eller direkt ange önskat textstorleksvärde i inmatningsfältet till höger om reglaget. Inmatningsfälten stöder olika måttenheter vilket innebär att du kan ange "px" eller "em" beroende på ditt storleksvärde för att ändra enhetstyp.

Pris textfärg

Som standard visas alla textfärger i Divi i vitt eller mörkgrått. Om du vill ändra färgen på din pristext väljer du önskad färg från färgväljaren med det här alternativet.

Spacing av prisbokstäver

Bokstavsavstånd påverkar utrymmet mellan varje bokstav. Om du vill öka utrymmet mellan varje bokstav i din pristext, använd avståndsreglaget för att justera utrymmet eller ange önskad avståndsstorlek i inmatningsfältet till höger om reglaget. Inmatningsfälten stöder olika måttenheter, vilket innebär att du kan ange "px" eller "em" beroende på ditt storleksvärde för att ändra enhetstyp.

Höjden av prissystemet

Radhöjd påverkar utrymmet mellan varje rad i din pristext Om du vill öka utrymmet mellan varje rad, använd avståndsreglaget för att justera utrymmet eller ange önskad avståndsstorlek i inmatningsfältet till höger om markören. Inmatningsfälten stöder olika måttenheter vilket innebär att du kan ange "px" eller "em" beroende på ditt storleksvärde för att ändra dess enhetstyp.

Använd anpassade stilar för knappen

Om du aktiverar detta alternativ visas olika inställningar för knappanpassning som du kan använda för att ändra utseendet på modulens knapp.

Knapptextstorlek

Denna inställning kan användas för att öka eller minska storleken på texten i knappen. Knappen anpassar sig när textstorleken ökar och minskar.

Knapptextfärg

Som standard antar knapparna accentfärgen för ditt tema som definierats i Theme Customizer. Med det här alternativet kan du tilldela en anpassad textfärg till knappen i den här modulen. Välj din anpassade färg med hjälp av färgväljaren för att ändra knappfärg.

Knapp bakgrundsfärg

Som standard har knapparna en transparent bakgrundsfärg. Detta kan ändras genom att välja önskad bakgrundsfärg från färgväljaren.

Bredden på knappgränsen

Alla Divi-knappar har en gräns på 2 pixlar som standard. Denna gräns kan ökas eller minskas med den här inställningen. Gränser kan tas bort genom att ange värdet 0.

Knapp kantfärg

Som standard antar knappgränserna ditt temas accentfärg enligt definitionen i Theme Customizer. Med det här alternativet kan du tilldela en anpassad kantfärg till knappen i den här modulen. Välj din anpassade färg med hjälp av färgväljaren för att ändra färgen på knappramen.

Knappen gränsradie

Gränsens radie påverkar rundan på hörnen på dina knappar. Som standard har knapparna i Divi en liten kantradie som avrundar hörnen med 3 pixlar. Du kan minska detta värde till 0 för att skapa en fyrkantig knapp eller öka det avsevärt för att skapa knappar med cirkulära kanter.

Spacing av knapp bokstäver

Bokstavsavstånd påverkar utrymmet mellan varje bokstav. Om du vill öka utrymmet mellan varje bokstav i din knapptext använder du skjutreglaget för att justera mellanslag eller anger önskad avståndsstorlek i inmatningsfältet till höger om skjutreglaget. Inmatningsfälten stöder olika måttenheter vilket innebär att du kan ange "px" eller "em" beroende på ditt storleksvärde för att ändra enhetstyp.

Knapp typsnitt

Du kan ändra teckensnittet för din knapptext genom att välja önskat teckensnitt i rullgardinsmenyn. Divi levereras med dussintals fantastiska teckensnitt som drivs av Google-teckensnitt. Som standard använder Divi Open Sans-teckensnittet för all text på din sida. Du kan också anpassa stilen på din text med fetstil, kursiv, versaler och understrykningsalternativ.

Lägg till en ikon på knappen

Inaktiverad, den här inställningen tar bort ikoner från din knapp. Som standard visar alla Divi-knappar en pilikon på svävaren.

Knappikon

Om ikoner är aktiverade kan du använda den här inställningen för att välja vilken ikon du vill använda i din knapp. Divi har olika ikoner att välja mellan.

Knapp ikon färg

Om du justerar den här inställningen ändras färgen på ikonen som visas på din knapp. Som standard är ikonfärgen densamma som knappens textfärg, men den här inställningen låter dig justera färgen oberoende av varandra.

Ikon knapp placering

Du kan välja att visa ikonen för din knapp till vänster eller höger om din knapp.

Visa endast ikon när du svävar över knappen

Som standard visas knappikoner bara när du svävar. Om du vill att ikonen alltid ska visas stänger du av den här inställningen.

Textfärg vid knapptryckning

När knappen hålls över en besökares mus kommer den här färgen att användas. Färgen ändras från basfärgen som definierades i tidigare inställningar.

Knapp bakgrundsfärg på flyover

När knappen hålls över en besökares mus kommer den här färgen att användas. Färgen ändras från basfärgen som definierades i tidigare inställningar.

Border färg vid flyover

När knappen hålls över en besökares mus kommer den här färgen att användas. Färgen ändras från basfärgen som definierades i tidigare inställningar.

Radi av gränsen för knappen vid översikt

När knappen hålls över en besökares mus kommer detta värde att användas. Värdet ändras från basvärdet som definierats i tidigare inställningar.

Spacing av bokstäverna på knappen på flyover

När knappen hålls över en besökares mus kommer detta värde att användas. Värdet ändras från basvärdet som definierats i tidigare inställningar.

Individuella pris Tabellalternativ Avancerade alternativ

avancerat alternativ divi.png

Anpassad CSS

Anpassad CSS kan också tillämpas på modulen och vilken modul som helst. I avsnittet Anpassad CSS hittar du ett textfält där du kan lägga till anpassade CSS-formatmallar direkt till varje element. CSS-poster i dessa inställningar är redan inslagna i stiltaggar. Så skriv bara in CSS-reglerna åtskilda av semikolon.

Andra Divi tutorials

Den här artikeln innehåller kommentarer 3

  1. Hej!
    Tack för den här mycket exakta och detaljerade artikeln. Jag är ny på att använda DIVI-byggaren och jag märker att efter att jag har skapat min pristabell med tre kolumner är mobilskärmen en katastrof (två extra smala kolumner och en tredje i rad ...).
    Finns det ett sätt (annat än att duplicera tabellen och dölja den) för att konfigurera detta som till exempel på Bootstrap (ge en kolumn bredden 33% på skrivbordet och 100% på mobilen)?
    Merci pour votre aide.

Lämna en kommentar

Din e-postadress kommer inte att publiceras. Obligatoriska fält är markerade *

Den här webbplatsen använder Akismet för att minska oönskade. Läs mer om hur dina kommentarer data används.

Tillbaka till toppen
5 aktier
del2
tweet
Enregistrer3