Het is eenvoudiger dan ooit om online prijstabellen voor uw producten te maken. Maak zoveel tafels als u wilt en beheer de prijzen en functies van elk met de module Prijstabellen van uw WordPress theme Div. U kunt zelfs een bepaald plan bedenken om de conversies te verhogen. Zelfs als uw module meerdere prijstabellen bevat, wordt deze behandeld als één module en kan deze onder elke kolomgrootte worden geplaatst.

Een module Tarieftabellen toevoegen aan uw pagina

Voordat u een module Prijstabellen aan uw pagina kunt toevoegen, moet u eerst in Divi Builder springen. Zodra de Divi-thema geïnstalleerd op uw website, ziet u een knop Gebruik Divi Builder boven de berichteditor wanneer u een nieuwe pagina maakt. Klik op deze knop om Divi Builder te activeren en toegang te krijgen tot alle Divi Builder-modules. Klik vervolgens op de knop Gebruik Visual Builder om de generator in visuele modus te starten. U kunt ook op de knop klikken Gebruik Visual Builder wanneer u door uw website op de voorgrond bladert en u bent verbonden met uw WordPress-dashboard.

Module prijsstellingstabellen

Nadat u Visual Builder heeft geopend, kunt u op de grijze plusknop klikken om een ​​nieuwe module aan uw pagina toe te voegen. Nieuwe modules kunnen alleen binnen rijen worden toegevoegd. Als u een nieuwe pagina begint, vergeet dan niet om eerst een rij aan uw pagina toe te voegen.

divi wordpress price chart.png

Zoek de module prijstabellen in de lijst met modules en klik erop om deze aan uw pagina toe te voegen. De lijst met modules is doorzoekbaar, wat betekent dat u ook het woord "prijstabellen" kunt typen en vervolgens op "invoeren" kunt klikken om automatisch de module prijstabellen te zoeken en toe te voegen! Zodra de module is toegevoegd, wordt u begroet door de lijst met moduleopties. Deze opties zijn onderverdeeld in drie hoofdgroepen: Inhoud , Ontwerpfase et vergevorderd .

Gebruiksvoorbeeld: voeg een prijstabel toe voor een productpagina

Wanneer je de promotie van uw producten op een bestemmingspagina, kunnen prijstabellen uw verschillende prijsopties effectief laten zien.

In dit voorbeeld ga ik een prijstabelmodule toevoegen om drie tariefplannen (of tabellen) weer te geven, waarbij een van die plannen opvalt als een uitgelicht plan om het aantal conversies te verhogen.

WordPress prijstabel divi.jpg

Voeg eerst een nieuwe reguliere sectie toe aan de pagina waar de prijstabellen moeten worden weergegeven. Voeg een rij met de volledige breedte (1 kolom) toe aan de sectie en voeg een Pricing Tables-module in de rij in.

prijs tabel regel divi.png

Klik in de instellingen van de prijstabellen op het tabblad Inhoud op + Voeg een nieuw item toe om uw eerste tafel toe te voegen.

nieuwe kolomprijs chart.png

Werk de parameters van de prijstabel als volgt bij:

Inhoud opties

Titel: Persoonlijke valuta: $ Per: jaar Prijs: 69 Knoptekst: Registratie Inhoud:
Toegang tot alle thema's Permanente thema-updates Premium technische ondersteuning -Toegang tot alle plug-ins -Shop-overlay-bestanden -Geen jaarlijkse vergoeding
Button URL: [enter button URL] Achtergrond: #ffffff

Ontwerpopties

Prijs Tekstkleur: # 3e51b5 Gebruik aangepaste knopstijlen: JA Knoptekstkleur: #ffffff Knopkleur: # 3e51b5 Knopbreedte: 0px

Instellingen opslaan

divi wordpress prijskaart example.png

Dupliceer nu de prijstabel die u zojuist tweemaal hebt gemaakt om in totaal drie prijstabellen te hebben.

creatie van een aantal voorbeelden van tableau.jpg

Werk de volgende opties bij voor de middelste prijstabel:

Inhoud tabblad

Titel: Ontwikkelaar Prijs: 89 Inhoud: Toegang tot alle thema's Permanente thema-updates Premium technische ondersteuning Toegang tot alle gelaagde Photoshop-bestanden - geen jaarlijkse kosten Knop-URL: [knop-URL invoeren]

Ontwerp tabblad

Tekstkleur: # 0091ca Knopkleur: # 0091ca

Werk de instellingen voor de derde prijstabel als volgt bij:

Inhoud tabblad

Titel: Levenslange prijs: 249 Knoptekst: Abonneren Inhoud: Toegang tot alle thema's Permanente thema-updates Premium technische ondersteuning Toegang tot alle plug-ins Gelaagde Photoshop-bestanden Geen jaarlijkse kosten Knop-URL: [URL invoeren knop]

Instellingen opslaan

Ga nu terug naar de instellingen van de prijstabel en update het volgende:

Inhoud opties

Achtergrondkleur van aanbevolen tabel: #0091ca

Ontwerpopties

Kleur bal: # 3e51b5 Kleur tafel uitgelicht: # 0091ca

resultaat van de divi.jpg prijstabel

Instellingen opslaan

Ga nu terug en bewerk de sectie-instellingen om de sectie een achtergrondkleur te geven van #3e51b5.

Dat is alles. Nu heb je een prijzentabel met drie opties waarbij de middelste optie is ingesteld als een uitgelicht item dat zich onderscheidt van de rest.

Prijstabel optie divi.jpg

Inhoudsopties voor prijstabellen

Op het inhoudstabblad vind je alle inhoudselementen van de module, zoals tekst, afbeeldingen en iconen. Dat alles controleert wat verschijnt in uw module, vindt u altijd op dit tabblad.

prijs tafel ontwerp option.png

+ Voeg een nieuw artikel toe

Hier voegt u nieuwe prijstabellen toe aan uw module. Als u op "+ nieuw item toevoegen" klikt, wordt een geheel nieuwe lijst met ontwerpopties geopend die specifiek zijn voor die prijstabel. Zie hieronder voor individuele prijstabelinstellingen.

Nadat u uw eerste tabblad heeft toegevoegd, verschijnt er een grijze balk met de titel van uw prijstabel in de vorm van een label. De grijze balk heeft ook drie knoppen waarmee u de tabel kunt bewerken, dupliceren of verwijderen.

