co-offerlist (eenvoudig gebruik)

Carta Online |
View Categories

co-offerlist (eenvoudig gebruik)

12 min read

De shortcode [co-offerlist] toont een standaard lijst (afbeelding, cursusnaam, cursusomschrijving en inschrijfknop) van de eerste 5 cursussen. Hoe de layout van de offerlist aangepast kan worden wordt uitgelegd in de paragraaf template.

co-offerlist genereert standaard een div element met 5 article elementen met de volgende id’s en classes waar een website bouwer met behulp van CSS vorm aan kan geven.

[co-offerlist]
<div class="co-offer-list">
  <article id="co-offer-cl11" class="co-offer-item co-offer-item-cat-reanimatie co-offer-type-classdaughter co-offer-status-finished"> 
     <a href="http://dev81.leadtest.nl/aanbod/cl11/reanimatie/">
        <img src="https://instructie.cartaonline.nl/image/cl11/thumb" alt="thumbnail"> 
        <div class="co-offer-subject">Reanimatie</div>
        <div class="co-offer-description">Reanimatie</div>
        <div class="co-offer-location">Rotterdam Noord</div>
     </a>
     <div class="co-offer-submit">
        <a class="co-offer-register-link" href="https://instructie.cartaonline.nl/aanbod/inschrijven/cl11">Schrijf je in</a>
     </div>
  </article>
  <article>…</article>
  <article>…</article>
  <article>…</article>
  <article>…</article>
</div>

De standaard shortcode offerlist kan gemanipuleerd worden met behulp van de volgende attributen:

max-count
status
location
type
category
field
submit-caption
detail
filter-by-field
url-based-filtering
template
planning-template

 

id

Door een id attribuut te gebruiken wordt in de gegenereerde HTML code een id toegevoegd aan het Div element met de offerlist. Dit id kan door de websitebouwer gebruikt worden om de offerlist met behulp van CSS te stylen.
[co-offerlist id="MijnOfferlistStyle"]

<div id="MijnOfferlistStyle" class="co-offer-list">
    <article id="co-offer-cl11" class="co-offer-item co-offer-item-cat-reanimatie co-offer-type-classdaughter co-offer-status-finished"> 
        <a href="http://dev81.leadtest.nl/aanbod/cl11/reanimatie/">
            <img src="https://instructie.cartaonline.nl/image/cl11/thumb" alt="thumbnail"> 
            <div class="co-offer-subject">Reanimatie</div>
            <div class="co-offer-description">Reanimatie</div>
            <div class="co-offer-location">Rotterdam Noord</div>
        </a>
        <div class="co-offer-submit">
            <a class="co-offer-register-link" href="https://instructie.cartaonline.nl/aanbod/inschrijven/cl11">Schrijf je in</a>
        </div>
    </article>
    <article>…</article>
    <article>…</article>
    <article>…</article>
    <article>…</article>
</div>

max-count

Met behulp van het max-count attribuut kan het aantal cursussen wat getoond wordt gemanipuleerd worden. Met een getal groter dan 0 bepaald het gewenste aantal cursussen wat getoond wordt. Door de waarde 10 te gebruiken worden de eerste 10 cursussen getoond.
[co-offerlist max-count=10]

<div class="co-offer-list">
    <article id="co-offer-cl11" class="co-offer-item co-offer-item-cat-reanimatie co-offer-type-classdaughter co-offer-status-finished"> 
        <a href="http://dev81.leadtest.nl/aanbod/cl11/reanimatie/">
            <img src="https://instructie.cartaonline.nl/image/cl11/thumb" alt="thumbnail"> 
            <div class="co-offer-subject">Reanimatie</div>
            <div class="co-offer-description">Reanimatie</div>
            <div class="co-offer-location">Rotterdam Noord</div>
        </a>
        <div class="co-offer-submit">
            <a class="co-offer-register-link" href="https://instructie.cartaonline.nl/aanbod/inschrijven/cl11">Schrijf je in</a>
        </div>
    </article>
    <article>…</article>
    <article>…</article>
    <article>…</article>
    <article>…</article>
    <article>…</article>
    <article>…</article>
    <article>…</article>
    <article>…</article>
    <article>…</article>
