TLDR; Dit is de Website functie waarmee je online met een (evt drop drag) editor, een volledige html site kan aanmaken. Voor startinstructie: lees Soverin-site setup
De website kan een HTML only pagina - zoals bij xs4all - zijn.
Veel leuker is gebruik te gaan maken van de aanvullende Markdown opmaak, Jekyll proces en Liquid programmering om zo website/pagina inhoud (op) te maken. Een beetje, maar dan statisch, zoals iemand bv een wordpress site vult.
De website functie een zg statisch CMS waarmee je binnenin je eigen domein, via (CNAME’d) hostnaam, via een online webeditor sessie een zelfstandige site kunt maken. Er is dus geen SFTP. Om eerlijk te zijn, eenmaal gewend en bekend, is dat ook niet nodig. De online editor is en werkt erg prettig, helpt met syntax en je kunt zelfs online - eenmaal ge-upload - je plaatjes bewerken.
Update: (S)FTP kan overigens wel wenselijk zijn om geautomatiseerd databestanden te kunnen uitwisselen.
Freedom levert 3 startvoorbeelden waarmee je een website kan aanmaken:
Samenvatting site typen
- Een start-raamwerk t.w. Create a new site waarmee je Markdown en/of elementaire HTML website maakt. Die site kan je dan geavanceer uitbouwen tot:
- Een wat complexere Create from template dat een gelikt responsief portfolio bootstrap raamwerk biedt.
- Een ‘Create’ from redirect-url route herroutering voorbeeld (jouw cname’d host kan/gaat dan) naar een andere url verwijzen.
Dit wordt inhoudelijk ingesteld met een index.link bestand te bewerken waarin dan de eind URL komt te staan).
Update herrrouteren kan natuurlijk ook onder invloed van platte HTML code.
- Upload (via drop/drag import) waarop iemand een zipbestand kan laten landen met daarin alles wat nodig is voor een bedoeld website resulaat zoals 1,2 of 3.
…NB: Deze laatste optie is waar je dan lokaal een site (hebt opge)maakt waarin alles staat dat nodig is voor een gewenste (1,2,3) website, inclusief dus het zg YAML configuratie bestand dat op jouw hostnaam en qua Jekyll frontend instellingen. is afgestemd.
*Voor alle duidelijkheid; itt tot bv xs4all, kan iemand meerdere en sws los van elkaar staande websites maken. Bv één site die doorverwijst, eentje met een andere layout om bv gescript foto’s te vertonen en/of een ander statisch datadoel dient. Denk aan programmatisch verwerken van bv CSV, XML of JSON inhoud. Functioneel kan een website voorzien worde van geavanceerde CSS met of desgewenst scripts van derden staan die door/bij een gebruiker wordt uitgevoerd.
Natuurlijk kan e.e.a. binnenin één website-hostnaam gebeuren door, zoals destijds bij xs4all, zelf via subfolders dan meerdere subsites op te bergen.
NB: bedenk ook dat wat voor een platte website logisch leek om te doen, dit voor een Jekyll website onnodig is omdat daarvoor expliciete functies zijn die centrale herhaling uit handen neemt. Denk aan gebruik van bv centrale/eigen variabelen die op en/of per pagina gebruikt kunnen worden.
Wat heb je nodig of moet je doen:
- Login, ga naar–> Mijn Freedom → Domeinen → jouwdomein.nl → DNS-Instellingen:
1.1. Maak/kies.activeer een CNAME via DNS instellingen die verwijst naar ‘@’ (dat dan vanzelf verwijst naar het fysieke ip-adres waarop Freedom initieel jouw domein heeft geparkeerd.
1.2 activeer deze wijziging (knop [Opslaan] bovenaan).
1.3 wacht totdat je een groen balk bericht krijgt dat de boel is opgeslagen. Onthou dat doorvoeren van DNS wijzigingen op Interrnet wat tijd kan nemen.
- Maak/creëer een website (via menu links) , idem als 1. maar kies voor Website van jouw domein.
- Kies één van de raamwerk icons onder ’ Voeg een nieuwe website toe’, dwz klik op Create a new site .
NB: ik raad aan stapsgewijs en basaal te beginnen met dit startraamwerk en de mooie gelikte fancy websites - die iedereen graag wil - pas te doen als je het proces in de vingers hebt.
NB: het lastige is dat er geen feedback noch foutlog is voor fouten en je dan zelf moet deduceren wat dit veroorzaakt heeft.
- Je krijgt nu de Online-Webeditor te zien met links het het Freedom menu, midden-links een folder/verkenner/navigatielijst en rechts het online edit gedeelte (helaas nog niet lekker responsief).
→ Door drop/drag kan je ook externe bestanden - denk aan plaatjes of ander binaire bestanden - copy/pasten op de root/folders van de navigatie. Doe dit drop/paste pas later wanneer je wat vertrouwd bent met hoe de online-editor werkt. Door klikken en vasthouden kan je bestanden in/uit/naar folders verplaatsen. met dubbelklik kan de naam worden gewijzigd.
- Klik/Edit allereersrt (en altijd) eerst het ‘_config.yml’ bestand waarin minimaal de volgende regels moeten (gaan) staan:
title: titelnaam
host: hostnaam.jouwdomein.nl
- 'title: ‘titelnaam’ is de leesbare naam die wordt gekoppeld met de plek waar de (root)folder en bestanden van de webeditorsessie intern worden opgeslagen. Onderwater heeft is dit een UUID stringnaam (bv 1448bf2-7221-8a49-b146-7ad0767da797) dat je verder kunt vergeten. Waar je invoer van je site precies staat - als root-folder - is immers van geen belang. Als link is het wel handig om zo direct weer in de editor sessie van de website te komen. Eventueel zul je daarvoor - opnieuw - moeten aanloggen.
- ‘host: hostnaam.jouwdomein.nl’ die als onderdeel van jouwdomein.nl de de volledige domein URL benoemd waarom de inhoud van jouw webeditor sessie dan gaat reageren. Deze (jhost)naam moet gelijk aan die je hebt aangemaakt via CNAME voor jouw domein.
- Editeer nu ook het ‘index.md’ bestand en zet daarin - achter de tweede ‘- - -’ iets van HTML of een regel zoals 'Hello world '. Dit markdown bestand wordt later omgezet naar extensie ‘.html’. Natuurlijk kun een op zichzelfstaande ‘index.html’ maken en die voorzien van alle body/header opsmuk die dan de voorkeur krijgt en je dan alle mooie opties van markdown en standaard layout opmaak gaat missen.
Het index.md bestand bevat bovenin, tussen twee '- - - ’ regels, met wat we ‘frontend matter’ noemen, de website-server van Freedom vertelt hoe de inhoud van dit index.md tekst bestand via welke layout template
- - -
layout: default
- - -
(die staat in folder _layouts) moet gaan resulteren naar een ‘index.html’ versie.
- De wijzigingen sla je vervolgens op door (in de navigaie links/midden) op het ontstane floppy icoon te klikken. het icoon verschijnt wanneer een bestand in de online webeditor wordt aangemaakt of gewijzigd; en nog niet is opgeslagen (en daarmee deel uitmaakt van jouw website).
- Ter info. Onderwater zal bij het opslaan, bij Freedom/soverin een parallel proces gestart worden. De allereerste keer zal voor een nieuwe site ook een SSL certificaat worden gekoppeld (tbv https toegang). Elke keer dat latyer een .html/.md bestand (opnieuw) wordt opgeslagen, zal dit resulteren - wederom onder water - in de (her)generatie van de veranderde webpagina’s.
Belangrijk is te weten dat de aanmaak en uitvoerconversie naar html van een website soms wat tijd kan nemen
en incidenteeldoor systeemproblemen totaal stuk kan lopen. Dat er dan geen verwacht resultaat zichtbaar, komt meestal omdat je zelf (meestal) iets verkeerd deed of gebruik maakt van een functie of (configuratie parameter zoasl jekyll Collections of bepaalde) Plugins die niet beschikbaar zijn. Meestal zaken die betrekking hebben om onder invleod van de website, lokale betanden te wijzigen.
Er is geen directe foutdiagnose. Maakt dus, je site in kleine stapjes zodat je ziet/weer wanneer die niet meer werkt.
In mijn sites gebruik ik op pagina’s ergens de Jekyll '{{ site.time }}" variabele die in tekst dan exacte het aanmaaktijdstip van de html-pagina zal bevatten.
Bij systeem/server fouten, blijft de oorpronkelijke website - als afgeleide - gewoon aanwezig maar je mogelijk de bron daarvan niet meer bewerken.
In mijn ervaring wordt opgelost door bij Freedom, de zooi een schop te laten geven. Ik vermoed dat dan een vastgelopen proces moet worden geherstart.
Op rustige tijdstippen is een website wijziging meestal binnen 1 à 2 seconden wel actief geworden.
Bedenk dat je bij elke opslag dit regeneratie proces kan starten start en dus de servers (extra) belast die jouw site moeten genereren. De inhoud die je bewerkt vormt feitelijk de geprogrameerde input voor/van/tot dat website resultaat. Het reultaat is dus niet dezelfde data maar wordt apart aangemaakt op grond van jouw data.
Zelf druk ik pas op bewaren wanneer ik echt klaar ben met veranderen van mijn website, ook om zo de servers niet te veel te belasten. In veel gevallen werk ik vaak lokaal met mijn favoriete editors en gebruik dan copy/paste om de tekst naar/in de online editor te plaatsen.
Ik kan inmiddels (wat) meer vertellen over Markdown, Jekyll en de programmering via Liquid. De instructie die staat bij Soverin is mogelijk nuttiger als eigen leercurve en voor sommigen beter als startpunt te volgen dan mijn wij(d)sdraadje hier.
De weblinks in deze post, geven wellicht ook extra aangrijppunten. Wie verder gewend is aan GitHub/pages zal t.a.v Markdown, weinig tot geen problemen ervaren om een opgemaakte site te kunnen fabrieken.
Suc6… het is toch weer een heel verhaal geworden .
Opmerking
NB: deze lange post ook als startpunt voor eventueel verdere discussie.
Ik heb/had ooit voor ogen gehad om een handleiding/cursus te schrijven maar verzandde al gauw in en voor mijn eigen doel te onthouden wat ik leer(de).
Beter is dat we elkaar helpen en (be)vragen zodat we gerichter ons website doelen kunnen bespreken.
Update: 12jun22 21u10, wat teksttypo’s eruit gehaald en wat zinnen herschikt.
De website wereld van Freedom is echt eindeloos verder qua mogelijkheden.