Laat Bullet zien

Standaard worden prijstabelitems weergegeven als lijsten met opsommingstekens. Als u opsommingstekens uit de lijst met functies wilt verwijderen, kunt u deze optie uitschakelen.

Achtergrondkleur van de afgebeelde tafel

Elke prijzentabel kan worden "gepresenteerd". Uitgelichte tabellen worden gemarkeerd in de rij, waardoor ze zich onderscheiden van andere opties. Met deze instelling kunt u de achtergrondkleur alleen voor aanbevolen tabellen wijzigen.

Achtergrondkleur van tabelkop

Boven elke prijstabel bevindt zich een koptekstgedeelte met de titel en ondertitel van uw tafel. U kunt de achtergrondkleur van dit gebied onafhankelijk van de achtergrondkleur van de hoofdtabel bepalen door de gewenste kleur te selecteren in de kleurkiezer.

Aanbevolen tabelkop

Elke prijzentabel kan worden "uitgelicht". Uitgelichte tabellen worden gemarkeerd in de rij, waardoor ze zich onderscheiden van andere opties. Met deze instelling kunt u de achtergrondkleur van de koptekst alleen voor geselecteerde tabellen wijzigen.

Achtergrondkleur

Standaard hebben de prijstabellen een witte achtergrondkleur. Als je een andere kleur wilt gebruiken voor de achtergrond van je prijstabel, kun je hier je eigen kleur instellen met de kleurkiezer.

Admin-label

Hierdoor wordt het modulelabel in de constructor gewijzigd voor gemakkelijke identificatie. Wanneer u de WireFrame-weergave in Visual Builder gebruikt, verschijnen deze labels in het moduleblok van de Divi Builder-interface.

Prijstabel ontwerp opties

Op het tabblad Ontwerpen vindt u alle stijlopties voor de module, zoals lettertypen, kleuren, grootte en spatiëring. Dit is het tabblad dat u gaat gebruiken om het uiterlijk van uw module te wijzigen. Elke Divi-module heeft een lange lijst met ontwerpinstellingen die u kunt gebruiken om alles te wijzigen.

array design option.png

alignement

Functielijsten worden standaard links uitgelijnd in de prijstabel. Als u ze wilt uitlijnen, kunt u deze optie activeren.

Verwijder de slagschaduw van de aanbevolen tafel

Standaard hebben prijstabellen een subtiele schaduw achter elke tabel. Als u deze schaduw wilt verwijderen, kunt u deze optie inschakelen.

Artikelen uit de lijst in het midden

Hier kunt u ervoor kiezen om de items in uw tabel te centreren.

Kleur van de bal

Standaard nemen opsommingstekens in de prijstabellijst de accentkleur van uw thema over. Mocht je een andere kleur willen gebruiken, dan kun je deze hier instellen met de kleurkiezer.

Kleur van de afgebeelde tafel

Als je een andere kleur wilt gebruiken voor de bullets in de prijstabellen, kun je die kleur hier instellen met de kleurkiezer.

Tekstkleur van koptekst in aanbevolen tabel

Deze optie bepaalt de kleur van de tekstkleur van uw tabelkop. Als u de achtergrondkleur van de tabelkop wijzigt, kunt u deze optie ook wijzigen om de leesbaarheid te garanderen.

Header lettertype

U kunt het lettertype van uw koptekst wijzigen door het gewenste lettertype te selecteren in het vervolgkeuzemenu. Divi wordt geleverd met tientallen geweldige lettertypen, mogelijk gemaakt door Google Fonts. Divi gebruikt standaard het Open Sans-lettertype voor alle tekst op uw pagina. U kunt ook de stijl van uw tekst aanpassen met opties voor vet, cursief, hoofdletters en onderstrepen.

Lettergrootte koptekst

Hier kunt u de grootte van uw koptekst aanpassen. U kunt de bereikschuifregelaar slepen om de grootte van uw tekst te vergroten of verkleinen, of u kunt de gewenste waarde voor de tekstgrootte rechtstreeks invoeren in het invoerveld rechts van de schuifregelaar. De invoervelden ondersteunen verschillende maateenheden, wat betekent dat u "px" of "em" kunt invoeren, afhankelijk van uw maatwaarde, om het type eenheid te wijzigen.

Kleur koptekst

Standaard worden alle tekstkleuren op Divi weergegeven in wit of donkergrijs. Als u de kleur van uw koptekst wilt wijzigen, kiest u met deze optie de gewenste kleur uit de kleurkiezer.

Tussenruimte koptekst

Letterafstand is van invloed op de ruimte tussen elke letter. Als u de ruimte tussen elke letter in uw koptekst wilt vergroten, gebruikt u de bereikschuifregelaar om de spatie aan te passen of voert u de gewenste afstand in het invoerveld rechts van de schuifregelaar in. De invoervelden ondersteunen verschillende maateenheden, wat betekent dat u "px" of "em" kunt invoeren, afhankelijk van uw maatwaarde, om het type eenheid te wijzigen.

Hoogte koprij

Rijhoogte is van invloed op de ruimte tussen elke rij van uw koptekst.Als u de ruimte tussen elke rij wilt vergroten, gebruikt u de bereikschuifregelaar om de ruimte aan te passen of voert u de gewenste afstand in het veld in. invoerveld rechts van de cursor. De invoervelden ondersteunen verschillende maateenheden, wat betekent dat u "px" of "em" kunt invoeren, afhankelijk van uw maatwaarde, om het type eenheid te wijzigen.

Kleur van de tekst van de afgebeelde tafel

Dit verandert de kleur van de hoofdtekst voor uw uitgelichte tabel. Als u de achtergrondkleur van uw tabel verandert, moet u deze optie mogelijk wijzigen om de leesbaarheid te garanderen.

Lichaamsdoopvont

U kunt uw hoofdlettertype wijzigen door het gewenste lettertype te selecteren in het vervolgkeuzemenu. Divi wordt geleverd met tientallen geweldige lettertypen, mogelijk gemaakt door Google Fonts. Divi gebruikt standaard het Open Sans-lettertype voor alle tekst op uw pagina. U kunt ook de stijl van uw tekst aanpassen met opties voor vet, cursief, hoofdletters en onderstrepen.