</div>

[co-offerlist max-count=ALL]
Geeft als resultaat alle cursussen.

 

status

Het attribuut status is filter waarmee gefilterd kan worden op bezetting van een cursus en kent de volgende filter mogelijkheden:

canceledDe cursus/leergang is geannuleerd.
finishedDe cursus/leergang is afgelopen.
startedDe cursus/leergang is gestart en loopt nog.
closedEr mag niet op de cursus worden ingeschreven.
almostFullEr zijn nog maximaal 3 plekken over.
fullEr zijn geen plekken meer over.
openEr kan ingeschreven worden op de cursus.

[[co-offerlist max-count=3 status="open"]]
Geeft als resultaat de eerste 3 cursussen die de status open hebben.

[co-offerlist max-count=3 status="almostfull"]
Geeft als resultaat de eerste 3 cursussen die de status almostfull hebben.

Combinaties zijn mogelijk door de statustypes te scheiden met behulp van een puntkomma.
[co-offerlist max-count=3 status="open;almostfull"]
Geeft als resultaat de eerste 3 cursussen die de status open of almostfull hebben.

 

location

Het attribuut location is filter waarmee gefilterd kan worden op de locatie van een cursus

[co-offerlist max-count=10 location="Utrecht"]
Geeft als resultaat de eerste 10 cursussen in de locatie Utrecht.

Combinaties zijn mogelijk door de locaties te scheiden met behulp van een puntkomma.
[co-offerlist max-count=15 location="Utrecht;Rotterdam"]
Geeft als resultaat de eerste 15 cursussen in de locatie Utrecht of Rotterdam.

 

type

Het attribuut type is een filter waarmee gefilterd kan worden op het type cursus en kent de volgende type varianten:

ClassSingleeen op zichzelf staande cursus.
ClassMothereen moeder cursus.
ClassDaughtereen dochter cursus, heeft dus een moeder.
CourseSingleeen leergang. Dit is een verzameling cursussen.

[co-offerlist type=”ClassDaughter”]
Geeft als resultaat de eerste 5 uitvoeringen van een cursus

[co-offerlist type=”ClassSingle;ClassDaughter”]
Geeft 5 cursussen als resultaat waarvan type een op zichzelf staande cursus of een dochter cursus is.

 

category

Het attribuut category is een filter waarmee gefilterd kan worden op het de cursussoort die aan een cursus is gekoppeld in Carta. Door de zoeknaam van de cursussoort in Carta op te geven bij het attribuut category kunt u een het aanbod filteren.

[co-offerlist category=”EHBO”]
Geeft als resutlaat de eerste 5 cursussen waaraan de cursussoort EHBO is gekoppeld.

[co-offerlist category=”EHBO;Reanimatie”]
Geeft als resutlaat de eerste 5 cursussen waaraan de cursussoort EHBO of Reanimatie is gekoppeld.

 

field

Het attribuut field is filter waarmee gefilterd kan worden op vakgebied. Aan een cursus kunnen aan 1 of meerdere vakgebieden gekoppeld worden. Door de zoeknaam van een vakgebied in Carta op te geven bij het attribuut field kunt u een het aanbod filteren.

[co-offerlist field=”Vastgoed”]
Geeft als resultaat de eerste 5 cursussen waaraan het vakgebied Vastgoed is gekoppeld.

[co-offerlist field=”Vastgoed;Bestuursrecht”]
Geeft als resultaat de eerste 5 cursussen waaraan het vakgebied Vastgoed of Bestuursrecht is gekoppeld.

 

submit-caption

De standaard tekst op de knop voor het inschrijven op een cursus is ‘Schrijf je in’. Met behulp van het attribuut submit-caption kan een afwijkende tekst gedefinieerd worden.

[co-offerlist submit-caption =”Inschrijven op deze cursus”]
Geeft als resultaat dat op de inschrijfbutton nu de tekst ”Inschrijven op deze cursus” staat.

 

detail

