WordPress Themes. Alva Design. web & print. Auteur: Winy Schalke Alva Design. Maladão PT Arganil

Maat: px
Weergave met pagina beginnen:

Download "WordPress Themes. Alva Design. web & print. Auteur: Winy Schalke. www.alva-design.com. 2010 Alva Design. Maladão PT 3300-112 Arganil +351 235 205 239"

Transcriptie

1 Alva Design web & print Maladão PT Arganil Weerdsingel O.Z. 28 NL 3514 AB Utrecht +31 (0) WordPress Themes Auteur: Winy Schalke Alva Design

2 Zet je eigen ontwerp om in een WordPress Theme In deze workshop leer je hoe je je eigen ontwerp voor een website kunt omzetten in een WordPress template. Je werkt hiervoor met HTML, CSS en een beetje PHP. Je maakt gebruik van de voordelen die een Theme Framework biedt. Docent Winy Schalke Alva design Assistenten Karin Bronwasser Bronwasser Websites Marieke van de Pol Van de Pol Grafisch Ontwerp 2

3 Deel 1 - inleiding Hoe werkt WordPress? Om een php-pagina te kunnen zien in een browser, heb je een server en een database nodig. Die zet de PHP om naar HTML. En dat is dan wat je ziet in de browser. Stukjes php-code roepen dingen uit de database op, en die dingen (tekst, plaatjes, menu-items) worden vervolgens in de pagina geplaatst. In de php-pagina staat bijvoorbeeld: Roep hier alle menu-items bij elkaar, en die komen dan als een keurig menu-lijstje in de browser tevoorschijn. Bijvoorbeeld: in de php-pagina staat: <?php wp_list_pages();?> Daardoor zie je in de browser een ongeordende HTML-lijst met list-items van links naar de pagina s: <ul class= navigation > <li class= page_item ><a href= title= >menuitem1</a></li> <li class= page_item ><a href= title= >menuitem2</a></li> <li class= page_item ><a href= title= >menuitem3</a></li> </ul> Zo n stukje php-code dat je gebruikt voor een WordPress-Template heet in WordPress, heel origineel, een Template Tag. In de Codex, het deel van de WordPress.org website waarin je alles kunt vinden over templates, het is een soort naslagwerk, zie je bij de afdeling wp_list_ pages() een heleboel voorbeelden van het gebruik daarvan: Je kunt namelijk allerlei dingen meegeven met de list-pages-template-tag; bijvoorbeeld dat de pagina-links/menuitems op alfabetische volgorde moeten komen, of dat alleen de hoofdmenuitems zichtbaar moeten zijn, en niet de submenu-items, en nog veel meer. Dat kan je allemaal lezen in de Codex, je ziet er ook voorbeelden. Wat is een Theme? Het Theme is de skin, die bepaalt hoe de WordPress website er uit ziet. Dit wordt geregeld met voornamelijk CSS en plaatjes, en eventueel nog extra functies. Scheiding van vorm, functies en inhoud Een Theme heeft niets te maken met de inhoud (content). In WordPress zijn de vorm en de inhoud strict gescheiden. Zo kun je bijvoorbeeld WordPress updaten zonder dat je iets aan je Theme hoeft te veranderen. Een Theme activeren Je kunt met één muisklik van Theme wisselen: via Dashboard > Weergave > Thema s > Activeren. Er verandert dan niets aan de inhoud van de website, alleen aan hoe die inhoud er uit ziet. Het standaard (default) Theme is TwentyTen. 3

4 Waaruit bestaat een Theme? Een Theme bestaat uit verschillende bestanden voor: 1. Presentatie Dit bepaalt de vormgeving Bestand: style.css 2. Content Dit bepaalt de inhoud (wat komt er op de homepage, op een single page, op een lijst van berichten, op de zoekresultaten-pagina, enz.). Bestanden: index.php, single.php, page.php, category.php, search.php, enz. 3. Functies Dit bepaalt hoe je Theme functioneert Bestand: functions.php Hoe werken WordPress templates? Als WordPress een pagina samenstelt kijkt het eerst in de actieve Theme directory voor het juiste template (afhankelijk van het type pagina). WordPress zoekt naar template files met specifieke namen in een specifieke volgorde. Meer hierover kun je lezen in de Codex. Alle content wordt opgeslagen in de database. Aan elke post komen één of meer vlaggetjes: Een pagina is een bericht met het vlaggetje pagina. Verder heb je de berichten, daaraan zitten de vlaggetjes auteur, datum, categories en tags en het vlaggetje bericht. Het diagram op de volgende pagina laat zien welke template files worden aangeroepen om een WordPress pagina samen te stellen op basis van de WordPress Template hierarchy. 4

5 5

6 De anatomie van een Theme WordPress is een modulair systeem, dat wil zeggen dat de meeste pagina s zijn opgebouwd uit stukjes: header, sidebar, footer, enz. Deze stukjes worden op verschillende pagina s gebruikt. Al deze modules samen vormen het Theme. De Themes vind je in de directory /wp-content/ themes. De belangrijkste componenten zijn: Header Navigatiemenu Loop Paginering (onder posts, older, newer) Comments Sidebars en Widgets Footer header navigatiemenu bericht (de loop) widget bericht (de loop) widget sidebar widget bericht (de loop) paginering footer Het is goed om in je ontwerp al rekening te houden met al deze componenten en voor elk een vormgeving te bedenken. Header Identiteit, logo, mission statement. (eventueel: navigatiemenu, zoekveld, links naar RSS feed, etc.) Navigatiemenu Dit kan horizontaal of verticaal zijn, eventueel drop-down. Loop Dit is het belangrijkste onderdeel van een Theme. De Loop is het hart van WordPress. Met de Loop worden de berichten (en de pagina s) gegenereerd. In een loop worden net zoveel posts getoond als er zijn die aan een bepaalde vraag voldoen. En die vraag wordt bepaald door de vlaggetjes die aan de post hangen. Een pagina wordt altijd in zijn geheel op een webpagina getoond. De berichten echter staan altijd in een overzicht met alle berichten die aan de 6

7 gevraagde voorwaarden voldoen. Zo kun je een overzicht hebben van alle berichten door Jan geschreven, of alle berichten geschreven in januari 2009 of met de tag bericht of in de rubriek Groenten en fruit. Standaard worden alle berichten getoond op chronologische volgorde, tenzij er een andere vraag is. De loop gaat net zolang door tot er geen berichten meer zijn die aan de bepaalde vraag voldoen. Wat er in de loop staat, bepaal jij als Theme developer. Jij kunt door middel van PHP codes onderdelen van de loop bepalen, zoals auteur, datum, titel, content enz. Paginering Dit zijn links om vooruit en achteruit te navigeren door berichten. Wordt meestal onder een bericht geplaatst, na de loop. Comments De reacties op een bericht en het reactieformulier. Sidebars en Widgets De sidebar is niet per definitie een balk aan de zijkant, het is een element in de pagina waar widgets kunnen worden getoond. Wat er in de sidebar staat is afhankelijk van je Theme. Er zijn Themes waar geen widgets standaard staan ingesteld. In de code staat meestal zoiets: als er een dynamische sidebar is laat deze dan zien en toon anders het volgende. Maar er zijn ook Themes waar dat niet in staat. Dan heb je dus geen standaard widgets. Je ziet ze ook niet bij de widgets staan, ze staan in de code van de sidebar (of niet) en die widgets verdwijnen zodra je zelf widgets in de sidebar gaat zetten. Footer Deze komt meestal onderaan de pagina, na de content. Bevat meestal copyright informatie en enkele links. Wat is een Framework? Een Framework is een Theme waar zo ongeveer alle mogelijkheden verwerkt zijn in een op het oog redelijk neutrale basis. Een Framework biedt HTML, functies, en een aantal basis CSS regels, die je kunt gebruiken als uitgangspunt voor je eigen Theme. Je hoeft dus minder tijd te besteden aan het schrijven van basiscode, en houdt meer tijd over om je te concentreren op je ontwerp. Het enige wat je hoeft te doen is je te verdiepen in hoe je met CSS je Theme visueel naar je eigen hand zet, en eventueel hoe je met de juiste PHP code de juiste informatie uit de database tovert. Voordelen van het Thematic Framework: Ideaal om te gebruiken, zoals het is, of als een leeg WordPress Theme voor ontwikkeling Volledig Search Engine Optimized Extra widget-ready gebieden (13 in totaal) en nog veel meer mogelijk in je Child Theme Inclusief een voorbeeld WordPress Child Theme om snel mee te beginnen Een wiki handleiding voor het aanpassen van Thematic Klaar voor WordPress plugins zoals Subscribe to Comments, WP-PageNavi, and Commentlicense Volledig compatible met All-In-One SEO en Platinum SEO plugins Verschillende, makkelijk te gebruiken, cross-browser lay-outs voor 2 of 3 kolommen Modulaire CSS met resets en basis typografie Bewerkbare footer-tekst: Theme colofon makkelijk te verwijderen of aan te passen 7