Tekst lettergrootte

Hier kunt u de grootte van uw hoofdtekst aanpassen. U kunt de bereikschuifregelaar slepen om de grootte van uw tekst te vergroten of verkleinen, of u kunt de gewenste waarde voor de tekstgrootte rechtstreeks invoeren in het invoerveld rechts van de schuifregelaar. De invoervelden ondersteunen verschillende maateenheden, wat betekent dat u "px" of "em" kunt invoeren, afhankelijk van uw maatwaarde, om het type eenheid te wijzigen.

Tekstkleur hoofdtekst

Standaard worden alle tekstkleuren op Divi weergegeven in wit of donkergrijs. Als u de kleur van uw tekst wilt wijzigen, kiest u met deze optie de gewenste kleur uit de kleurenkiezer.

Afstand van hoofdletters

Letterafstand is van invloed op de ruimte tussen elke letter. Als u de ruimte tussen elke letter in uw tekst wilt vergroten, gebruikt u de bereikschuifregelaar om de spatie aan te passen of voert u de gewenste afstand in het invoerveld rechts van de schuifregelaar in. De invoervelden ondersteunen verschillende maateenheden, wat betekent dat u "px" of "em" kunt invoeren, afhankelijk van uw maatwaarde, om het type eenheid te wijzigen.

Hoogte van de lichaamslijn

De regelhoogte is van invloed op de ruimte tussen elke regel tekst in uw lichaam.Als u de ruimte tussen elke regel wilt vergroten, gebruikt u de bereikschuifregelaar om de ruimte aan te passen of voert u de gewenste afstand in het invoerveld in rechts van de cursor. De invoervelden ondersteunen verschillende maateenheden, wat betekent dat u "px" of "em" kunt invoeren, afhankelijk van uw maatwaarde, om het type eenheid te wijzigen.

Tekstkleur van de ondertitel van de tabel

Dit verandert de kleur van de ondertiteling voor uw uitgelichte tabel. Als u de achtergrondkleur van uw tabel verandert, moet u deze optie mogelijk wijzigen om de leesbaarheid te garanderen.

Ondertitel lettertype

U kunt het lettertype van uw bijschrifttekst wijzigen door het gewenste lettertype te selecteren in het vervolgkeuzemenu. Divi wordt geleverd met tientallen geweldige lettertypen, mogelijk gemaakt door Google Fonts. Divi gebruikt standaard het Open Sans-lettertype voor alle tekst op uw pagina. U kunt ook de stijl van uw tekst aanpassen met opties voor vet, cursief, hoofdletters en onderstrepen.

Ondertitel of ondertitel lettergrootte

Hier kunt u de grootte van uw subkoptekst aanpassen. U kunt de bereikschuifregelaar slepen om de grootte van uw tekst te vergroten of te verkleinen, of u kunt de gewenste tekstgrootte rechtstreeks invoeren in het invoerveld rechts van de schuifregelaar. De invoervelden ondersteunen verschillende maateenheden, wat betekent dat u "px" of "em" kunt invoeren, afhankelijk van uw maatwaarde, om het eenheidstype te wijzigen.

Tekstkleur van de subtitel

Standaard worden alle tekstkleuren in Divi weergegeven in wit of donkergrijs. Als u de tekstkleur van uw bijschrift wilt wijzigen, kiest u met deze optie de gewenste kleur uit de kleurkiezer.

Spatiëring van ondertitels

Letterafstand is van invloed op de ruimte tussen elke letter. Als u de ruimte tussen elke letter in uw bijschrifttekst wilt vergroten, gebruikt u de bereikschuifregelaar om de spatie aan te passen of voert u de gewenste afstand in het invoerveld rechts van de schuifregelaar in. De invoervelden ondersteunen verschillende maateenheden, wat betekent dat u "px" of "em" kunt invoeren, afhankelijk van uw maatwaarde, om het type eenheid te wijzigen.

Hoogte van de subtitelregel

De regelhoogte is van invloed op de ruimte tussen elke regel van uw bijschrifttekst. Als u de ruimte tussen elke rij wilt vergroten, gebruikt u de bereikschuifregelaar om de ruimte aan te passen of voert u de gewenste afstand in het invoerveld rechts van de schuifregelaar in. De invoervelden ondersteunen verschillende maateenheden, wat betekent dat u "px" of "em" kunt invoeren, afhankelijk van uw maatwaarde, om het type eenheid te wijzigen.

Valuta Valuta en frequentie

U kunt uw valuta-lettertype en frequentietekst wijzigen door het gewenste lettertype te selecteren in het vervolgkeuzemenu. Divi wordt geleverd met tientallen geweldige lettertypen, mogelijk gemaakt door Google Fonts. Divi gebruikt standaard het Open Sans-lettertype voor alle tekst op uw pagina. U kunt ook de stijl van uw tekst aanpassen met opties voor vet, cursief, hoofdletters en onderstrepen.

Valuta Valutagrootte en frequentie

Hier kunt u uw valutagrootte en frequentietekst aanpassen. U kunt de bereikschuifregelaar slepen om de grootte van uw tekst te vergroten of verkleinen, of u kunt de waarde van de gewenste tekstgrootte rechtstreeks invoeren in het invoerveld rechts van de schuifregelaar. De invoervelden ondersteunen verschillende maateenheden, wat betekent dat u "px" of "em" kunt invoeren, afhankelijk van uw maatwaarde, om het type eenheid te wijzigen.

Tekstkleur en frequentie van valuta

Standaard worden alle tekstkleuren in Divi weergegeven in wit of donkergrijs. Als u de kleur van uw valuta- en frequentietekst wilt wijzigen, kiest u met deze optie de gewenste kleur uit de kleurkiezer.

Afstand van letters en valuta's

Letterafstand is van invloed op de ruimte tussen elke letter. Als u de ruimte tussen elke letter in uw valuta- en frequentietekst wilt vergroten, gebruikt u de bereikschuifregelaar om de spatie aan te passen of voert u de gewenste afstand in het invoerveld rechts van de schuifregelaar in. De invoervelden ondersteunen verschillende maateenheden, wat betekent dat u "px" of "em" kunt invoeren, afhankelijk van uw maatwaarde, om het type eenheid te wijzigen.