Naam van de pagina waarop meer details van het aanbod getoond worden. Indien hier een geldige paginanaam ingevoerd wordt, dan wordt de tekst in de widget omgezet naar een hyperlink naar de detailpagina. Op de detailpagina kan dan met de shortcode [co-detail ...] allerlei details van de cursus, zoals de banner, inhoud en leerdoel velden uit de backoffice getoond worden.

[co-offerlist detail=???]

 

filter-by-field

Filter het aanbod op basis van een lijst met vakgebieden. Werkt samen met [co-expertiselist]

 

url-based-filtering

Bij het gebruik van url-based-filtering wordt de naam van de pagina gebruikt om het aanbod te filteren. Als naam van de pagina in WordPress wordt het laatste gedeelte van de URL gebruikt. Er moet dus een pagina in WordPress zijn met dezelfde naam als de cursus. De tekens _ en – worden in het filter omgezet naar spaties. Zo wordt op de pagina https://www.carta.nl/scholing_voor_verschillende_lastechnieken/ het aanbod gefilterd op ‘Scholing voor verschillende lastechnieken’.

Als naar een pagina doorgelinkt moet worden en de pagina bevat bijzondere tekens, bijvoorbeeld “Scholing voor verschillende hobby’s”, dan levert dat een probleem op bij het linken naar de pagina vanwege de bijzondere tekens.
Dit probleem wordt opgelost door in WordPress bij de pagina een “extra veld” van het type “co_search” op te nemen met de waarde scholing_voor_verschillende_hobby_s.
Bijzondere tekens, spaties, punten, komma’s en andere leestekens moet je vervangen door een _.
Url-based-filtering kun je als volgt opnemen in de shortcode van de offerlist:
[co-offerlist type=ClassSingle;ClassDaughter url-based-filtering max-count=999 status="open;almost-full" planning-template="%dateStart%%location%"].

 

template

Met behulp van het attribuut template kan de standaard samenstelling van een offerlist gewijzigd worden.

Er kan een willekeurig aantal aanboditems worden toegevoegd aan het template attribuut. Eventueel kan ook extra tekst worden toegevoegd.

De aanboditems worden elk in een eigen div element geplaatst.

De volgende aanboditems kunnen aan een sjabloon worden toegevoegd

%subject%Het onderwerp van de cursus
%description%De omschrijving van de cursus
%dateStart%De eerst volgende startdatum van de eerst volgende cursusuitvoering
%timeStart%De eerst volgende starttijd van de eerst volgende cursusuitvoering
%dateStartDayNameShort%Toont de afgekorte dagnaam van de aanvangsdatum (zo, ma, di, wo, do, vr of za)
%dateStartDayNameFull%Toont de dagnaam van de aanvangsdatum
(zondag, maandag, dinsdag, woensdag, donderdag, vrijdag of zaterdag)
%dateStartDay%Toont de dag van de aanvangsdatum (Een getal variërend van 1 tot en met 31)
%dateStartMonth%Toont de maand van de aanvangsdatum (Een getal variërend van 1 tot en met 12)
%dateStartYear%Toont alleen het jaar van de aanvangsdatum
%dateEnd%De eerst volgende einddatum van de eerst volgende cursusuitvoering
%timeEnd%De eerst volgende eindtijd van de eerst volgende cursusuitvoering
%times%De eerst volgende start – en de eerst volgende eindtijd van de eerst volgende cursusuitvoering
%location%De locatie van de cursus
%summary%Samenvatting van de cursus
%detailOpen%Begintag voor het openen van de detailpagina
%detailClose%Eindtag voor het openen van de detailpagina
%submit%Inschrijfknop
%identifier%De unieke identifier van de cursus (cl11, cl16, cl21)
%banner%Banner van de cursus
%thumb%Thumbnail van de cursus
%fields%Lijst met vakgebieden
%infolink%Informatie link naar de cursusgegevens
%category%De cursussoort van de cursus
%studyLoadTotal%Het totaalbedrag aan studiebelasting
%studyLoadPerWeek%Het bedrag aan studiebelasting per week
%detail_MainTeacher%Toont de hoofddocent
%detail_Teacherlist%Toont een lijst met de docenten
%detail_ContactDays%Toont het aantal contactdagen
%detail_Price%Toont de prijs
%detail_PriceComponents%Toont de prijs inclusief prijscomponenten
%detail_PriceInfo%Toont prijs informatie
%detail_PriceComponents%Verplichte prijscomponenten (nu inclusief verplichte moduleprijzen en exclusief niet-verplichte moduleprijzen)
%detail_CondComponents%Voorwaardelijke prijscomponenten
%detail_CondModules%Voorwaardelijke moduleprijzen
%detail_TotalPrice%Totaalprijs, inclusief verplichte prijscomponenten, exclusief eventuele (vroegboek)kortingen

