DO NOT MISS OUT! AMAZING THINGS ARE COMING!

Nieuw bij Kajabi?

HOME


BLOG

AANBOD


VIDEO'S

SUPPORT


TOOLS

VACATURES


ENGLISH

LINKTOPAY


LEDEN

 

Custom code en html op je Kajabi website

kajabi custom code kajabi html kajabi tips

Kajabi is een pakket waarbij je out of the box je hele website kan maken. Voor de meeste gebruikers is dat meer dan genoeg. Je kan prachtige website bouwen in Kajabi met de kant en klare website thema’s of landingspagina’s. Met het laatste template Encore kun je ieder tekstblokje, afbeelding, fomulier helemaal vormgeven naar jouw eigen wensen.

Om een aantal voorbeelden te bekijken wat zoal met Kajabi mogelijk is, zie de website die wij recentelijk hebben opgeleverd. Deze zijn op 1 enkele na, allemaal gebouwd zonder extra codering, custom code of html aan de achterkant.

 

Kajabi HTML Fine tunen

Het kan altijd dat de standaard mogelijkheden niet voldoende zijn en dat het nodig is om de html code van je Kajabi website aan te passen. Ook die mogelijkheid bestaat. En zelfs daar bestaan verschillende opties voor. Je kan met enkele klikken al jouw eigen javascript of css code toevoegen. En als je echt dieper wilt, dan kun je de pagina’s helemaal op html basis opbouwen. Voor dat laatste heb je het grootste pakket van Kajabi nodig (Pro of Access).

Wij zitten vaak aan de html kant van Kajabi te werken, omdat we graag nieuwe features toevoegen, of omdat we onze eigen templates willen maken, zoals bijvoorbeeld het volledig geupgrade gamification product template Gamify. Dat laatste heeft vele toevoegingen zoals badges en certificaten, en omdat makkelijk te maken voor de gebruiker (lees: jij) programmeren we dat aan de achterkant.

Mocht je tegen zeer technische vraagstukken aanlopen, zoals op maat gemaakte template of aanpassingen die niet mogelijk zijn met de standaard templates, daag ons dan maar uit. Ons motto is: ‘Als een ander zegt dat het niet kan in Kajabi, daar begint bi ons de uitdaging. Meer weten over maatwerk? Neem even vrijblijvend contact met ons op.

In deze blog nemen je mee door de verschillende mogelijkheden om de html code van Kajabi aan te passen. Dit kan op de volgende niveau’s:

  1. In de html head gedeelte op alle pagina’s
  2. Met javascript of css op een individuele pagina
  3. Met custom code blokken op een website voor html en javascript.
  4. Als html code onder teksten of blogs
  5. Aan de achterkant van je templates via Code editing

In de video laat ik je zien hoe je een aantal manieren deze custom code op verschillende plaatsen binnen Kajabi kan gebruiken. Inmiddels zijn er nieuwe mogelijkheden, die we in de tekst hieronder verder toelichten.

 

1.    In de HTML head gedeelte van Kajabi

Externe tools zoals Google Analytics, Facebook, AddThis vragen je vaak om een stukje html of javascript te embedden op je website, zodat zij de activiteiten op je website kunnen volgen. Dit stukje code moet daarvoor op elke plaats komen. Kajabi biedt de mogelijkheid om dat direct op alle pagina’s te plaatsen.

Je kan deze code plaatsen door te gaan naar:
Kajabi > Settings > Site Details > Page Scripts

Door op het kleine vierkante te klikken rechtsonder, kun je het editor venster groter maken. Plak je nieuwe code direct onder de laatste code in dit gedeelte. Deze html of javascript code zal nu op alle pagina’s verschijnen in de head sectie van je pagina.

 

2.    Plaats javascript of css op een individuele Kajabi pagina

 

Wanneer je code op een individuele pagina wilt plakken en niet op alle pagina’s, dan biedt Kajabi sinds hun Encore template de mogelijkheid om javascript of css code direct op die pagina te plakken. Ga daarvoor naar:
Kajabi > Website > Design of Pages > Customize > Settings > Custom Code