Regel van frequentievaluta

Regelhoogte is van invloed op de ruimte tussen elke regel van uw valuta en frequentietekst. Als u de ruimte tussen elke regel wilt vergroten, gebruikt u de bereikschuifregelaar om de ruimte aan te passen of voert u de gewenste afstand in het veld in rechts van de cursor. De invoervelden ondersteunen verschillende maateenheden, wat betekent dat u "px" of "em" kunt invoeren, afhankelijk van uw maatwaarde, om het type eenheid te wijzigen.

Aanbevolen kleurprijs

Dit verandert de kleur van de prijzen voor uw uitgelichte tafel. Als u de achtergrondkleur van uw tabel verandert, moet u deze optie mogelijk wijzigen om de leesbaarheid te garanderen.

Prijs politie

U kunt het lettertype van uw prijstekst wijzigen door het gewenste lettertype te selecteren in het vervolgkeuzemenu. Divi wordt geleverd met tientallen geweldige lettertypen, mogelijk gemaakt door Google Fonts. Divi gebruikt standaard het Open Sans-lettertype voor alle tekst op uw pagina. U kunt ook de stijl van uw tekst aanpassen met opties voor vet, cursief, hoofdletters en onderstrepen.

Prijs lettergrootte

Hier kunt u de grootte van uw prijstekst aanpassen. U kunt de bereikschuifregelaar slepen om de grootte van uw tekst te vergroten of verkleinen of rechtstreeks de gewenste waarde voor de tekstgrootte invoeren in het invoerveld rechts van de schuifregelaar. De invoervelden ondersteunen verschillende maateenheden, wat betekent dat u "px" of "em" kunt invoeren, afhankelijk van uw maatwaarde, om het type eenheid te wijzigen.

Prijs tekstkleur

Standaard worden alle tekstkleuren in Divi weergegeven in wit of donkergrijs. Als u de kleur van uw prijstekst wilt wijzigen, kiest u met deze optie de gewenste kleur uit de kleurenkiezer.

Afstand van prijsbrieven

Letterafstand is van invloed op de ruimte tussen elke letter. Als u de ruimte tussen elke letter in uw prijstekst wilt vergroten, gebruikt u de bereikschuifregelaar om de spatie aan te passen of voert u de gewenste afstand in het invoerveld rechts van de schuifregelaar in. De invoervelden ondersteunen verschillende maateenheden, wat betekent dat u "px" of "em" kunt invoeren, afhankelijk van uw maatwaarde, om het type eenheid te wijzigen.

Hoogte van de prijslijn

Rijhoogte is van invloed op de ruimte tussen elke rij van uw prijstekst Als u de ruimte tussen elke rij wilt vergroten, gebruikt u de bereikschuifregelaar om de ruimte aan te passen of voert u de gewenste afstand in het invoerveld in rechts van de cursor. De invoervelden ondersteunen verschillende maateenheden, wat betekent dat u "px" of "em" kunt invoeren, afhankelijk van uw maatwaarde, om het type eenheid te wijzigen.

Gebruik de rand

Als u deze optie inschakelt, wordt er een rand rond uw module geplaatst. Deze rand kan worden aangepast met behulp van de volgende voorwaardelijke parameters.

Kleur van de rand

Deze optie heeft invloed op de kleur van uw rand. Selecteer een aangepaste kleur uit de kleurkiezer om deze op uw rand toe te passen.

Breedte van de rand

Standaard zijn de randen 1 pixel breed. U kunt deze waarde verhogen door de bereikschuifregelaar te slepen of een aangepaste waarde in het invoerveld rechts van de schuifregelaar in te voeren. Aangepaste maateenheden worden ondersteund, wat betekent dat u de standaardeenheid kunt wijzigen van "px" in iets anders zoals em, vh, vw enz.

Randstijl

Randen ondersteunen acht verschillende stijlen: vol, gestippeld, dubbel, groef, ribbel, overlay en start. Selecteer de gewenste stijl in het vervolgkeuzemenu om deze op uw rand toe te passen.

Gebruik aangepaste stijlen voor de knop

Als u deze optie inschakelt, worden verschillende instellingen voor het aanpassen van knoppen weergegeven die u kunt gebruiken om het uiterlijk van de knop van uw module te wijzigen.

Knop tekstgrootte

Deze instelling kan worden gebruikt om de grootte van de tekst in de knop te vergroten of te verkleinen. De knop past zich aan naarmate de tekst groter en kleiner wordt.

Knop tekstkleur

Standaard nemen de knoppen de accentkleur van uw thema aan, zoals gedefinieerd in de Theme Customizer. Met deze optie kunt u een aangepaste tekstkleur toewijzen aan de knop van deze module. Selecteer uw aangepaste kleur met behulp van de kleurkiezer om de knopkleur te wijzigen.

Knop achtergrondkleur

Standaard hebben de knoppen een transparante achtergrondkleur. Dit kan worden gewijzigd door de gewenste achtergrondkleur te selecteren in de kleurenkiezer.

Breedte van de knoprand

Alle Divi-knoppen hebben standaard een rand van 2 px. Met deze instelling kan deze rand worden vergroot of verkleind. Randen kunnen worden verwijderd door de waarde 0 in te voeren.

Knooprandkleur

Standaard nemen knopranden de accentkleur van uw thema over zoals gedefinieerd in de Theme Customizer. Met deze optie kunt u een aangepaste randkleur toewijzen aan de knop van deze module. Selecteer uw aangepaste kleur met behulp van de kleurkiezer om de kleur van de knoprand te wijzigen.

Knoop de randradius

De straal van de rand heeft invloed op de rondheid van de hoeken van uw knoppen. Standaard hebben de knoppen in Divi een kleine randradius die de hoeken met 3 pixels rond maakt. U kunt deze waarde verlagen tot 0 om een ​​vierkante knop te maken of aanzienlijk verhogen om knoppen met ronde randen te maken.

Afstand van de letters van de knop

Letterafstand is van invloed op de ruimte tussen elke letter. Als u de ruimte tussen elke letter in uw knoptekst wilt vergroten, gebruikt u de bereikschuifregelaar om de spatie aan te passen of voert u de gewenste afstand in het invoerveld rechts van de schuifregelaar in. De invoervelden ondersteunen verschillende maateenheden, wat betekent dat u "px" of "em" kunt invoeren, afhankelijk van uw maatwaarde, om het type eenheid te wijzigen.

