Wordpress ISA verslag Joris Talmon
Inhoud Inleiding Pagina 3 Mijn opdracht Pagina 4 Werkwijze Pagina 5 Een website bouwen Pagina 6 Plug-ins 7 Webshop 8 Een kind van 70 Pagina 10 De website 11 Mijn portfolio Pagina 12 De website 13 MaCloud Pagina 14 De website 15 Conclusie Pagina 16 Tijdverantwoording Pagina 17 2
Inleiding Elke dag worden er duizenden websites gemaakt, en een zesde van die websites is gemaakt met Wordpress. Dit maakt Wordpress de grootste en meest gebruikte tool om websites te maken. Het is dus erg verstandig om jezelf in te verdiepen, en een klein deel van die miljoenen websites op jouw naam te kunnen hebben. Dat was dan ook precies mijn idee, en daarom ben ik begonnen met het maken van 3 websites voor mijn ISA. Elk van deze websites heeft een ander doel, en een eigen element dat zich onderscheidt van de ander. 3
Mijn opdracht Ik heb de opdracht gekregen om 2 websites te maken, en zelf besloten om een kleine website voor mezelf te maken. De eerste website is voor de kunstenaar Wouter Stips. Hij heeft een documentaire laten maken door Talmon Online storytelling, alleen was het nog nodig om dit project te financiëren. Deze website was daarom initieel gericht op crowdfunding. Daarna is de site een ruimte geworden om online de film te bekijken, met nog wat extra informatie over het project. Naast het bouwen van deze site ben ik ook mee gegaan naar een aantal draaidagen. De tweede site die ik in opdracht maak is een website voor de galerie MaCLOUD. Zij willen op deze site informatie geven over de exposities die hier zijn en een webshop. Voor de webshop moet ik ook voor foto s van de artikelen zorgen. En de derde website die ik bouw is een kleine blog/portfolio waar ik al mijn werk op kan posten. Hier kan je volgen wat ik doe op school of wat ik voor mijzelf doe. 4
Werkwijze Wordpress is voor mij een hele nieuwe tool en ik heb hier nog geen enkele ervaring mee. Ik zal dus veel zelfstudie moeten doen, en hulp vragen aan anderen. Ook heb ik een boek gekocht wat je op weg helpt met websites maken. Overal waar internet is heb ik de mogelijkheid om met Wordpress te werken, zelfs wanneer ik niet mijn eigen laptop bij me heb. Wordpress is namelijk via internet te bereiken en je hebt geen FTP programma of HTML en CSS documenten nodig. Als werkruimte zal ik echter wel vaak gebruik maken van de zaak van mijn ouders, daar is een goede werksfeer en er is altijd hulp als ik er zelf niet uit kom. Daarnaast zijn 2 van de sites ook voor dit bedrijf gemaakt, en kunnen we dus goed samenwerken om de inhoud van de websites te schrijven. 5
Een website bouwen Het eerste wat er moet gebeuren bij het bouwen van een site is het opzetten van een URL en het installeren van Wordpress op die URL. De eerste keer heb ik dit gedaan met hulp van een stagiaire bij het bedrijf van mijn ouders, toen heb ik een klein documentje gemaakt hoe je dit moet doen. Zo kon ik later zelf mijn sites online krijgen. Voor de mensen bij Talmon, die geen ervaring hebben met Wordpress, is het ook handig om dit bestand gebruiken om zelf een website online te zetten. Je moet een lege pagina aanmaken die je instelt als voorpagina, daarna voeg je hier al je nieuwe inhoud en parallaxen toe om zo een mooie one page design pagina te krijgen. Bij elk thema zijn er andere manieren om de pagina s te vullen, je kan dit vinden in de documentatie die je (als het goed is) bij het thema download. Voor Jarvis kan je dit vinden op http://helpsite. rocknrolladesigns.com/jarvis/. Nadat Wordpress is geïnstalleerd op de site is het mogelijk om een thema uit te kiezen en deze in te vullen met je eigen inhoud, je eigen stijl, plug-ins toe te voegen voor nieuwe functies en als je zelf kan programmeren nog meer unieke features ter maken. Voor het thema Jarvis moet je echter nog wat extra stappen ondernemen. 6
Plug-ins Met plug-ins kun je je hele website extra aanpassen, en meer mogelijkheden krijgen. Er zijn plug-ins voor het bijhouden van statestieken/informatie, om sliders toe te voegen, om mails rond te sturen naar al je leden, of om een webshop te bouwen en nog veel meer. Ik heb zelf een webshop gemaakt voor de MaCloud site. 7
Webshop Voor het bouwen van een webshop binnen Wordpress is er een hele handige (gratis) plug-in genaamd WooCommerce. Deze plug-in regelt bijna alles om super snel je eigen webshop te maken. Bij het maken van een WooCommerce site zijn er jammer genoeg alleen een stuk minder thema s. Voor het kiezen van je thema moet je nu rekening houden of de pagina WooCommerce ready is. Hierdoor zijn er een stuk minder keuzes en ben je iets minder vrij in het maken van je website. Ik heb zelf gekozen om mijn webshop in Jarvis te houden, hierdoor wordt alles alleen net ietsjes minder handig, maar het ziet er uiteindelijk wel goed uit. Bij het bouwen van je webshop zijn er een paar stappen die je moet voltooien. Stap 1 De eerste stap is om de vereiste WooCommerce pagina s aan te maken. Dit zijn: - Een pagina met je producten o Op deze pagina worden al je producten getoond, en mogelijk ook de categorieën van je producten. - Een pagina voor de winkelwagen o Hier zie je alle producten die je aan je winkelwagentje hebt toegevoegd, je kan ze hier ook uit je winkelwagentje halen, of juist je bestelling afronden o Shortcode om deze pagina te laten functioneren: [woocommerce_cart] - Een pagina om je bestelling af te ronden o Op deze pagina kun je je adres gegevens invullen, en je betaling maken. o Shortcode om deze pagina te laten functioneren: [woocommerce_checkout] 8
- (optioneel) Een pagina om je account te bekijken o Op deze pagina kan je je accountgegevens opslaan zodat je makkelijker een bestelling kan maken, ook kan deze pagina je doorverwijzen naar de track product pagina o Shortcode om deze pagina te laten functioneren: [woocommerce_my_account] - (Optioneel) Een pagina om je product levering te zien o Hier kan je zien in welk leverings stadium je product zich bevindt. o Shortcode om deze pagina te laten functioneren: [woocommerce_order_tracking] - (optioneel) Een pagina met de algemene voorwaarden Stap 2 De tweede stap is om al je producten en categorieën toe te voegen. Voor elk nieuw product heb je een foto nodig, en de prijs. Ook kan je een beschrijving toe voegen voor het product. Je kan bijhouden hoe veel voorraad je van het product hebt en hoe het verzonden mag worden. Daarnaast moet je de categorieën van je producten toevoegen. Hiermee kan je producten sorteren en makkelijker vindbaar maken voor je klanten. Het enige vereisde aan een categorie is een naam, daarnaast kan je ook een beschrijving toevoegen en een kleine foto. Stap 3 De derde stap bestaat uit de kleine aanpassingen en WooCommerce Plug-ins. De opties die niet verplicht meer zijn, maar om er net even iets anders van te maken, waar je klanten meer aan hebben. Je kan bijvoorbeeld een sidebar toevoegen aan je product pagina waar je filters en categorieën kan toevoegen. Je kan besluiten om andere betaal mogelijkheden toe te voegen, zoals IDeal. En zo kan je zelf nog door alle instellingen zoeken om dingen te vinden die je misschien anders wilt. Weinig van de plug-ins zijn gratis en zo kan je toch wel redelijk wat geld spenderen aan je site, momenteel heb ik zelf nog geen plug-ins toe gevoegd, maar de optie om meer betaalmogelijkheden te hebben is wel belangrijk om het bestellen gemakkelijker te maken. Ook voor WooCommerce kan je veel hulp hebben aan de documentatie, die is te vinden op: http:// docs.woothemes.com/documentation/plugins/woocommerce/ 9
Een kind van 70 http://www.kindvan70.nl Een kind van 70 is de nieuwe expositie van de kunstenaar Wouter Stips. Wouter Stips is een Kunstenaar uit Hilversum die al zijn hele leven met creativiteit bezig is. Hij is afgestudeerd aan de Willem de Kooning academie. Daarna heeft hij veel gedaan met toegepaste kunst en film. Wouter Stips is begonnen met kunstschilderen in 1996. Zijn werk heeft veel raakvlakken met de CoBrA stroming, het is expressionistische kunst, met veel fel kleurgebruik en kinderlijke tekeningen. Daarnaast doet Wouter Stips ook aan beeldhouwen. Hij kan zijn schilderstijl bijna identiek terugbrengen in de beelden die hij maakt en laat maken. In 2014 is Wouter Stips 70 jaar geworden en hangt hij met de expositie in het Singer museum in laren. Hier hangt zijn kunst uit een groot deel van zijn tijd als kunstenaar. Maar ook veel nieuwe werken die voor deze expositie zijn gemaakt. Tijdens het maken van deze werken zijn er filmopnames geweest in zijn studio, tijdens live painting concerten en tijdens het glasblazen in Murano, in Venetië. 10
De website De website voor een kind van 70 was de eerste website die ik heb gemaakt, ik ben hiermee begonnen in april 2013. Hier kwam dan ook de meeste zelfstudie en hulp bij kijken. Met de mensen van Talmon online storytelling hebben we overlegd wat voor een site het moet worden, en wat de inhoud moet zijn. Dit kwam uiteindelijk terecht bij het thema Jarvis. Een one page design. Dit houdt in dat alles op de voorpagina staat, het enige wat je hoeft te doen is scrollen. Wat deze site mooi maakt dat tussen elk stuk inhoud een parallax kan worden gezet. Dit is een achtergrond die op een andere snelheid scrolt dan de inhoud, dit geeft een heel mooi verfrissend effect. Na 2 maanden was de crowdfunding actie voorbij, en was er nog niet genoeg opgehaald. Daarom heeft de site wat extra informatie gekregen over het project en een teaser voor de film. Ook heeft de site zelf een paar kleine aanpassingen gekregen, zoals het veranderen van een paar kleuren en parallaxen. De film is uiteindelijk gemaakt met hulp van een paar grotere sponsors. Hierna is de site aangepast voor de expositie in het Singer Laren, en nu staat de film er op. De expositie was tot en met 23 november 2014 in het Singer museum. De inhoud van de website was er om mensen geld te laten doneren zodat de film een kind van 70 kon worden gefinancierd. Deze inhoud is de informatie over de film, over wouter zelf, over de expositie en de mogelijkheid om leuke voorwerpen of zelfs schilderijen te krijgen bij bepaalde bedragen die je kon doneren. Op de site moest ook komen te staan wat het doel was van de crowdfunding en hoeveel er al was opgehaald. 11
Mijn portfolio http://www.joristalmon.nl Ook voor mijzelf heb ik een website gemaakt. Voor school hebben we in de eerste week van het eerste jaar namelijk met HTML 5 en CSS een website moeten maken, maar daar was ik niet helemaal tevreden over. Daarom heb ik met Wordpress een simpele en mooie portfolio site gemaakt. 12
De website Bij het maken van deze website had ik eerst ook het idee om Jarvis te gebruiken, maar al snel had ik door dat dit niet nodig was en erg onhandig zou zijn geweest, voor mij moest het simpeler. Daarom heb ik gekozen voor een blog thema genaamd Eighties. Bij deze pagina komen al je nieuwe berichten onder elkaar in een lijst, bij elk nieuw bericht is de mogelijkheid om er een foto en beschrijving bij te plaatsen. Wat je aan dit thema aan kan passen is het menu en je categorieën, zo kan je sneller door je berichten zoeken. Natuurlijk heb je ook de mogelijkheid om het thema aan te passen in kleur, header foto en lettertypen. Sommige kleur of tekst aanpassingen staan alleen niet in het Wordpress menu, daarom moet je de stylesheet soms een beetje aanpassen om toch de instellingen te krijgen die je wilt. Zelf heb ik dit gedaan voor een paar knopjes en headers. 13
MaCLOUD http://www.macloud.nl MaCloud is een galerie en cadeaushop in Bilthoven geopend sinds 2012. Er zijn exposities van locale artiesten, internationale artiesten en er hebben werken gehangen van bekende kunstenaars, waarvan de bekendste DALI is geweest. De MaCloud galerie is ook een goede ruimte om te huren voor bijeenkomsten, workshops, feestjes of kleine evenementen. De site van MaCloud had een grote update nodig omdat deze er niet mooi meer uitzag. Daarom ben ik gevraagd om dat te doen. Later wilde ze ook een webshop met de artikelen en schilderijen die er worden verkocht. 14
De website Bij het maken van deze website heb ik er voor gekozen om nogmaals Jarvis te gebruiken. Dit is een mooi thema om informatie te tonen en het is erg hip. Later bleek echter dat Jarvis niet het beste thema voor een webshop is, maar het heeft uiteindelijk wel prima uitgepakt. De eerste versie die ik maakte was eind augustus, net voordat de nieuwe expositie van start ging. Bij deze versie was nog niet alles af en zaten er open ruimtes in die het er naar mijn mening minder mooi uit lieten zien. Ook de webshop was nog niet toegevoegd. In de tweede versie van de site heeft deze een update gekregen hoe zij er uit ziet en hoe de indeling is. Ook is er nieuwe informatie toegevoegd over een nieuwe kunstenaar die exposeert en de webshop is er bij gekomen. De webshop was een lastige klus, Jarvis is namelijk niet helemaal geschikt voor deze plug-in. De producten konden niet op de hoofdpagina worden getoond, en er kon geen extra pagina worden gemaakt waar parallaxen en meerdere delen inhoud kunnen worden in getoond. Uiteindelijk is de webshop op een aparte pagina gekomen zonder een grote header of parallaxen, maar hij werkt wel goed en dat is natuurlijk het doel. 15
Conclusie Het maken van een Wordpress website is erg nuttig voor mij geweest en ik denk dat ik er altijd veel aan zal blijven hebben. Websites voor mijzelf of andere te bouwen is nu redelijk snel en gemakkelijk te doen. Ik heb het privilege gehad dat ik via mijn vaders bedrijf de hulp en mogelijkheden kreeg om websites te hosten en maken. Het begin van het project was een beetje pittig omdat het online krijgen van een URL erg lastig kan zijn, maar met een beetje hulp was dit snel gedaan. Het maken van de websites kan af en toe nog wel een beetje tegenvallen, vooral als je dingen wilt oplossen die je niet direct in het menu van Wordpress kan aanpassen, daarom is het handig om wat kennis op te doen van CSS of PHP, en kijk veel op forums. Vooral belangrijk is om in het begin te oriënteren wat de functie is van je website. Bij MaCloud had ik achteraf namelijk beter een ander thema kunnen kiezen, maar toen ik begon was er nog geen vraag voor een webshop. 16
Tijdverantwoording Wordpress leren Boek: The creative person s website builder Uitleg van Kenner over template macloud: Overleg: 7 uur 2,5 uur Build 1 Opzetten url: 4 uur Vekgrijgen van informatie 3 uur bouwen eerste versie 5 uur Build 2: webshop bouwen: - inhoud webshop (artikelen fotografen en prijslijst checken) 4 uur - woocommerce tutorials kijken - invoeren producten 10 uur - tweede homepage maken, of shop in homepage zetten 4 uur - cart, checkout en my account maken update layout: nieuwe expositie: informatie verkrijgen 1 uur nieuwe informatie implementeren Mijn eigen website: build 1: Opzetten url: Thema wordpress (uitproberen) Build 2: Nieuw thema onderzoeken: Inhoud pagina toevoegen Bijhouden website: 2,5 uur 3 uur 4 uur 1,5 uur 17
Tijdverantwoording een kind van 70 - website: Overleg: - uitwerken overleg 3 uur - feedback verwerken 3 uur Uitwerking - versie 1 informatie organiseren wordpress installeren pagina s opzetten 3 uur homepage ordenen 1,5 uur layout creëren 2,5 uur - rebuild: versie 2 nieuwe informatie krijgen nieuwe pagina s aanmaken homepage herordenen 1,5 uur - rebuild: versie 3 nieuwe informatie krijgen nieuwe pagina s aanmaken homepage herordenen 1,5 uur verslag schrijven verslag opmaken foto s gemaakt met wouter stips 5 uur 6 uur Draaidagen Assistent productie - runner Behind the scenes Autoceu (bij een opname van Talmon) Totaal 1 4 uur 3 uur 125,5 uur 18