Er zit een kleine technische lastigheid in deze code blokken. Kajabi zet al direct de opening- en sluiting tags <style></style> en <script></script> neer. Deze komen niet in beeld, en dat staat ook niet aangegeven. Wanneer je deze optie gebruikt, let erop dat je deze tags dan verwijdert, voor je de code plakt.

Een tweede lastigheid is als je van een externe partij en stukje javascript krijgt, waarbij je de tags niet kan verwijderen. Dat los je op door de script tags omgekeerd om jouw code te zetten. Dat werkt als volgt, let op de plaats van de slash /!
</script>JOUWCODE INCLUSIEF SCRIPT TAGS<script>

 

3.    Custom code blokken op een website voor html en javascript.

Sinds de Encore templates kun je op alle website pagina’s en landingspagina’s custom code blokken gebruiken. Deze blokken kun je overal inzetten en lenen zich ook op ter plaatste op je website wat extra html code te injecteren.

Een custom code blok in Kajabi kan alle code bevatten, mits in html geschreven. Binnen deze html code kun je dus ook javascript of css code opnemen. Wanneer je en bijzonder layout wilt hebben binnen jouw Kajabi pagina, dan heb je met het custom code block 100% vrijheid in programmeren.

Om custom code blokken voor html te gebruiken, ga je naar:
Kajabi > Website > Design of Pages > Customize > Kies een section > Add Block > Custom Code

 

4.    Als html code onder teksten of blogs in Kajabi

Soms wil je heel lokaal iets aanpassen in de html code, bijvoorbeeld omdat je de look en feel van een bepaald woord wilt aanpassen, bijvoorbeeld door een css class toe te voegen, het lettertype grootte aan te passen, of een kleurverloop te maken.

Binnen de meeste tekstblokken in Kajabi, kun je deze code toevoegen. Daarvoor klik je in de editor van dat betreffende tekstblok op het icoontje met <>. Dit kleine tekentje opent de html code van dat betreffende tekstblok (denk aan het onderwaterscherm van het geweldige WordPerfect 5.1, yep zo oud ben ik…) In dit scherm kun je alles weer helemaal naar je eigen hand zetten.

Om html op tekst block niveau aan te passen, ga je naar:
Kajabi > Website > Design of Pages > Customize > Kies en tekst blok> Klik op <> icoontje

 

5.    HTML code aan de achterkant van je templates via Code editing

De meest diepe plek waar je de html code binnen Kajabi kan aanpassen, is op het template niveau zelf. Hiervoor heb je het Pro pakket of Access pakket van Kajabi nodig. Dit biedt mogelijkheden waarmee je over de pagina’s heen aanpassingen kan maken, zoals het kopieren van bepaalde gedeeltes van de ene pagina naar een andere. Of het upgraden van een oude pagina naar het nieuwste template. Het integraal plaatsen van jouw eigen custom fonts. Of om hele nieuwe onderdelen te bouwen zoals wij hebben gedaan met ons Gamification template.

Voor de meeste ondernemers kom je hier op het gebied van abacadabra. En dit is het gebied waar wij ons graag uitleven. Wanneer je echt complexer vragen hebt, dan moet je zeker even contact opnemen, want wij zijn er van overtuigd dat er een oplossing te vinden is.

En natuurlijk staan we ook voor je klaar voor alle andere vragen over Kajabi. Neem vrijblijvend contact met ons op.

 

Conclusie html met Kajabi

Er zijn vele mogelijkheden om Kajabi helemaal naar je eigen hand te zetten. Je weet nu hoe je zelf die extra html of javascript kun plaatsen op je website. En wanneer het echt lastig wordt, dan kunnen wij he helpen om op maat gemaakte toepassingen toe te voegen binnen jouw Kajabi website. Neem contact op.

Wil je met Kajabi aan de slag, meldt je aan voor de 30 dagen gratis try-out en krijg bovendien onze extra trainingen en ondersteuning gratis. Aanmelden Kajabi

Veel succes, Bastiaan

Bastiaan de Koning - Online Cursus & Kajabi Specialist

Sinds 2014 gespecialiseerd in het bouwen en verkopen van online cursussen en leeromgevingen. Kajabi Users NL is mijn site voor de ondersteuning van Kajabi gebruikers. Opgericht in overleg met Kajabi zelf. Heb je vragen over Kajabi of Linktopay? Stuur ons een berichtje.

Contact