Boutton politie

U kunt het lettertype van uw knoptekst wijzigen door het gewenste lettertype te selecteren in het vervolgkeuzemenu. Divi wordt geleverd met tientallen geweldige lettertypen, mogelijk gemaakt door Google Fonts. Divi gebruikt standaard het Open Sans-lettertype voor alle tekst op uw pagina. U kunt ook de stijl van uw tekst aanpassen met opties voor vet, cursief, hoofdletters en onderstrepen.

Voeg een knoppictogram toe

Uitgeschakeld, deze instelling verwijdert pictogrammen van uw knop. Standaard geven alle Divi-knoppen een pijlpictogram weer.

Knop pictogram

Als pictogrammen zijn ingeschakeld, kunt u deze instelling gebruiken om te kiezen welk pictogram u in uw knop wilt gebruiken. Divi heeft verschillende pictogrammen om uit te kiezen.

Knop pictogram kleur

Als u deze instelling aanpast, verandert de kleur van het pictogram dat op uw knop verschijnt. Standaard is de kleur van het pictogram hetzelfde als de tekstkleur van uw knop, maar met deze instelling kunt u de kleur onafhankelijk aanpassen.

Knop pictogram plaatsing

U kunt ervoor kiezen om het pictogram van uw knop links of rechts van uw knop weer te geven.

Alleen pictogram weergeven wanneer u over de knop beweegt

Standaard worden knoppictogrammen alleen weergegeven tijdens het zweven. Schakel deze instelling uit als u wilt dat het pictogram altijd wordt weergegeven.

Tekstkleur bij het viaduct van de knop

Wanneer de knop door de muis van een bezoeker wordt bewogen, wordt deze kleur gebruikt. De kleur verandert van de basiskleur die is gedefinieerd in de vorige instellingen.

Knop achter achtergrondkleur

Wanneer de knop door de muis van een bezoeker wordt bewogen, wordt deze kleur gebruikt. De kleur verandert van de basiskleur die is gedefinieerd in de vorige instellingen.

Kleur op de randknop

Wanneer de knop door de muis van een bezoeker wordt bewogen, wordt deze kleur gebruikt. De kleur verandert van de basiskleur die is gedefinieerd in de vorige instellingen.

Knop Randstraal zweven

Wanneer de knop met de muis van een bezoeker wordt bewogen, wordt deze waarde gebruikt. De waarde zal veranderen van de basiswaarde die is gedefinieerd in de vorige instellingen.

Knop voor het markeren van afstanden van notities

Wanneer de knop met de muis van een bezoeker wordt bewogen, wordt deze waarde gebruikt. De waarde zal veranderen van de basiswaarde die is gedefinieerd in de vorige instellingen.

Geavanceerde tariefkaartopties

Op het tabblad Geavanceerd vindt u opties die meer ervaren webontwerpers nuttig kunnen vinden, zoals aangepaste CSS- en HTML-kenmerken. Hier kunt u aangepaste CSS toepassen op elk van de vele elementen van de module. U kunt ook aangepaste CSS-klassen en ID's op de module toepassen, die kunnen worden gebruikt om de module aan te passen in het style.css-bestand van uw child-thema.

geavanceerde opties divi price chart.png

CSS ID

Voer een optionele CSS-ID in om voor deze module te gebruiken. Een ID kan worden gebruikt om een ​​aangepaste CSS-stijl te maken of om naar bepaalde secties van uw pagina te linken.

CSS-klasse

Voer de optionele CSS-klassen in die voor deze module moeten worden gebruikt. Een CSS-klasse kan worden gebruikt om een ​​aangepaste CSS-stijl te maken. U kunt meerdere klassen toevoegen, gescheiden door een spatie. Deze klassen kunnen worden gebruikt in uw Divi-child-thema of in de aangepaste CSS-stylesheet die u aan uw pagina of aan uw website toevoegt met behulp van de Divi-thema-opties of de instellingen op de Divi Builder-pagina.

Aangepaste CSS

Aangepaste CSS kan ook worden toegepast op de module en elk van de interne onderdelen van de module. In de sectie Aangepaste CSS vindt u een tekstveld waar u aangepaste CSS-stijlpagina's rechtstreeks aan elk element kunt toevoegen. CSS-vermeldingen in deze instellingen zijn al verpakt in stijltags. Voer dus gewoon de CSS-regels in, gescheiden door puntkomma's.

zichtbaarheid

Met deze optie kunt u de apparaten bedienen waarop uw module verschijnt. U kunt ervoor kiezen om uw module afzonderlijk op tablets, smartphones of desktops te deactiveren. Dit is handig als u verschillende mods op verschillende apparaten wilt gebruiken, of als u het mobiele ontwerp wilt vereenvoudigen door bepaalde elementen van de pagina te verwijderen.

Inhoudsopties van individuele prijzentabellen

individuele sectie prijs table.png

Titel

De titel die u hier invoegt, wordt gebruikt voor deze (Premium) prijsoptie.

subtitel

De ondertitels die u hier invoegt, verschijnen onder uw titel.

Valuta

Voer hier het symbool van uw gewenste valuta in.

via

Als uw prijs gebaseerd is op een abonnement, voert u hier de abonnementscyclus in (bijvoorbeeld Jaar).

Prijs

Voer hier de productwaarde in.

Knoptekst

Geef hier de tekst van de knop op.

Inhoud

In dit veld kunt u de lijst met functies invoeren die wel of niet bij uw product worden geleverd. Scheid elk lijstitem op een nieuwe regel en begin elke regel met een + of - symbool. A + specificeert een inbegrepen kenmerk, terwijl A - een uitgesloten kenmerk aangeeft.

Knop-URL

Onderaan elke tabel kunt u een Call to Action-knop invoegen door een geldige web-URL in dit veld in te voeren. Laat dit en het
leeg tekstveld voor knoppen als u geen knop in uw prijstabel wilt hebben.

Achtergrondkleur

Definieer een aangepaste achtergrondkleur voor uw module of laat leeg om de standaardkleur te gebruiken.

Ontwerpopties voor individuele prijstabellen