[[co-offerlist template="%subject% %dateStart% extra tekst %timeStart%"]]

Geeft als resultaat de eerste 5 cursussen,  alleen het onderwerp, de startdatum, extra tekst en de starttijd worden getoond.

<div class="co-offer-list">
    <article id="co-offer-co1" class="co-offer-item co-offer-item-cat-zelfplanleergang co-offer-type-coursesingle co-offer-status-finished"> 
        <div class="co-offer-subject">Leergang BHV</div> 
        <div class="co-offer-next-start-date">30-06-2016</div> 
        extra tekst
        <div class="co-offer-next-start-time">9.30</div>
    </article>
    <article>…</article> 
    <article>…</article>
    <article>…</article>
    <article>…</article>
</div>

Als het gewenst is  om de extra tekst van opmaak te voorzien kan er ook HTML code gebruikt worden

[[co-offerlist template="%subject% %dateStart% <span class='mijnOpmaak' >extra tekst met opmaak</span> %timeStart%"]]

<div class="co-offer-list"> 
    <article id="co-offer-co1" class="co-offer-item co-offer-item-cat-zelfplanleergang co-offer-type-coursesingle co-offer-status-finished"> 
        <div class="co-offer-subject">Leergang BHV</div>
        <div class="co-offer-next-start-date">30-06-2016</div> 
        <span class="mijnOpmaak">extra tekst met opmaak</span> 
        <div class="co-offer-next-start-time">9.30</div>
    </article>
    <article>…</article>
    <article>…</article>
    <article>…</article>
    <article>…</article>
</div>

Een uitgebreid voorbeeld van co-offerlist:

[[co-offerlist status="open;almostfull;" type="ClassDaughter;ClassSingle" category="Webinars;" max-count="99" template="%thumb%%banner%%subject%%description%%dateStart%%timeStart%%timeEnd%%location%%submit% %planning%" planning-template="%dateStart% %timeStart%-%timeEnd% %location%" ]]

 

auto-class

Met behulp van het attribuut auto-class in de shortcode co-offer-list en het attribuut class=’x’, kan van co-offerlist een planning getoond worden op basis van een geselecteerde moedercursus of basisleergang.

[[co-offerlist id=planning_module auto-class max-count=999 planning-template="<div class='x'>%module%%dateStart%%timeStart%%timeEnd%%location%</div>" type=ClassDaughter]%dateStart%%planning%[/co-offerlist]

<div id="co-offer-planning-data-cl1362" class="co-offer-planning-data" style=""> 
  <span class="co-offer-planning-start-date">November 30, 2023</span>
  <span class="co-offer-planning-location">Toegang tot Carta Online Kennisinstituut Online</span>
  <span class="co-offer-planning-start-date">December 8, 2023</span>
  <span class="co-offer-planning-location">Carta Online, Orteliuslaan 850 Utrecht</span>
  <span class="co-offer-planning-module">Module 1</span>
  <span class="co-offer-planning-start-date">December 9, 2023</span>
  <span class="co-offer-planning-location">Carta Online, Orteliuslaan 850 Utrecht</span>
  <span class="co-offer-planning-module">Module 2</span>
  ...
</div>

 

price-component-template:

%text%omschrijving
%money%bedrag
%prefix%‘before’ (of vertaald: ‘voor’).
%validTill%‘einddatum geldigheid prijscomponent’

Meer informatie?

Ja, ik wil graag meer informatie over Carta Online. Neem contact met mij op.


      Bel mij terug