8 Opties voor multi-author blogs Dynamic post and body classes maken het ideaal voor CSS kunstenaars Werken met een Child Theme op basis van het Thematic Framework Vroeger moest je, als je de output van een WordPress-Theme wilde wijzigen, de Theme template-bestanden aanpassen. Als het Theme waarmee je was gestart werd ge-upgrade, was je heel veel tijd kwijt om al je wijzigingen over te zetten naar de nieuwe versie. Met WordPress 2.7 is dat allemaal veranderd met de optie om Child Themes te gebruiken. Een Child Theme is een Theme dat de mogelijkheden van een ander Theme uitbreidt of aanvult. Een Child Theme bestaat ten minste uit een stylesheet (style.css) in de eigen directory, en een ander Theme gespecificeerd als de Parent. Als WordPress een pagina samenstelt, zal het de style sheet van het Child Theme gebruiken, en de templates van het Parent Theme. Een Child Theme werkt dus altijd in combinatie met een Framework (Parent Theme). WordPress Child Themes zitten gewoon in je /wp-content/themes/ directory, net als elk ander Theme wat je geïnstalleerd heb. Je activeert een Child Theme ook op dezelfde manier als elk ander Theme. In een Child Theme folder vind je vaak dezelfde mappen voor je afbeeldingen, je scripts en daarnaast vind je in ieder geval een style.css bestand en mogelijk ook een functions.php. Het enige verschil is dat een Child Theme geen Theme bestanden nodig heeft. Geen index. php, sidebar.php, header.php, footer.php. In feite heb je helemaal geen PHP nodig om een Child Theme te maken. Overigens is het goed mogelijk dat een Child Theme wel alle bovengenoemde bestanden heeft, maar ze zijn vaak niet nodig. Als je bijvoorbeeld een afwijkende pagina wilt, dan kopieer je het bestand page.php uit het Thematic Theme naar je Child Theme en doet daarin aanpassingen. WordPress gebruikt dan page.php uit je Child Theme, omdat dit voorrang krijgt in de hierarchie. functions.php en template files Maar Child Themes kunnen nog meer. Op twee manieren kan het gedrag van de Parent Theme genegeerd worden. 1. Je kunt het het bestand functions.php gebruiken voor het toevoegen van je eigen code aan het thema. 2. Template bestanden die zijn opgeslagen in de directory van het Child Theme krijgen voorrang boven die van de Parent. Als je wijzigingen wilt aanbrengen in de opmaak of de functionaliteit van de Parent Theme hoef je dus alleen een aangepaste PHP-functie te schrijven of je eigen versie van het desbetreffende template te maken. WordPress kijkt bij het samenstellen van de pagina eerst welke bestanden er staan in het Child Theme. Daar staat in elk geval de style.css die naar het Parent Theme verwijst. Bestanden die WordPress niet in het Child Theme vindt zal het zoeken bij de Parent. Maar als er in het Child Theme bijvoorbeeld een page.php staat dan krijgt deze voorrang boven de page.php in het Parent Theme. Elk Theme kan fungeren als een Parent. Je kunt dus jouw favoriete Theme gaan gebruiken als een Framework voor je eigen nieuwe thema, zonder het origineel te bewerken. Niets houdt je tegen om direct in je Framework te wijzigen, maar het is beter om alleen het Child Theme te wijzigen. Als de ontwikkelaar van je Framework Theme een update uitbrengt, is het installeren van de nieuwe versie van de Parent het enige dat je hoeft te doen. Je Child Theme is dan meteen ook bijgewerkt. 8

9 Het voorbeeld Theme: Biomarkt Voor de workshop heb ik een voorbeeld Theme gemaakt. Hieronder zie je voorbeelden van verschillende soorten pagina s. De homepage Template: home.php De homepage is een statische pagina. Instellingen > Lezen > De startpagina toont > Een statische pagina. Een pagina Template: page.php De pagina Nieuws Uittreksels van de nieuwste berichten. Template: index.php Dit is de blog-pagina. Instellingen > Lezen > Berichtenpagina > Nieuws Een pagina met één compleet bericht. Template: single.php 9

10 Bij deze je eigen ontwerp kun je de maten in pixels opschrijven. Die haal je uit het Photoshop bestand. sidebar 2 menu #primary.aside #header #branding #blog-title #blog-description #access content #main.hentry #comments #footer #siteinfo sidebar 2 widgets #secondary.aside 10