prijs kolom kolom stijl divi.png

Maak deze tabel gekenmerkt

Kies ervoor om deze prijstabel naar voren te schuiven of niet met dit vervolgkeuzemenu. Hierdoor onderscheidt het bord zich van de rest.

Item kleur uitgesloten

Voor items in uw lijst die zijn ingesteld als uitgesloten met het symbool -, kunt u hun kleur aanpassen met deze instelling. U wilt bijvoorbeeld de kleur wijzigen in rood of de ondoorzichtigheid ervan verminderen om visueel aan te geven dat de items zijn uitgesloten van het huidige pakket.

Koptekst lettertype

U kunt het lettertype van uw koptekst wijzigen door het gewenste lettertype te selecteren in het vervolgkeuzemenu. Divi wordt geleverd met tientallen geweldige lettertypen, mogelijk gemaakt door Google Fonts. Divi gebruikt standaard het Open Sans-lettertype voor alle tekst op uw pagina. U kunt ook de stijl van uw tekst aanpassen met opties voor vet, cursief, hoofdletters en onderstrepen.

Lettergrootte koptekst

Hier kunt u de grootte van uw koptekst aanpassen. U kunt de bereikschuifregelaar slepen om de grootte van uw tekst te vergroten of verkleinen, of u kunt de gewenste waarde voor de tekstgrootte rechtstreeks invoeren in het invoerveld rechts van de schuifregelaar. De invoervelden ondersteunen verschillende maateenheden, wat betekent dat u "px" of "em" kunt invoeren, afhankelijk van uw maatwaarde, om het type eenheid te wijzigen.

Kleur koptekst

Standaard worden alle tekstkleuren in Divi weergegeven in wit of donkergrijs. Als u de kleur van uw koptekst wilt wijzigen, kiest u met deze optie de gewenste kleur uit de kleurkiezer.

Tussenruimte koptekst

Letterafstand is van invloed op de ruimte tussen elke letter. Als u de ruimte tussen elke letter in uw koptekst wilt vergroten, gebruikt u de bereikschuifregelaar om de spatie aan te passen of voert u de gewenste afstand in het invoerveld rechts van de schuifregelaar in. De invoervelden ondersteunen verschillende maateenheden, wat betekent dat u "px" of "em" kunt invoeren, afhankelijk van uw maatwaarde, om het type eenheid te wijzigen.

Hoogte koprij

Rijhoogte is van invloed op de ruimte tussen elke rij van uw koptekst.Als u de ruimte tussen elke rij wilt vergroten, gebruikt u de bereikschuifregelaar om de ruimte aan te passen of voert u de gewenste afstand in het veld in. invoerveld rechts van de cursor. De invoervelden ondersteunen verschillende maateenheden, wat betekent dat u "px" of "em" kunt invoeren, afhankelijk van uw maatwaarde, om het type eenheid te wijzigen.

Lichaamsdoopvont

U kunt uw hoofdlettertype wijzigen door het gewenste lettertype te selecteren in het vervolgkeuzemenu. Divi wordt geleverd met tientallen geweldige lettertypen, mogelijk gemaakt door Google Fonts. Divi gebruikt standaard het Open Sans-lettertype voor alle tekst op uw pagina. U kunt ook de stijl van uw tekst aanpassen met opties voor vet, cursief, hoofdletters en onderstrepen.

Tekst lettergrootte

Hier kunt u de grootte van uw hoofdtekst aanpassen. U kunt de bereikschuifregelaar slepen om de grootte van uw tekst te vergroten of verkleinen, of u kunt de gewenste waarde voor de tekstgrootte rechtstreeks invoeren in het invoerveld rechts van de schuifregelaar. De invoervelden ondersteunen verschillende maateenheden, wat betekent dat u "px" of "em" kunt invoeren, afhankelijk van uw maatwaarde, om het type eenheid te wijzigen.

Tekstkleur hoofdtekst

Standaard worden alle tekstkleuren in Divi weergegeven in wit of donkergrijs. Als u de kleur van uw tekst wilt wijzigen, kiest u met deze optie de gewenste kleur uit de kleurenkiezer.

Afstand van hoofdletters

Letterafstand is van invloed op de ruimte tussen elke letter. Als u de ruimte tussen elke letter in uw tekst wilt vergroten, gebruikt u de bereikschuifregelaar om de spatie aan te passen of voert u de gewenste afstand in het invoerveld rechts van de schuifregelaar in. De invoervelden ondersteunen verschillende maateenheden, wat betekent dat u "px" of "em" kunt invoeren, afhankelijk van uw maatwaarde, om het type eenheid te wijzigen.

Hoogte van de lichaamslijn

De regelhoogte is van invloed op de ruimte tussen elke regel tekst in uw lichaam.Als u de ruimte tussen elke regel wilt vergroten, gebruikt u de bereikschuifregelaar om de ruimte aan te passen of voert u de gewenste afstand in het invoerveld in rechts van de cursor. De invoervelden ondersteunen verschillende maateenheden, wat betekent dat u "px" of "em" kunt invoeren, afhankelijk van uw maatwaarde, om het type eenheid te wijzigen.

Ondertitel lettertype

U kunt het lettertype van uw bijschrifttekst wijzigen door het gewenste lettertype te selecteren in het vervolgkeuzemenu. Divi wordt geleverd met tientallen geweldige lettertypen, mogelijk gemaakt door Google Fonts. Divi gebruikt standaard het Open Sans-lettertype voor alle tekst op uw pagina. U kunt ook de stijl van uw tekst aanpassen met opties voor vet, cursief, hoofdletters en onderstrepen.

Ondertitel lettergrootte

Hier kunt u de grootte van uw subkoptekst aanpassen. U kunt de bereikschuifregelaar slepen om de grootte van uw tekst te vergroten of te verkleinen, of u kunt de gewenste tekstgrootte rechtstreeks invoeren in het invoerveld rechts van de schuifregelaar. De invoervelden ondersteunen verschillende maateenheden, wat betekent dat u "px" of "em" kunt invoeren, afhankelijk van uw maatwaarde, om het eenheidstype te wijzigen.

Tekstkleur ondertiteling

Standaard worden alle tekstkleuren in Divi weergegeven in wit of donkergrijs. Als u de tekstkleur van uw bijschrift wilt wijzigen, kiest u met deze optie de gewenste kleur uit de kleurkiezer.

Afstand tussen ondertitel letters

Letterafstand is van invloed op de ruimte tussen elke letter. Als u de ruimte tussen elke letter in uw bijschrifttekst wilt vergroten, gebruikt u de bereikschuifregelaar om de spatie aan te passen of voert u de gewenste afstand in het invoerveld rechts van de schuifregelaar in. De invoervelden ondersteunen verschillende maateenheden, wat betekent dat u "px" of "em" kunt invoeren, afhankelijk van uw maatwaarde, om het type eenheid te wijzigen.

Hoogte van de ondertitelregel

De regelhoogte is van invloed op de ruimte tussen elke regel van uw bijschrifttekst. Als u de ruimte tussen elke rij wilt vergroten, gebruikt u de bereikschuifregelaar om de ruimte aan te passen of voert u de gewenste afstand in het invoerveld rechts van de schuifregelaar in. De invoervelden ondersteunen verschillende maateenheden, wat betekent dat u "px" of "em" kunt invoeren, afhankelijk van uw maatwaarde, om het type eenheid te wijzigen.

Valuta Valuta en frequentie

U kunt uw valuta-lettertype en frequentietekst wijzigen door het gewenste lettertype te selecteren in het vervolgkeuzemenu. Divi wordt geleverd met tientallen geweldige lettertypen, mogelijk gemaakt door Google Fonts. Divi gebruikt standaard het Open Sans-lettertype voor alle tekst op uw pagina. U kunt ook de stijl van uw tekst aanpassen met opties voor vet, cursief, hoofdletters en onderstrepen.

Lettergrootte voor valuta en frequentie

Hier kunt u uw valutagrootte en frequentietekst aanpassen. U kunt de bereikschuifregelaar slepen om de grootte van uw tekst te vergroten of verkleinen, of u kunt de waarde van de gewenste tekstgrootte rechtstreeks invoeren in het invoerveld rechts van de schuifregelaar. De invoervelden ondersteunen verschillende maateenheden, wat betekent dat u "px" of "em" kunt invoeren, afhankelijk van uw maatwaarde, om het type eenheid te wijzigen.

Tekstkleur voor valuta en frequentie

Standaard worden alle tekstkleuren in Divi weergegeven in wit of donkergrijs. Als u de kleur van uw valuta- en frequentietekst wilt wijzigen, kiest u met deze optie de gewenste kleur uit de kleurkiezer.

Afstand van letters en valuta's

Letterafstand is van invloed op de ruimte tussen elke letter. Als u de ruimte tussen elke letter in uw valuta- en frequentietekst wilt vergroten, gebruikt u de bereikschuifregelaar om de spatie aan te passen of voert u de gewenste afstand in het invoerveld rechts van de schuifregelaar in. De invoervelden ondersteunen verschillende maateenheden, wat betekent dat u "px" of "em" kunt invoeren, afhankelijk van uw maatwaarde, om het type eenheid te wijzigen.

Valuta en frequentielijn

De regelhoogte is van invloed op de ruimte tussen elke regel van uw valuta- en frequentietekst. Als u de ruimte tussen elke regel wilt vergroten, gebruikt u de bereikschuifregelaar om de ruimte aan te passen of voert u de gewenste afstand in het veld in rechts van de cursor. De invoervelden ondersteunen verschillende maateenheden, wat betekent dat u "px" of "em" kunt invoeren, afhankelijk van uw maatwaarde, om het eenheidstype te wijzigen.

Prijsbeleid

U kunt het lettertype van uw prijstekst wijzigen door het gewenste lettertype te selecteren in het vervolgkeuzemenu. Divi wordt geleverd met tientallen geweldige lettertypen, mogelijk gemaakt door Google Fonts. Divi gebruikt standaard het Open Sans-lettertype voor alle tekst op uw pagina. U kunt ook de stijl van uw tekst aanpassen met opties voor vet, cursief, hoofdletters en onderstrepen.

Prijs lettergrootte

Hier kunt u de grootte van uw prijstekst aanpassen. U kunt de bereikschuifregelaar slepen om de grootte van uw tekst te vergroten of verkleinen of rechtstreeks de gewenste waarde voor de tekstgrootte invoeren in het invoerveld rechts van de schuifregelaar. De invoervelden ondersteunen verschillende maateenheden, wat betekent dat u "px" of "em" kunt invoeren, afhankelijk van uw maatwaarde, om het type eenheid te wijzigen.

Prijs tekstkleur

Standaard worden alle tekstkleuren in Divi weergegeven in wit of donkergrijs. Als u de kleur van uw prijstekst wilt wijzigen, kiest u met deze optie de gewenste kleur uit de kleurenkiezer.

Afstand van prijsbrieven

Letterafstand is van invloed op de ruimte tussen elke letter. Als u de ruimte tussen elke letter in uw prijstekst wilt vergroten, gebruikt u de bereikschuifregelaar om de spatie aan te passen of voert u de gewenste afstand in het invoerveld rechts van de schuifregelaar in. De invoervelden ondersteunen verschillende maateenheden, wat betekent dat u "px" of "em" kunt invoeren, afhankelijk van uw maatwaarde, om het type eenheid te wijzigen.

Hoogte van de prijslijn

Rijhoogte is van invloed op de ruimte tussen elke rij van uw prijstekst Als u de ruimte tussen elke rij wilt vergroten, gebruikt u de bereikschuifregelaar om de ruimte aan te passen of voert u de gewenste afstand in het invoerveld in rechts van de cursor. De invoervelden ondersteunen verschillende maateenheden, wat betekent dat u "px" of "em" kunt invoeren, afhankelijk van uw maatwaarde, om het type eenheid te wijzigen.

Gebruik aangepaste stijlen voor de knop

Als u deze optie inschakelt, worden verschillende instellingen voor het aanpassen van knoppen weergegeven die u kunt gebruiken om het uiterlijk van de knop van uw module te wijzigen.

Knop tekstgrootte

Deze instelling kan worden gebruikt om de grootte van de tekst in de knop te vergroten of te verkleinen. De knop past zich aan naarmate de tekst groter en kleiner wordt.

Knop tekstkleur