11 Deel 2 - Aan de slag Thematic installeren en een Child Theme aanmaken Download Thematic (http://themeshaper.com/thematic). Upload Thematic via ftp naar /wp-content/themes. In de map thematic vind je een map thematicsamplechildtheme. Kopieer deze map, geef hem een andere naam (die van je Child Theme) en verplaats hem naar de /wp-content/themes. Personaliseren en Parent aanwijzen Open nu het bestand style.css uit je Child Theme map in een html editor. Je ziet daar de volgende code: 01 /* 02 Theme Name: A Thematic Child Theme 03 Theme URI: 04 Description: Use thisname to start your Thematic Child Theme developent. 05 Author: Ian Stewart 06 Author URI: 07 Template: thematic 08 Version: Tags: Thematic Thematic is Ian Stewart */ Je kunt deze informatie aanpassen. De belangrijkste regel is de volgende: 1 Template: thematic Hiermee geeft je in je Child Theme aan welk Theme de Parent Theme is. Alle CSS in de stylesheet van je Child Theme is óf aanvullend ten opzichte van je Parent Theme óf een wijziging hiervan. Een Child Theme moet minimaal bestaan uit een een style.css en een functions.php en het is handig om een screenshot.png te maken. Dan herkent WordPress het stylesheet bij weergave > thema s in het Dashboard. Activeer je Child Theme Ga naar het dashboard en activeer je Child Theme. Je zult nog geen verandering zien in de website, omdat je nog niets hebt aangepast. Maak wat content Maak even een paar pagina s met neptekst aan en een paar posts, categorieën en tags. CSS Om niets in het Parent Theme hoeven veranderen, doe je het volgende: Kopieer het bestand default.css uit wp-content/themes/thematic/library/styles naar je Child Theme map. In dit bestand ga je geen aanpassingen doen. Je kopieert dit alleen om te 11

12 zorgen dat als er bij een upgrade opeens veel gewijzigd wordt in het default.css van Thematic, je snel naar de oude versie kunt schakelen. Bij het maken van een Child Theme heb je de mogelijkheid om via functions.php alle wijzigingen ten opzichte van de Parent Theme te definiëren, maar uiteraard kun je ook je eigen versie van bijvoorbeeld header.php gebruiken. Ik maak meestal gebruik gemaakt van een combinatie van deze mogelijkheden. Zoals wel vaker, leiden er meerdere wegen naar Rome. Geen enkele is goed of fout. Ik laat het meeste in tact en verwerk alleen in de style.css wat ik wijzig. Dus als voor een div met veel css kenmerken alleen de kleur van de border wijzigt, is dat ook het enige dat ik in de style.css zet. Zo houd ik de style.css zo klein en overzichtelijk mogelijk. Iemand anders wil zo veel mogelijk bij elkaar houden en niet verdeeld over meerdere bestanden. Dat kan ook. Ieder moet zijn eigen weg hierin vinden. Zolang als je maar niets wijzigt in de Thematic bestanden, maar het gewijzigde bestand altijd direct als een kopie in de Child Themd map zet. De style.css (en functions.php) aanpassen Basis lay-out Je begint met het aanpassen van de basis lay-out in de CSS. Thematic heeft een aantal basis layouts, die vind je in de map wp-content/themes/thematic/library/layouts. Mijn ontwerp heeft 3 kolommen met sidebars links en rechts dus kies ik voor 3c-fixed.css. Je kunt dit als volgt activeren: Open style.css van je Child Theme in je html-editor. Je ziet nu dit:... /* Apply a basic layout url(../thematic/library/layouts/2c-r-fixed.css );... Verander deze regel in je style.css: /* Apply a basic layout url(../thematic/library/layouts/3c-fixed.css ); Bekijk het resultaat: je hebt nu 3 kolommen. Als deze lay-out je bevalt hoef je verder niets te doen. Ik wil echter ongelijke kolommen en aangezien ik niets in Thematic mag veranderen, doe ik het volgende: Open het bestand 3c-fixed.css uit Thematic. Kopieer alle code en plak deze in je style.css. WordPress gebruikt nu de layout uit je style.css in je Child Theme folder. Nu ga je de lay-out aanpassen. De afmetingen in pixels haal je uit je photoshop ontwerp. Alle wijzigingen zet je in je style.css. Dat maakt het voor jezelf veel overzichtelijker wat je heb aangepast. In de default.css staat zoveel, dat je dan niet meer zo snel kunt achterhalen wat je nu hebt aangepast. Ik heb #wrapper toegevoegd om dit een background color te kunnen geven en een vaste 12

13 breedte. #wrapper /* toegevoegd voor bg-color */ { overflow:hidden; background: #dddfd4 url(images/achtergrond.gif) repeat-y; width: 950px; margin: 0 auto; } Header In de broncode kun je zien hoe de header is opgebouwd. <div id= header > <div id= branding > <div id= blog-title ><span><a href= >biomarkt</a></span></div> <h1 id= blog-description >En nog een WordPress site</h1> </div><!-- #branding --> <div id= access ></div><!-- #access --> </div><!-- #header--> Een handig hulpmiddel hierbij is het werken met Firefox en Firebug. Je kunt dan heel makkelijk even wijzigingen in de css aanbrengen, kijken wat het resultaat is en dan vervolgens de aangepaste css toevoegen aan je stylesheet. De header bestaat uit 2 divs: #branding en #access. #access is het menu en #branding het logo. Je gaat nu eerst de branding stylen. In Child Theme maak je een nieuwe map aan: images. Hierin upload je het logo en eventueel andere plaatjes voor je Theme. Het logo van Biomarkt kun je uit het Photoshop bestand knippen. Ik kies ervoor om het logo als achtergrondplaatje te plaatsen. #header { background: #61674d url(images/logo.gif) no-repeat; height: 302px; } #branding { margin:0 auto; padding:0; height:302px; } Om de blog-title tekst niet wilt laten zien (maar wel in de code laten bestaan voor de zoekmachines): #blog-title { text-indent: -1000px; } Om het logo klikbaar te maken (link naar homepage): #blog-title a { width: 550px; height: 300px; display: block; } 13

14 Om de blog description onzichtbaar te maken: Geef eerst de Parent div (#header) een position relative (dat heeft deze toevallig al, door de layout). #header { position: relative; } Dan positioneer je de blog description absoluut, buiten beeld. #blog-description { position: absolute; left: -1000px; } De header is klaar. Bekijk het resultaat in verschillende browsers en pas eventueel nog wat aan. Menu Mijn menu wil ik verticaal i.p.v. horizontaal, in de linker sidebar. Bekijk het bestand sidebar.php in de Thematic folder. Niet bewerken! <?php // action hook for placing content above the main asides thematic_abovemainasides(); // action hook creating the primary aside widget_area_primary_aside(); // action hook for placing content between primary and secondary aside thematic_betweenmainasides(); // action hook creating the secondary aside widget_area_secondary_aside(); // action hook for placing content below the main asides thematic_belowmainasides();?> Hier kun je niet veel mee... Weghalen wat je niet wilt Eerst ga je de search functie weghalen. Dit is in Thematic een widget, dus kun je die verwijderen in het dashboard via weergave > widgets > primary aside. Categorieen en Archief kun je daar ook meteen weghalen. Nu blijft nog over: Koppelingenblok, RSS links en Meta. Deze widgets zitten in de secondaryaside, de rechter sidebar. Daaruit kun je alle 3 de widgets weghalen. Verticaal menu maken Je zou de pagina widget kunnen gebruiken om een menu in de sidebar te maken (die staat al in de primary aside). Deze heeft 2 beperkingen: de titel Pagina s de eventuele subpagina s wil ik niet zichtbaar hebben. Dus dit is geen optie. 14

15 Maak zelf een menu. In het dashboard: Weergave > menu s > menu aanmaken. Naam: Hoofdmenu Selecter de pagina s die moeten verschijnen. Klik Aan menu toevoegen. Menu opslaan. Primary menu: Hoofdmenu. Opslaan. Nu kun je de Widget aangepast menu in de primary-aside slepen en de widget pagina s eruit. Bekijk het resultaat in verschillende browsers en pas eventueel nog wat aan. Horizontale menu verwijderen Nu moet de horizontale navigatie nog weg. Je kunt die natuurlijk in de CSS op display: none; zetten, maar dan blijft het wel in de broncode staan. Niet zo aardig voor screenreaders, die zien dan een dubbel menu. Ik heb gegoogled op remove horizontal menu in Thematic en vond deze link: Kopieer de onderstaande code in je functions.php (van je Child Theme). Let op: vóór het laatste?> function thematic_custom_access() {?> <div id= access > <div> <a href= #content title= <?php _e( Skip navigation to the content, thematic );?> ><?php _e( Skip to content, thematic );?></a> </div> </div><!-- #access --> <?php } function thematic_remove_access() { remove_action( thematic_header, thematic_access, 9); remove_action( wp_head, thematic_head_scripts ); remove_filter( wp_page_menu, thematic_add_menuclass ); } add_action( init, thematic_remove_access ); add_action( thematic_header, thematic_custom_access, 9); Voor wie precies wil weten wat er gebeurt is hier de uitleg die op de website staat: I m creating two functions: thematic_custom_access is a straight clone of the standard thematic_access function that comes in the base Theme, except I ve removed the line that renders the page menu. The second function, thematic_remove_access is de-registering both the original thematic_ access function, and thematic_head_scripts; which inserts the JavaScript to drive the original page menu. Lastly it removes a filter that alters the output of the wp_page_menu function; 15

16 since we re likely going to want a normal page menu now, we don t want that change anymore. With those functions ready, we can just hook them in; thematic_remove_access gets hooked into the init stage, so that it removes the actions and filter before they run. thematic_custom_ access is simply hooked in where thematic_access used to be to replace the old #access div with our new one. In het algemeen werkt het zo: Als je iets in de functions wilt veranderen zoek je het betreffende stukje code in thematic/library/extensions. In de functions.php van je Child Theme maak je de bestaande functie (action) inactief en je voegt de gewijzigde functie (action) toe. Je hebt hoervoor wel enige PHP-kennis nodig. Skip to content onzichtbaar maken Nu moet Skip to content (goed voor accessibility, screenreaders) nog onzichtbaar worden. Kijk in de broncode: <div id= access > <div> <a href= #content title= Skip navigation to the content >Skip to content</a> </div> </div><!-- #access --> In de style.css van je child theme pas je dit aan: #blog-description, #access { position: absolute; left: -1000px; } Nu het menu nog stylen Kijk weer in de broncode hoe het menu is opgebouwd: <div id= primary class= aside main-aside > <ul class= xoxo > <li>...<div class= menu-hoofdmenu-container > <ul id= menu-hoofdmenu class= menu > <li id=... ><a href=... >Home</a></li> <li id=... ><a href=... >Locaties</a></li>... </ul></div> </li> </ul> </div><!-- #primary.aside --> Je kunt het menu stylen in style.css. Let op: het heet niet.sf-menu (dat was het horizontale menu) maar #primary en.aside. Kopieer de benodigde css code uit thematic/default.css in je style.css. /* =Asides, Sidebars & Widget-Ready Areas */ #primary {} 16

17 Content (loop) Kijk in de code en pas de CSS waar nodig aan. Als je iets niet in de default.css vindt, kijk dan in de images.css of typhography.css. Let op: verander niets in de Thematic-bestanden! Kopiëer wat je wilt aanpassen naar je style.css in je Child Theme folder en pas het daar aan. Je ziet dat sommige teksten nog in het Engels staan (de datum, auteur, etc. bij de berichten) Deze teksten zijn onderdeel van Thematic. Als je WordPress Nederlands hebt en zorgt dat beide taalbestanden hetzelfde heten gaat de vertaling van Thematic vanzelf. De taalbestanden in de map wp-content/themes/thematic/library/languages moeten hetzelfde heten als de taalbestanden van WordPress, in de map. wp-content/languages. (nl_nl.mo en nl_nl.po of nl.mo en nl.po). Sidebars en Widgets Sleep enkele widgets in de tweede sidebar. Kijk in de code en pas de CSS waar nodig aan. Widgets blijven helaas niet staan als je van Theme wisselt tenzij de beide Themes dezelfde benaming hebben voor de sidebars. Helaas is daar geen uniformiteit in. Gelukkig blijven ze wel staan in het vak net gebruikte widgets, dus je kunt ze altijd weer terugslepen. Tip: Maak eerst een screenshot van wat waar staat voor je van theme gaat wisselen om te testen. Footer Kijk in de code en pas de CSS waar nodig aan. Zo kun je eventueel ook nog de paginering (onder de posts, links voor oudere en nieuwere posts), de comments en andere elementen aanpassen. Als je de comments niet op pagina s wilt laten zien, maar wel op berichten: body.page #comments { display:none; } Bekijk na elke stap het resultaat in verschillende browsers en pas eventueel nog wat aan. Controleer alle paginasoorten De homepage Een lijst met berichten Een standaard pagina Voor pagina s met algemene info, niet tijdgebonden Een single post pagina Hierop staat een volledig bericht De archief, Auteur, Categorie en Tag pagina s Een lijst met berichten De zoekresultatenpagina De 404 pagina Als iets er (nog) niet uitziet zoals je wilt kijk je in de code en past de style.css aan. 17

18 Links WordPress Codex Thematic WordCamp presentatie over FrameWorks Website met veel tips voor Thematic Website met veel ander WordPress nieuws FireFox Firebug addon https://addons.mozilla.org/en-us/firefox/addon/1843/ FireFox web developer toolbar addon https://addons.mozilla.org/en-us/firefox/addon/60/ Voor inspiratie qua design, en er zijn ook frisse WP-themes te koop Theme-frameworks/ The easiest way to use Real Fonts on your website WordPress-plugins Typekit: Boeken Build your own Wicked WordPress Themes (SitePoint) Flexibele websites en blogs met WordPress (Easy Computing) Kickstart WordPress (Robbert Ravensbergen) 18

SELECTEER EEN PAGINA TEMPLATE EN HOOFD VOOR DE PAGINA: Selecteer, in de PAGINA ATTRIBUTEN module rechts naast

SELECTEER EEN PAGINA TEMPLATE EN HOOFD VOOR DE PAGINA: Selecteer, in de PAGINA ATTRIBUTEN module rechts naast OPMAKEN VAN BERICHTEN EN PAGINA S ONE PAGER Berichten en pagina s worden op dezelfde wijze opgemaakt. Voor het opmaken van een bericht ga je in het navigatiemenu (afbeelding rechts) naar BERICHTEN > NIEUW

Nadere informatie

- Plan Zo kun je een. website bouwen!

- Plan Zo kun je een. website bouwen! - Plan Zo kun je een website bouwen! BoekjeHoeKanJeEenWebsiteBouwen.i1 1 8-7-2008 17:23:14 BoekjeHoeKanJeEenWebsiteBouwen.i2 2 8-7-2008 17:23:15 In dit boekje staat de uitgebreide versie van hoe je een

Nadere informatie

Om het Elektronica thema te installeren gaat u naar "Theme Store" in Design. Hier kunt u het Elektronica thema in 4 kleurvarianten vinden.

Om het Elektronica thema te installeren gaat u naar Theme Store in Design. Hier kunt u het Elektronica thema in 4 kleurvarianten vinden. Inhoud: 1. Installatie 2. FAQ 3. Thema instellingen 4. Meer hulp nodig? 1.Installatie: Om het Elektronica thema te installeren gaat u naar "Theme Store" in Design. Hier kunt u het Elektronica thema in

Nadere informatie

Handleiding: Whitelabel Customersite

Handleiding: Whitelabel Customersite ARGEWEB B.V. Handleiding: Whitelabel Customersite Controlportal.nl Argeweb Support 8-1-2009 Handleiding voor het gebruik maken van de Whitelabel Customersite op controlportal.nl, door Resellers van Argeweb.

Nadere informatie

De Kleine WordPress Handleiding

De Kleine WordPress Handleiding Introductie Dit is geen uitgebreide handleiding om een WordPress website of blog mee te bouwen. Het is ook geen overzicht van alle aspecten die een WordPress website zo bijzonder maken en geen verhandeling

Nadere informatie

1. De basis 2. De basis uitbreiden

1. De basis 2. De basis uitbreiden Wordpress Theme Hoe moet je deze reader gebruiken? Deze reader is digitaal, zodat je makkelijk stukjes code kunt kopieren en plakken. 1. De basis 2. De basis uitbreiden Hier aan de linkerkant vind je een

Nadere informatie

Pro templates. Copyright Starteenwinkel.nl

Pro templates. Copyright Starteenwinkel.nl Pro templates Copyright Starteenwinkel.nl Lees in deze handleiding over: 1. PRO templates; voor wie geschikt? 2. Aan de slag met een PRO template 3. Template Designer 4. Template Editor 5. Sliders aanpassen

Nadere informatie

WordPress Handleiding

WordPress Handleiding Algemene Informatie Disclaimer: Bij het samenstellen van dit boek is de grootst mogelijke zorg besteed aan de juistheid van de opgenomen informatie. Wij kunnen echter niet verantwoordelijk gesteld worden

Nadere informatie

Publiceren met WordPress

Publiceren met WordPress Publiceren met WordPress Peter Osterop Tweede herziene editie 1. Installatie van WordPress 2. Configuratie van WordPress 3. Het uiterlijk van WordPress 4. Pagina s en berichten maken in WordPress 1 Installatie

Nadere informatie

Gebruikershandleiding websitebeheer m.b.v. Wordpress

Gebruikershandleiding websitebeheer m.b.v. Wordpress Gebruikershandleiding websitebeheer m.b.v. Wordpress Saft Websites Gebruikershandleiding Wordpress pag. 1 Inhoudsopgave Inhoudsopgave Inhoudsopgave Inleiding Inloggen in administratorgedeelte Informatie

Nadere informatie

Algemene WordPress Handleiding uitleg basics Karin de Wit Design

Algemene WordPress Handleiding uitleg basics Karin de Wit Design Inhoudsopgave Inhoudsopgave... 2 Algemene informatie... 3 Introductie... 4 Inloggen bij WordPress... 5 Introductie in het dashboard... 6 Berichten en pagina's... 8 Bericht Categorieën... 8 Nieuw Bericht...

Nadere informatie

Handleiding voor het zelf onderhouden van je Wordpress website

Handleiding voor het zelf onderhouden van je Wordpress website Handleiding voor het zelf onderhouden van je Wordpress website Inhoud Introductie... 3 Belangrijke Termen... 3 Inloggen op jouw Wordpress website... 4 Een Backup maken... 4 Het Wordpress dashboard... Thema

Nadere informatie

Pro templates. Copyright Starteenwinkel.nl

Pro templates. Copyright Starteenwinkel.nl Pro templates Copyright Starteenwinkel.nl Lees in deze handleiding over: 1. PRO templates; voor wie geschikt? 2. Aan de slag met een PRO template 3. Template Designer 4. Template Vormgever 5. Sliders aanpassen

Nadere informatie

Voor vragen: http://www.richard3332.nl/ of mail naar Richard3332@gmail.com

Voor vragen: http://www.richard3332.nl/ of mail naar Richard3332@gmail.com Welkom bij mijn website tutorial (Deel 5) Ik ga uit van Microsoft XP voor de duidelijkheid. Ik heb dus geen idee of de programma s die ik gebruik ook op Vista werken. Notepad++ werkt zowieso op xp en Vista.

Nadere informatie

Template maken voor Webshops van FreeWebShop

Template maken voor Webshops van FreeWebShop Template maken voor Webshops van FreeWebShop Versie 1 Peter Jan van Tuil Maart 2011 info@van-tuil.info De uitdaging. Een kennis die een site wil hebben, een webshop. Het grafisch ontwerp is er al. Voor

Nadere informatie

Frontend ontwikkeling

Frontend ontwikkeling Frontend ontwikkeling Mark Jansen Edwin Vlieg PHPFreakz ledendag 10 november 2007 Frontend ontwikkeling De interface is je product richting de eindgebruiker Goede PHP code met een slechte interface geeft

Nadere informatie

Handleiding opmaken Wageningen UR Blog. Oktober 2015

Handleiding opmaken Wageningen UR Blog. Oktober 2015 Handleiding opmaken Wageningen UR Blog Oktober 2015 Voorwoord In deze handleiding is voor beheerders van het Wageningen UR blog template stap voor stap beschreven hoe zij hun blog kunnen inrichten. Bij

Nadere informatie

HTML en CSS. Je website bestaat uit HTML. Dat is een taal die browsers (Internet explorer, Chrome, Safari) kunnen lezen.

HTML en CSS. Je website bestaat uit HTML. Dat is een taal die browsers (Internet explorer, Chrome, Safari) kunnen lezen. Terminologie HTML en CSS HTML: Hyper Markup language Je website bestaat uit HTML. Dat is een taal die browsers (Internet explorer, Chrome, Safari) kunnen lezen. CSS: Cascading StyleSheet stylesheet for

Nadere informatie

MARKETING & COMMUNICATIE - DIGITALE VORMGEVING

MARKETING & COMMUNICATIE - DIGITALE VORMGEVING MARKETING & COMMUNICATIE - DIGITALE VORMGEVING 1 WordPress.com Een site/blog aanmaken Ga naar www.wordpress.com. Bovenaan kun je de pagina vertalen in het Nederlands Account Maak een account aan. Vul in:

Nadere informatie

Gebruikershandleiding websitebeheer m.b.v. Wordpress incl. Woo-Commerce

Gebruikershandleiding websitebeheer m.b.v. Wordpress incl. Woo-Commerce Gebruikershandleiding websitebeheer m.b.v. Wordpress incl. Woo-Commerce Saft Websites Gebruikershandleiding Wordpress icm Woocommerce pag. 1 Inhoudsopgave Inhoudsopgave Inhoudsopgave Inleiding Liever persoonlijke

Nadere informatie

design ook items uitsnijden

design ook items uitsnijden (fig1) Hulplijnen zetten Om het ontwerp netjes uit te snijden is het handig om eerst hulplijnen te zetten. (fig1) Nu is het zaak om eerst voor je zelf te bepalen wat is layout en wat is design. Al het

Nadere informatie

Inhoud van de website invoeren met de ContentPublisher

Inhoud van de website invoeren met de ContentPublisher Inhoud van de website invoeren met de ContentPublisher De inhoud van Muismedia websites wordt ingevoerd en gewijzigd met behulp van een zogenaamd Content Management Systeem (CMS): de ContentPublisher.

Nadere informatie

Handleiding Wordpress CMS 4-5-2015

Handleiding Wordpress CMS 4-5-2015 Handleiding Wordpress CMS 4-5-2015 Inhoud 1. Het dashboard.... 3 2. Een pagina of bericht aanpassen.... 5 3. Een nieuw bericht toevoegen... 6 4. Een pagina maken... 7 5. Website met sitebuilder... 8 6.

Nadere informatie

Sophie van Solinge 77524 CMS32

Sophie van Solinge 77524 CMS32 Sophie van Solinge 77524 CMS32 1 Opdracht 1 Drupal Wordpress Joomla Case 1 De groenteboer op de hoek, heeft grootse plannen voor zijn zaak. Omdat er in de omgeving veel verzorgingstehuizen zijn en de inwoners

Nadere informatie

Wordpress.com. Een site/blog aanmaken

Wordpress.com. Een site/blog aanmaken Wordpress.com Een site/blog aanmaken - Ga naar www.wordpress.com - Maak een account aan. - Lees zorgvuldig zodat je een Nederlandstalige versie aanmaakt. - Activeer het account vanuit je email. Het adres

Nadere informatie

Lichtgewicht CSS design voor Drupal 6

Lichtgewicht CSS design voor Drupal 6 Lichtgewicht CSS design voor Drupal 6 Roy Scholten Drupaljam Enschede, 20 maart 2009 1 Question: How to convert an OSWD design into a Drupal theme. In 45 minutes? 2 Wie heeft deze vraag gesteld? Answer:

Nadere informatie

Introductie 2. Inloggen 3. Dashboard 4. Pagina aanmaken / bewerken 5. Bericht toevoegen / bewerken 6. Afbeelding toevoegen 7. De tekstbewerker 11

Introductie 2. Inloggen 3. Dashboard 4. Pagina aanmaken / bewerken 5. Bericht toevoegen / bewerken 6. Afbeelding toevoegen 7. De tekstbewerker 11 I n h o u d s o p g ave Introductie 2 Inloggen 3 Dashboard 4 Pagina aanmaken / bewerken 5 Bericht toevoegen / bewerken 6 Afbeelding toevoegen 7 De tekstbewerker 11 Menu toevoegen / aanpassen 12 I n t ro

Nadere informatie

ActiveBuilder Handleiding

ActiveBuilder Handleiding ActiveBuilder Handleiding Auteur: TalkActive I/S Datum: Juli 2004 Versie: R. 1.01 Taal: Nederlands Copyright 2004 - Talk Active alle rechten voorbehouden. Inhoud: 1. INTRODUCTIE...2 2. SNEL STARTEN...3

Nadere informatie

Handleiding Wordpress

Handleiding Wordpress Handleiding Wordpress Inhoudsopgave 1. Inloggen 2. Berichten en Pagina s 3. Afbeeldingen en video s 4. Weblinks 1. Inloggen 1.1 Inloggen bij Wordpress We starten met het inloggen op je WordPress gebaseerde

Nadere informatie

EEN WEBSITE MAKEN MET WEEBLY

EEN WEBSITE MAKEN MET WEEBLY EEN WEBSITE MAKEN MET WEEBLY Dit is de handleiding om op Weebly.com een website te leren maken. De handleiding is verdeeld in 5 hoofdstukken; 1. Aanmelden 2.Weebly werkblad 3. Draggen en Droppen 4.Pagina

Nadere informatie

APEX Templates. OGH APEX dag 30 maart. Art Melssen. 31 maart 2010

APEX Templates. OGH APEX dag 30 maart. Art Melssen. 31 maart 2010 APEX Templates OGH APEX dag 30 maart Art Melssen Introductie Over de spreker 4 jaar APEX ervaring / 7 jaar Oracle 10 jaar web technologie ervaring APEX trajecten o.a. bij Centraal Boekhuis en eboekhuis

Nadere informatie

Globale kennismaking

Globale kennismaking Globale kennismaking Kennismaking Tesla CMS 1. Dashboard 2. pagina beheer - pagina aanmaken - pagina aanpassen - pagina verwijderen - pagina seo opties - zichtbaarheid pagina 3. subpagina beheer - subpagina

Nadere informatie

VKblog-importer : De gebruiksaanwijzing.

VKblog-importer : De gebruiksaanwijzing. VKblog-importer : De gebruiksaanwijzing. deze gebruiksaanwijzing beschrijft versie 0.1.2 VKblog-importer is een plugin voor WordPress die bedoeld is om blogs van VKblog te importeren in WordPress. Posts

Nadere informatie

Handleiding. HetSchoolvoorbeeld.nl. Versie 2.2 - juni 2014. Websites voor het onderwijs. Meest recente uitgave: www. hetschoolvoorbeeld.

Handleiding. HetSchoolvoorbeeld.nl. Versie 2.2 - juni 2014. Websites voor het onderwijs. Meest recente uitgave: www. hetschoolvoorbeeld. HetSchoolvoorbeeld.nl Websites voor het onderwijs Handleiding Versie 2.2 - juni 2014 Meest recente uitgave: www. hetschoolvoorbeeld.nl/handleiding Handleiding HetSchoolvoorbeeld 2.2 Pagina 1 Inhoud Inhoud

Nadere informatie

WEBSITE USABILITY. white-paper

WEBSITE USABILITY. white-paper WEBSITE USABILITY white-paper Alle rechten voorbehouden Het is niet toegestaan deze white-paper aan derden te verstrekken of te verkopen. Het is niet toegestaan de inhoud van deze white-paper elders te

Nadere informatie

Basis-theme. Manage Wiki > Look and Feel > Themes > Change or make a new theme > Make a New Theme >

Basis-theme. Manage Wiki > Look and Feel > Themes > Change or make a new theme > Make a New Theme > Basis-theme Manage Wiki > Look and Feel > Themes > Change or make a new theme > Make a New Theme > Naam invullen en de code van basis-theme kopiëren en erin plakken

Nadere informatie

Inleiding. - Teksten aanpassen - Afbeeldingen toevoegen en verwijderen - Pagina s toevoegen en verwijderen - Pagina s publiceren

Inleiding. - Teksten aanpassen - Afbeeldingen toevoegen en verwijderen - Pagina s toevoegen en verwijderen - Pagina s publiceren Inleiding Voor u ziet u de handleiding van TYPO3 van Wijngaarden AutomatiseringsGroep. De handleiding geeft u antwoord geeft op de meest voorkomende vragen. U krijgt inzicht in het toevoegen van pagina

Nadere informatie

1 BUSINESS INTERNET SUPPORT

1 BUSINESS INTERNET SUPPORT Versie 1 BUSINESS INTERNET SUPPORT Yoron Dot Net Stap voor stap Handleiding YORON DOT NET BEHEER V1.X Stap voor stap handleiding YORON Het Wielsem 10 s-hertogenbosch Inhoudsopgave Opstarten Yoron DotNet

Nadere informatie

De WordPress 3.5 Beginners Handleiding

De WordPress 3.5 Beginners Handleiding De WordPress 3.5 Beginners Handleiding Internetbureau Elephant april 13 Inhoud Introductie... 2 Inloggen... 3 Het dashboard... 5 Berichten en pagina's... 6 Nieuw Bericht... 6 Nieuwe Pagina... 8 Afbeeldingen,

Nadere informatie

Icoon/Icon Betekenis Description. Change scheduling Online. Gaat offline op (datum/tijd) Online. Going offline on (date/time)

Icoon/Icon Betekenis Description. Change scheduling Online. Gaat offline op (datum/tijd) Online. Going offline on (date/time) Algemeen/General Gepubliceerd maar gewijzigd Published but changed Meer acties op geselecteerde content More actions on selected content Gepubliceerd en niet gewijzigd Published and not changed Terugdraaien

Nadere informatie

Versie 0.2. Documentatie Onsweb Club plugin voor NHV verenigingen. Laatste wijziging: 10 mei 2013 Auteurs: Marien Dongstra, Sebastian Huisman

Versie 0.2. Documentatie Onsweb Club plugin voor NHV verenigingen. Laatste wijziging: 10 mei 2013 Auteurs: Marien Dongstra, Sebastian Huisman Documentatie Onsweb Club plugin voor NHV verenigingen Versie 0.2 Laatste wijziging: 10 mei 2013 Auteurs: Marien Dongstra, Sebastian Huisman Alle rechten in dit document zijn voorbehouden. www.onsweb.nl,

Nadere informatie

Handleiding. HetSchoolvoorbeeld.nl. HetSchoolvoorbeeld 2.1. Websites voor het onderwijs. Websites Social media Mediawijsheid Grafisch ontwerp

Handleiding. HetSchoolvoorbeeld.nl. HetSchoolvoorbeeld 2.1. Websites voor het onderwijs. Websites Social media Mediawijsheid Grafisch ontwerp HetSchoolvoorbeeld.nl Websites voor het onderwijs Handleiding HetSchoolvoorbeeld 2.1 Websites Social media Mediawijsheid Grafisch ontwerp Handleiding HetSchoolvoorbeeld 2.1 Pagina 1 Inhoud 1 Opbouw van

Nadere informatie

beginnen met bloggen (kleine workshop Wordpress)

beginnen met bloggen (kleine workshop Wordpress) beginnen met bloggen (kleine workshop Wordpress) Een weblog is van oorsprongeen lijstje linktips met een stukje tekst. Oorspongvan het weblog Jorn Barger is an American blogger, best known as editor of

Nadere informatie

Weebly. Inhoud. Vormingplus Limburg, L. Frederix

Weebly. Inhoud. Vormingplus Limburg, L. Frederix Weebly Inhoud 1 Starten met Weebly... 3 1.1 Aanmelden / Inloggen... 3 1.2 Website aanmaken... 3 1.2.1 Eerste website... 3 1.2.2 Tweede website... 5 2 : basis... 6 2.1 Elementen op een pagina... 6 2.1.1

Nadere informatie

Eigen Widgets in CRM. Introductie. Limitering. Widgets beschikbaar stellen. Tips & Tricks Eigen Widgets in CRM

Eigen Widgets in CRM. Introductie. Limitering. Widgets beschikbaar stellen. Tips & Tricks Eigen Widgets in CRM Tips & Tricks Eigen Widgets in CRM Eigen Widgets in CRM Introductie De WebUI van CRM 7.0 maakt het mogelijk om je eigen widgets te maken en deze in je eigen view te gebruiken. Dat kan door gebruik te maken

Nadere informatie

Handleiding bij het Content Management Systeem

Handleiding bij het Content Management Systeem Handleiding bij het Content Management Systeem 1. Content Managent System startvenster 2. Hoe voeg ik een nieuwe gebruiker toe? 3. Hoe maak ik een hoofdmenu-item aan? 4. Hoe koppel ik tekst aan een hoofdmenu-item?

Nadere informatie

Algemene handleiding beheermodule: WORDPRESS. digital4u.nl effectief op internet

Algemene handleiding beheermodule: WORDPRESS. digital4u.nl effectief op internet Algemene handleiding beheermodule: WORDPRESS digital4u.nl effectief op internet Inhoudsopgave Algemene handleiding 03 04 04 05 05 06 06 07 07 08 09 11 12 13 15 16 17 Introductie Inloggen Dashboard Berichten

Nadere informatie

JOOMLA! GEBRUIKSVRIENDELIJKHEID IN DE PRAKTIJK. Tips en hulpmiddelen voor gebruiksvriendelijkheid

JOOMLA! GEBRUIKSVRIENDELIJKHEID IN DE PRAKTIJK. Tips en hulpmiddelen voor gebruiksvriendelijkheid JOOMLA! GEBRUIKSVRIENDELIJKHEID IN DE PRAKTIJK Tips en hulpmiddelen voor gebruiksvriendelijkheid JOOMLA! GEBRUIKSVRIENDELIJKHEID IN DE PRAKTIJK 10 tips om joomla gebruiksvriendelijker te maken Sander Potjer

Nadere informatie

3 Website opbouwen: vervolg

3 Website opbouwen: vervolg 3 Website opbouwen: vervolg 3.1 Elementen 3.1.1 Bestand Op je website kan je een bestand plaatsen (doc, pdf, ) dat door je bezoekers gedownload kan worden 3.1.2 Links. Zowel bij het typen van tekst (2.1.1)

Nadere informatie

Versie 0.6. Documentatie Onsweb Club plugin voor KNKV verenigingen. Laatste wijziging: 13 augustus 2013 Auteurs: Marien Dongstra, Sebastian Huisman

Versie 0.6. Documentatie Onsweb Club plugin voor KNKV verenigingen. Laatste wijziging: 13 augustus 2013 Auteurs: Marien Dongstra, Sebastian Huisman Documentatie Onsweb Club plugin voor KNKV verenigingen Versie 0.6 Laatste wijziging: 13 augustus 2013 Auteurs: Marien Dongstra, Sebastian Huisman Alle rechten in dit document zijn voorbehouden. www.onsweb.nl,

Nadere informatie

Voor vragen: http://www.richard3332.nl/ of mail naar Richard3332@gmail.com

Voor vragen: http://www.richard3332.nl/ of mail naar Richard3332@gmail.com Welkom bij mijn website tutorial (Deel 3) Ik ga uit van Microsoft XP voor de duidelijkheid. Ik heb dus geen idee of de programma s die ik gebruik ook op Vista werken. Notepad++ werkt zowieso op xp en Vista.

Nadere informatie

Inhoud. Installatie. Functies

Inhoud. Installatie. Functies Inhoud Installatie Functies Instellingen Achtergrond Blokken, knoppen Korting Footer Header, left column Main navigation Modules Price categories, Producten Text Contact 3 4 5 5 6 7 8 9 10 11 12 13 14

Nadere informatie

Trippeltrap Content Management System

Trippeltrap Content Management System Handleiding Trippeltrap Content Management System versie 2.4 Aanmelden Voordat u de tekst op uw webpagina kunt aanpassen, moet u zich eerst aanmelden. Bovenaan de pagina vindt u een link naar het intranet.

Nadere informatie

WordPress handleiding

WordPress handleiding Faculteit Geesteswetenschappen, Universiteit Utrecht WordPress handleiding Natalie Vijlbrief & Ellen Kluin 12 Inhoudsopgave Inleiding...3 Inloggen...3 Het Dashboard...4 De site opzetten...7 Elementen verwijderen...7

Nadere informatie

Quick Reference Guide Site beheer SharePoint TU Delft. Bestemd voor Key Users Versie 2.0 Datum 11-06-2012 Eigenaar SSC-ICT FAB SharePoint

Quick Reference Guide Site beheer SharePoint TU Delft. Bestemd voor Key Users Versie 2.0 Datum 11-06-2012 Eigenaar SSC-ICT FAB SharePoint Quick Reference Guide Site beheer SharePoint TU Delft Bestemd voor Key Users Versie 2.0 Datum 11-06-2012 Eigenaar SSC-ICT FAB SharePoint Quick Reference guide site beheer SharePoint TU Delft 1. Introductie

Nadere informatie

Hosting. Bestelformulier en domeinnaamcontrole. Januari, 2013. WeFact B.V. Kuiper 7a 5521 DG Eersel Nederland. w: www.wefact.nl e: helpdesk@wefact.

Hosting. Bestelformulier en domeinnaamcontrole. Januari, 2013. WeFact B.V. Kuiper 7a 5521 DG Eersel Nederland. w: www.wefact.nl e: helpdesk@wefact. Hosting Januari, 2013 Bestelformulier en domeinnaamcontrole WeFact B.V. Kuiper 7a 5521 DG Eersel Nederland w: www.wefact.nl e: helpdesk@wefact.nl Introductie Algemeen In deze handleiding wordt uitgelegd

Nadere informatie

Het dashboard bestaat daarnaast uit een aantal vensters. De vensters kun je bedienen met het knopje (rechtsboven)

Het dashboard bestaat daarnaast uit een aantal vensters. De vensters kun je bedienen met het knopje (rechtsboven) Handleiding Websites voor Fotografen INLOGGEN * HOE LOG IK IN? Type achter je domeinnaam wp admin (bv www.websitesvoorfotografen.nl/wp admin)je kunt nu de inloggegevens die je gekregen hebt invullen. *WAT

Nadere informatie

Hoe maak je een website voor de school en voor elke klas?

Hoe maak je een website voor de school en voor elke klas? Donderdag 12 september, ICT& Education Rianne Hellings, Kuki+Ko, www.kukiko.com, rianne@kukiko.com Hoe maak je een website voor de school en voor elke klas? Rianne Hellings, ex-apk docente en sinds 2005

Nadere informatie

Versie 0.4. Documentatie Onsweb Club plugin voor KNKV verenigingen. Laatste wijziging: 19 juli 2012 Auteurs: Marien Dongstra, Sebastian Huisman

Versie 0.4. Documentatie Onsweb Club plugin voor KNKV verenigingen. Laatste wijziging: 19 juli 2012 Auteurs: Marien Dongstra, Sebastian Huisman Documentatie Onsweb Club plugin voor KNKV verenigingen Versie 0.4 Laatste wijziging: 19 juli 2012 Auteurs: Marien Dongstra, Sebastian Huisman Alle rechten in dit document zijn voorbehouden. www.onsweb.nl,

Nadere informatie

De tekstverwerker. Afb. 1 de tekstverwerker

De tekstverwerker. Afb. 1 de tekstverwerker De tekstverwerker De tekstverwerker is een module die u bij het vullen van uw website veel zult gebruiken. Naast de module tekst maken onder andere de modules Aankondigingen en Events ook gebruik van de

Nadere informatie

Handleiding Joomla CMS

Handleiding Joomla CMS Handleiding Joomla CMS Inhoudsopgave Inloggen bij de beheeromgeving 3 Artikelen 4 Prullenbak bekijken 4 Nieuw artikel maken / bewerken 5 Afbeelding toevoegen aan artikel 6 Link in een artikel plaatsen

Nadere informatie

Inhalen les 7 (versie B)

Inhalen les 7 (versie B) Inhalen les 7 (versie B) Stap 1: Open de startmap van les 6 De map heet Startmap Les 6. Als je de map hebt geöpend zie je verschillende bestanden en een map Website. Wij gebruiken nu alleen de map Website.

Nadere informatie

Digitale vormgeving 2014 2015. Wordpress deel 1

Digitale vormgeving 2014 2015. Wordpress deel 1 Digitale vormgeving 2014 2015 Wordpress deel 1 2 Inhoud Site in WordPress... 3 Maak een eigen site in WordPress.com.... 3 Wordpressaccount aanmaken... 4 Opdracht 1... 4 Thema kiezen... 6 Opdracht 2...

Nadere informatie

1. Open het programma KompoZer Het grote witte vlak is een nog lege webpagina. Deze gaan we nu van inhoud voorzien.

1. Open het programma KompoZer Het grote witte vlak is een nog lege webpagina. Deze gaan we nu van inhoud voorzien. Minicursus KompoZer In deze cursus ga je leren werken met het computerprogramma KompoZer. Stapsgewijs maak je een voorbeeldsite. Daarna kun je alles wat je geleerd hebt gebruiken om je eigen website te

Nadere informatie

WORDPRESS. op de FourBottles manier. Pagina 1

WORDPRESS. op de FourBottles manier. Pagina 1 WORDPRESS op de FourBottles manier Pagina 1 Fijn dat je voor FourBottles hebt gekozen voor het realiseren van je website. Bij een website hoort natuurlijk een Content Management Systeem (CMS). Ik maak

Nadere informatie

Handleiding Webwinkel

Handleiding Webwinkel Handleiding Webwinkel Inhoudsopgave Login... 2 Instellingen aanpassen... 3 Pagina beheer... 6 Producten beheer... 13 Bestellingen beheer... 18 Betalingen beheer... 21 Vervoerders beheer... 23 Bestands

Nadere informatie

Handleiding ESS na de upgrade People Inc. versie 3.5.0

Handleiding ESS na de upgrade People Inc. versie 3.5.0 Handleiding ESS na de upgrade People Inc. versie 3.5.0 I Handleiding ESS na de upgrade People Inc. versie 3.5.0 Inhoudsopgave Hoofdstuk 1 1 1.1 ESS... Iconen selecteren 1 1.2 ESS... Inlog scherm tekst

Nadere informatie

Foto web applicatie documentatie

Foto web applicatie documentatie Foto web applicatie documentatie Marijn Stuyfzand M31T PHP31 David Schol 1 Inhoudsopgave APPLICATIESTRUCTUUR MAPPENSTRUCTUUR FUNCTIONALITEITSSTRUCTUUR DE BASIS VOOR ELKE PAGINA DATABASE SERVER- SIDE EN

Nadere informatie

Een website omzetten naar WordPress

Een website omzetten naar WordPress 1 Een website omzetten naar WordPress Er zijn talloze programma s beschikbaar om websites te maken. In de titels Basisgids Websites maken met WordPress en Websites maken met WordPress voor senioren wordt

Nadere informatie

REDACTEUREN HANDLEIDING

REDACTEUREN HANDLEIDING V1.2 8/5/2009 Vertaling: John Sim 2 Inhoudsopgave De inhoud van een document bewerken... 11 Een nieuwe document aanmaken... 12 Het aanmaken van een nieuwe document gaat als volgt:... 12 Een pagina publiceren...

Nadere informatie

Handleiding. Berichten maken in WordPress. juni 2013

Handleiding. Berichten maken in WordPress. juni 2013 Handleiding Berichten maken in WordPress juni 0 Inloggen. Ga naar: www.jouwdomeinnaam.nl/wp-admin. Log hier in met je gebruiksnaam en je wachtwoord. Het dashboard Na het inloggen krijg je eerst het Dashboard

Nadere informatie

CMS Template Handleiding

CMS Template Handleiding CMS Template Handleiding Inhoudsopgave Inloggen in het CMS... 3 Pagina s toevoegen... 4 Pagina s bewerken... 6 Een link toevoegen... 7 Een afbeelding toevoegen... 9 Foto s plaatsen op de fotopagina...

Nadere informatie

Inhoudsopgave. Inloggen in beheermodule. Sidebar/Footer 8.2. Dashboard. Widgets toevoegen aan sidebar. Berichten 8.3. Tekst widget. Nieuwsbrief module

Inhoudsopgave. Inloggen in beheermodule. Sidebar/Footer 8.2. Dashboard. Widgets toevoegen aan sidebar. Berichten 8.3. Tekst widget. Nieuwsbrief module Via de Beheermodule genaamd Wordpress kunt u zelf uw website bewerken, updaten en volledig naar wens stijlen. In deze Algemene handleiding leest u alles over de functies die wij als Digiwebsite met de

Nadere informatie

Handleiding wordpress

Handleiding wordpress Handleiding wordpress Wordpress versie 3.0.4 Handleiding versie 1.1 Auteur Website Geert Hoekzema www.geerthoekzema.nl www.geerthoekzema.nl geert@geerthoekzema.nl 1 Inhoudsopgave Inleiding... 3 Beginnen

Nadere informatie

WordPress in het Kort

WordPress in het Kort WordPress in het Kort Een website maken met Wordpress. In minder dan één uur online! Inclusief installatie van een thema en plugins Alle rechten 2013, Rudy Brinkman, BrinkhostDotCom, http://www.brinkhost.nl

Nadere informatie

Website met Wordpress

Website met Wordpress Website met Wordpress 5. Tabellen Onderwerpen van deze les: Editor Tiny MCE toevoegen Tabellen maken met TinyMCE WP-Table reloaded installeren en gebruiken Excel importeren in WP-Table reloaded Content

Nadere informatie

WORDPRESS HET ONTWIKKELEN VAN PAGINA S VOOR INTERNET EN/OF INTRANET DIGITALE VORMGEVING FONS GOOSEN MARKETING & COMMUNICATIE - DIGITALE VORMGEVING

WORDPRESS HET ONTWIKKELEN VAN PAGINA S VOOR INTERNET EN/OF INTRANET DIGITALE VORMGEVING FONS GOOSEN MARKETING & COMMUNICATIE - DIGITALE VORMGEVING WORDPRESS HET ONTWIKKELEN VAN PAGINA S VOOR INTERNET EN/OF INTRANET DIGITALE VORMGEVING FONS GOOSEN MARKETING & COMMUNICATIE - DIGITALE VORMGEVING 1 Voorwoord WordPress We hebben gekozen voor het maken

Nadere informatie

IMPACTS SITES BEZOOM V2.1 GEBRUIKSAANWIJZING

IMPACTS SITES BEZOOM V2.1 GEBRUIKSAANWIJZING INHOUD I. LOGIN IMPACTS SITES BEZOOM V2.1 GEBRUIKSAANWIJZING II. BEHEER UW WEBSITE 1. ONDERWERP A. Informatie B. Contactpersoon C. Links D. Footer E. Favicon 2. CMS A. Toevoegen (een pagina) B. SEO 3.

Nadere informatie

Copyright FRONTBONE 2009, alle rechten voorbehouden +31 (0)20 470 76 98 info@frontbone.com

Copyright FRONTBONE 2009, alle rechten voorbehouden +31 (0)20 470 76 98 info@frontbone.com FRONTBONE stelt jou in staat je eigen werkwijze te hanteren. Deze inleiding is bedoelt om je zo snel mogelijk op weg te helpen. Wanneer je de basisprincipes van het systeem doorhebt, kun je de rest zelf

Nadere informatie

Bitrix Site Manager gebruikershandleiding BureauZuid

Bitrix Site Manager gebruikershandleiding BureauZuid Bitrix Site Manager gebruikershandleiding BureauZuid Introductie Deze gebruikershandleiding geeft gedetailleerde basisinformatie over hoe te werken met Bitrix Site Manager. Deze handleiding is bedoeld

Nadere informatie

Auteur : MM-Pro Datum : 09-02-09 Versie : 0.1.5. Handleiding Beheer Standaard Website

Auteur : MM-Pro Datum : 09-02-09 Versie : 0.1.5. Handleiding Beheer Standaard Website Auteur : MM-Pro Datum : 09-02-09 Versie : 0.1.5 Handleiding Beheer Standaard Versie Datum Opmerkingen 0.1.2 29-01-09 Note opgenomen op pagina 7 over subpagina's en weergave in menu structuur. 0.1.3 02-02-09

Nadere informatie

Handleiding om uw website/webshop aan te passen

Handleiding om uw website/webshop aan te passen Handleiding om uw website/webshop aan te passen ONDERWERP PAGINA 1. Hoe moet ik inloggen in het beheer? 2 2. Hoe pas ik een bestaande pagina aan? 2 3. Hoe plaats ik een afbeelding? 3 4. Hoe maak ik een

Nadere informatie

Handleiding - Styling van OFB Web 4.0

Handleiding - Styling van OFB Web 4.0 Handleiding - Styling van OFB Web 4.0 Versie: 1.0 Inleiding OFB Web is opgebouwd uit controls. De plaatsing en positionering van de controls wordt vastgelegd in de page.aspx. Dit bestand kan gezien worden

Nadere informatie

Gebruikershandleiding www.kerknigtevecht.nl. Inleiding

Gebruikershandleiding www.kerknigtevecht.nl. Inleiding Inleiding Het beheren van de pagina s op www.kerknigtevecht.nl wordt gedaan door daartoe geautoriseerde gebruikers. Deze handleiding helpt je op weg hoe je je eigen pagina s kunt beheren, zoals het plaatsen

Nadere informatie

Websitecheck. Taak en Tekst voor websites die werken. www.jouwsite.nl

Websitecheck. Taak en Tekst voor websites die werken. www.jouwsite.nl Taak en Tekst voor websites die werken www.jouwsite.nl Websitecheck Taak en Tekst, www.taakentekst.nl Buijs Ballotstraat 27A, 2563 ZH Den Haag 06-13935470 1 Websitecheck Website: Eigenaar: Datum: www.jouwsite.nl

Nadere informatie

CMS HANDLEIDING WWW.INONZEBIEB.NL

CMS HANDLEIDING WWW.INONZEBIEB.NL CMS HANDLEIDING WWW.INONZEBIEB.NL 1. INLOGGEN IN CMS... 2 2. DASHBOARD... 2 3. SITE STRUCTUUR... 2 4. HOMEPAGE... 2 5. EEN POST TOEVOEGEN... 3 6. EEN PAGINA TOEVOEGEN... 4 7. ALGEMENE UITLEG WORDPRESS

Nadere informatie

Welkom in de wondere wereld van websites met WordPress.

Welkom in de wondere wereld van websites met WordPress. Welkom in de wondere wereld van websites met WordPress. Alsjeblieft, dit kleine WordPress woordenboekje is voor jou. Want als je voor het eerst een website met WordPress gaat maken kom je misschien woorden

Nadere informatie

Handleiding Wordpress

Handleiding Wordpress Handleiding Wordpress V 1.0 Door Inhoud Inloggen op de website... 3 Het Dashboard... 4 Berichten... 5 Berichten aanmaken... 5 Berichten bewerken... 6 Pagina's... 7 Pagina's aanmaken... 7 Pagina's bewerken...

Nadere informatie

Uw eigen tekst en foto s op uw site bijhouden

Uw eigen tekst en foto s op uw site bijhouden Uw eigen tekst en foto s op uw site bijhouden Voorbereiding U heeft een cd ontvangen met een aantal bestanden erop. O.a. de website, dreamweaver en 2 tekstbestanden genaamd s/n en inloggegevens. De website

Nadere informatie

Web Presence Builder. Inhoud

Web Presence Builder. Inhoud Web Presence Builder Inhoud Inhoud... 1 Wat is Web Presence Builder?... 2 Het categoriescherm... 2 De eerste stappen naar een eigen website... 3 Onderwerp selecteren en website naam aanpassen... 3 Vooraf

Nadere informatie

Inhoudsopgave pag. 2

Inhoudsopgave pag. 2 www.hofdesign.nl 1 Inhoudsopgave pag. 2 Sblog: Beheerdersmenu pag. 3 Sblog: Berichten plaatsen pag. 4 Sblog: Berichten plaatsen (vervolg) pag. 5 Sblog: Afbeeldingen pag. 6 Sblog: Afbeeldingen (vervolg)

Nadere informatie

Om in te loggen in het CMS (Content Management Systeem) gaat u naar http://domeinnaam.nl/admin Hier ziet u het inlogscherm:

Om in te loggen in het CMS (Content Management Systeem) gaat u naar http://domeinnaam.nl/admin Hier ziet u het inlogscherm: CMS Handleiding Inhoudsopgave Inloggen in het CMS... 3 Pagina s toevoegen... 4 Pagina s bewerken... 7 Een link toevoegen... 8 Een afbeelding toevoegen... 10 Foto s plaatsen op de fotopagina... 12 Media...

Nadere informatie

Central Station. CS website

Central Station. CS website Central Station CS website Versie 1.0 18-05-2007 Inhoud Inleiding...3 1 De website...4 2 Het content management systeem...5 2.1 Inloggen in het CMS... 5 2.2 Boomstructuur... 5 2.3 Maptypen... 6 2.4 Aanmaken

Nadere informatie

WORDPRESS HANDLEIDING CUDOK CONCEPTS & CONSULTANCY

WORDPRESS HANDLEIDING CUDOK CONCEPTS & CONSULTANCY WORDPRESS HANDLEIDING CUDOK CONCEPTS & CONSULTANCY 4 APRIL 2015 INTRODUCTIE Een WordPress website bestaat onder anderen uit de volgende onderdelen: Berichten Pagina s Producten Categorieën Menu s Al deze

Nadere informatie

www.wphandleiding.nl 1

www.wphandleiding.nl 1 www.wphandleiding.nl 1 Introductie Met het populaire en gebruiksvriendelijke WordPress als CMS is het eenvoudig alle aspecten van een website te beheren. Vanwege die hoeveelheid aan mogelijkheden is het

Nadere informatie

Je kan vanuit de RV SiteBuilder steeds terugkeren naar het controlepaneel, via de knop rechts bovenaan.

Je kan vanuit de RV SiteBuilder steeds terugkeren naar het controlepaneel, via de knop rechts bovenaan. RV SiteBuilder openen Log in op je controlepaneel met de gegevens die je van ons hebt ontvangen. Eens ingelogd, klik je helemaal onderaan, in de sectie Software/Services, op het RV SiteBuilder icoontje.

Nadere informatie

Handleiding Lay-outs bewerken voor LogiVert 5

Handleiding Lay-outs bewerken voor LogiVert 5 Hoofdstuk: Inleiding Handleiding Lay-outs bewerken voor LogiVert 5 Copyrights : 20 LogiVert BV Website : www.logivert.com V.0.3 5-5-2009 Toevoegingen aan stap voor stap V.0.2 9-4-2009 Tweede opzet V. 0.

Nadere informatie