Standaard nemen de knoppen de accentkleur van uw thema aan, zoals gedefinieerd in de Theme Customizer. Met deze optie kunt u een aangepaste tekstkleur toewijzen aan de knop van deze module. Selecteer uw aangepaste kleur met behulp van de kleurkiezer om de knopkleur te wijzigen.

Knop achtergrondkleur

Standaard hebben de knoppen een transparante achtergrondkleur. Dit kan worden gewijzigd door de gewenste achtergrondkleur te selecteren in de kleurenkiezer.

Breedte van de knoprand

Alle Divi-knoppen hebben standaard een rand van 2px. Met deze instelling kan deze rand worden vergroot of verkleind. Randen kunnen worden verwijderd door de waarde 0 in te voeren.

Knooprandkleur

Standaard nemen knopranden de accentkleur van uw thema over zoals gedefinieerd in de Theme Customizer. Met deze optie kunt u een aangepaste randkleur toewijzen aan de knop van deze module. Selecteer uw aangepaste kleur met behulp van de kleurkiezer om de kleur van de knoprand te wijzigen.

Knoop de randradius

De straal van de rand heeft invloed op de rondheid van de hoeken van uw knoppen. Standaard hebben de knoppen in Divi een kleine randradius die de hoeken met 3 pixels rond maakt. U kunt deze waarde verlagen tot 0 om een ​​vierkante knop te maken of aanzienlijk verhogen om knoppen met ronde randen te maken.

Afstand van knopletters

Letterafstand is van invloed op de ruimte tussen elke letter. Als u de ruimte tussen elke letter in uw knoptekst wilt vergroten, gebruikt u de bereikschuifregelaar om de spatie aan te passen of voert u de gewenste afstand in het invoerveld rechts van de schuifregelaar in. De invoervelden ondersteunen verschillende maateenheden, wat betekent dat u "px" of "em" kunt invoeren, afhankelijk van uw maatwaarde, om het type eenheid te wijzigen.

Knop lettertype

U kunt het lettertype van uw knoptekst wijzigen door het gewenste lettertype te selecteren in het vervolgkeuzemenu. Divi wordt geleverd met tientallen geweldige lettertypen, mogelijk gemaakt door Google Fonts. Divi gebruikt standaard het Open Sans-lettertype voor alle tekst op uw pagina. U kunt ook de stijl van uw tekst aanpassen met opties voor vet, cursief, hoofdletters en onderstrepen.

Voeg een pictogram toe aan de knop

Uitgeschakeld, deze instelling verwijdert pictogrammen van uw knop. Standaard geven alle Divi-knoppen een pijlpictogram weer op de muisaanwijzer.

Knop pictogram

Als pictogrammen zijn ingeschakeld, kunt u deze instelling gebruiken om te kiezen welk pictogram u in uw knop wilt gebruiken. Divi heeft verschillende pictogrammen om uit te kiezen.

Knop pictogram kleur

Als u deze instelling aanpast, verandert de kleur van het pictogram dat op uw knop verschijnt. Standaard is de kleur van het pictogram hetzelfde als de tekstkleur van uw knop, maar met deze instelling kunt u de kleur onafhankelijk aanpassen.

Pictogram knop plaatsing

U kunt ervoor kiezen om het pictogram van uw knop links of rechts van uw knop weer te geven.

Alleen pictogram weergeven wanneer u over de knop beweegt

Standaard worden knoppictogrammen alleen weergegeven tijdens het zweven. Schakel deze instelling uit als u wilt dat het pictogram altijd wordt weergegeven.

Tekstkleur bij het viaduct van de knop

Wanneer de knop door de muis van een bezoeker wordt bewogen, wordt deze kleur gebruikt. De kleur verandert van de basiskleur die is gedefinieerd in de vorige instellingen.

Knop achtergrondkleur bij viaduct

Wanneer de knop door de muis van een bezoeker wordt bewogen, wordt deze kleur gebruikt. De kleur verandert van de basiskleur die is gedefinieerd in de vorige instellingen.

Randkleur bij viaduct

Wanneer de knop door de muis van een bezoeker wordt bewogen, wordt deze kleur gebruikt. De kleur verandert van de basiskleur die is gedefinieerd in de vorige instellingen.

Straal van de rand van de knop op overzicht

Wanneer de knop met de muis van een bezoeker wordt bewogen, wordt deze waarde gebruikt. De waarde zal veranderen van de basiswaarde die is gedefinieerd in de vorige instellingen.

Afstand van de letters van de knop op het viaduct

Wanneer de knop met de muis van een bezoeker wordt bewogen, wordt deze waarde gebruikt. De waarde zal veranderen van de basiswaarde die is gedefinieerd in de vorige instellingen.

Individuele prijstabelopties Geavanceerde opties

geavanceerde optie divi.png

Aangepaste CSS

Aangepaste CSS kan ook worden toegepast op de module en elk van de interne onderdelen van de module. In de sectie Aangepaste CSS vindt u een tekstveld waar u aangepaste CSS-stijlpagina's rechtstreeks aan elk element kunt toevoegen. CSS-vermeldingen in deze instellingen zijn al verpakt in stijltags. Voer dus gewoon de CSS-regels in, gescheiden door puntkomma's.

[vc_row center_row = "yes"] [vc_column width = "1/2 ″] [vcex_button target =" blank "layout =" extended "align =" center "font_family =" Raleway "font_weight =" 700 ″ style = "flat" custom_background = "# 18b69d" custom_hover_background = "# 118d7a" custom_color = "#ffffff" custom_hover_color = "#ffffff" icon_right = "fa fa-download"] DOWNLOAD HET DIVI-THEMA [/ vcex_button] [/ width_column] [»]vc_column » 1/2 ″] [vcex_button url = "https://www.elegantthemes.com/affiliates/idevaffiliate.php?id=23065&url=40632&tid1=tutorials" target = "blank" layout = "expanded" align = "center" font_family = "Raleway" font_weight = "700 ″ style =" flat "custom_background =" # c4226e "custom_hover_background =" # 8d184f "custom_color =" #ffffff "custom_hover_color =" #ffffff "icon_right =" fa fa-download "] DOWNLOAD TEMPLATES DIVI [/ vcex_button] [/ vc_column] [/ vc_row]

Andere Divi-zelfstudies