Courbois Software WebDesignEditor. Versie

Transcriptie

1 Courbois Software WebDesignEditor Versie November Courbois Software Beuningen Fazantlaan 63, 6641 XW Beuningen. & info@cs-webdesign.nl

2 Inhoudsopgave De WebDesignEditor Starten van de CS-WebDesignEditor. 005 De opbouw van de site Hoe zit de site in elkaar. 006 De Editor: De Producten Editor Invoeren en aanpassen van de artikelen in de winkel. (1) 007 De UpLoad Editor Foto s opladen naar de site voor gebruik aldaar. 012 De Nieuws Editor Het laatste nieuws. 014 De Pagina Editor De pagina indeling van de site. 016 De Pagina Templates Het uiterlijk van een pagina. 020 De Boxen Editor De Boxen definities van de site 022 De Kolommen Editor Invoeren en aanpassen van de kolommen. 026 De Menu Editor Invoeren en aanpassen van menu s. 027 De BackUp Maker Maak een veiligheids back-up van de site gegevens. 030 De Winkel Menu Editor De indeling van de categorieën van de winkel. (1) 031 De Systeem Editor De systeem gegevens voor de site. 034 Starten van de site Ga naar de site toe. 041 De WYSIWYG Editor De tekstverwerker van de editor. 042 Uw E Mail: Mail adressen De mail adressen op uw eigen site 047 Instellen Outlook Instellen Outlook voor de Sit 048 Instellen Incredimail Instellen Incredimail voor de Sit 052 De voorgeprogrammeerde Boxen: WW-Boxen Wat zijn WW-Boxen. : 060 WW-Aanbiedingen Toon de aanbiedingen van de site. (1) 063 WW-ANWB Toon een ANWB routeoverzicht naar de zaak. 064 WW-BingSearch Zoeken met Bing van Microsoft. 065 WW-Blank Druk een lege regel af. 066 WW-BookMark Laat de bezoeker een Bookmark van de site maken. 067 WW-ContactForm Het Contact Formulier. 068 WW-DealerPass Laat een handelaar een code invoeren. (1) 070 WW-Fotos Laat een pagina met foto s zien. 071 WW-GallerijContainer1 Laat een pagina met foto s zien. Met vergroting. 072 WW-GallerijContainer2 Laat een pagina met foto s zien. Met vergroting. 073 WW-GameBox Laat de bezoeker een willekeurig spel spelen, 074 WW-GetKlantenKoekje Lees de gegevens van een klant uit een COOKIE. 075 WW-GoogleSearch Zoeken met Google. 076 WW-iDealLogo Toon een ideal Logo als de winkelwagen vol is. (1) 077 WW-iLocal Een kaart met de locatie van het bedrijf. 078 WW-KlokBox Toon een Klok op de site. 079 WW-KolomBox Omranding om een tekst. CLONE Box. 081 WW-Line Druk een lijn af in een gekozen kleur. 082 WW-MemoBord Een memobord, Hier kunnen bezoekers op schrijven. 083 WW-NieuwProduct Laat alle nieuwe artikelen zien in een lijst. (1) CS-WebDesign & Courbois Software 2

3 WW-NieuwsBlok Toon de laatste nieuwe nieuws items. 085 WW-NieuwsBrief Aan- en Af- melden voor een nieuwsbrief. 086 WW-NieuwsTonen Toon het nieuws van het NieuwsBlok. 087 WW-Page2PDF Zet een WebSite pagina om in een PDF file. 088 WW-PrintButton Een knop om de pagina af te drukken. 089 WW-ProductHeader Toon de naam van de actuele categorie. (1) 090 WW-ProductInfo01 Toon informatie over 1 product. 1 Foto. (1) 091 WW-productInfo02 Toon informatie over 1 product. 1 Foto met slider. (1) 092 WW-ProductInfo03 Toon informatie over 1 product. 3 Foto s met slider. (1) 093 WW-ProductLijst01 Laat artikelen in 1 categorie zien. 3 Naast elkaar. (1) 094 WW-ProductLijst02 Laat artikelen in 1 categorie zien. 2 Naast elkaar. (1) 095 WW-ProductLijst03 Laat artikelen in 1 categorie zien. 3 Naast elkaar. (1) 096 WW-ProductLijst04 Laat artikelen in 1 categorie zien. 5 Naast elkaar. (1) 097 WW-ProductLijst05 Laat artikelen in 1 categorie zien. 1 Naast elkaar. (1) 098 WW-ProductMenu01 Toon de categorieën van de winkel. (1) 099 WW-ProductMenu02 Toon de categorieën van de winkel. Linker kolom. (1) 100 WW-ProductMenu03 Toon de categorieën van de winkel. Rechter kolom. (1) 101 WW-ProductMenu04 Toon de categorieën van de winkel. (1) 102 WW-ProductMenu05 Toon de categorieën van de winkel. (1) 103 WW-ProductMenuC01 Toon de categorieën van de winkel. Cascade Menu. (1) 104 WW-ProductMenuC02 Toon de categorieën van de winkel. Cascade Menu. (1) 105 WW-ProductMenuC03 Toon de categorieën van de winkel. Cascade Menu. (1) 106 WW-ReklameBox01 Laat een aantal advertenties zien 1/3 Kolom. (1) 107 WW-ReklameBox02 Laat een aantal advertenties zien 1/2 Kolom. (1) 108 WW-ReklameBox02A Laat een aantal advertenties zien 1/2 Kolom. DATABox. (1) 109 WW-ReklameBox03 Laat een aantal advertenties zien 1/1 Kolom. Stock. (1) 110 WW-ReklameBox04 Laat een aantal advertenties zien 1/1 Kolom. (1) 111 WW-ReklameBox05 Laat een aantal advertenties zien Zij Kolom. DATABox. (1) 112 WW-ShowFlash Laat een Flash Animatie zien. Ook random uit DATABox. 113 WW-SideMenu01 Een keuzemenu voor in een zijkolom. 114 WW-SideMenu02 Een keuzemenu voor in een zijkolom. Linker kolom. 115 WW-SideMenu03 Een keuzemenu voor in een zijkolom. Rechter kolom. 116 WW-SideMenu04 Een keuzemenu voor in een zijkolom. 117 WW-SideMenu05 Een keuzemenu voor in een zijkolom. 118 WW-SideMeniC01 Een keuzemenu voor in een zijkolom. Cascade menu. 119 WW-SideMeniC02 Een keuzemenu voor in een zijkolom. Cascade menu. 120 WW-SideMeniC03 Een keuzemenu voor in een zijkolom. Cascade menu. 121 WW-Slider Een slideshow met banners. 122 WW-SlideShow01 Een fade-in fade-out slideshow. 123 WW-SlideShow02 Een loopband slideshow. 124 WW-SpeciaalFonts Initialiseer een 4-tal speciaal gemaakte karaktersets. 125 WW-SpeciaalTekst Tekst in een speciaal gemaakte karakterset. CLONEBox. 127 WW-StockAlert Geef een alarmtekst als iets uitverkocht is. (1) 129 WW-StockAlertZenden Stuur de Stock alert naar de site eigenaar. (1) 130 WW-Taalkeuze Kies een taal (Nederlands Engels - Duits). 131 WW-ToonPicDir Toon een hele folder met plaatjes in 1 keer. 132 WW-TopMenu01 Een keuzemenu bovenaan de pagina. 133 WW-TopMenu02 Een keuzemenu bovenaan de pagina. 134 WW-TopMenu03 Een keuzemenu bovenaan de pagina. 135 WW-TopMenu04 Een keuzemenu bovenaan de pagina. 136 WW-Vergroot Vergroot de hele pagina met een aantal procenten. 137 WW-WinkelAdres Vraag de adresgegevens van een Klant. (1) CS-WebDesign & Courbois Software 3

4 WW-WinkelBekijken1 Bekijk de winkelinhoud. (1) 139 WW-WinkelBekijken2 Bekijk de winkelinhoud. KolomBox uiterlijk. (1) 140 WW-WinkelBetaal De uiteindelijke kassa die alles verstuurd. Geen ideal. (1) 141 WW-WinkelBetaalMSP De uiteindelijke kassa die alles verstuurd. MultiSafePay. (1) 142 WW-WinkelBetaalRabo De uiteindelijke kassa die alles verstuurd. Rabo. (1) 143 WW-WinkelInfo Knop om naar de winkel informatie te gaan. (1) 144 WW-WinkelKassa Knop om naar de kassa te gaan. (1) 145 WW-WinkelLeeg Knop om de winkel leeg te maken. (1) 146 WW-WinkelOverzicht1 Knop om naar het winkeloverzicht te gaan. (1) 147 WW-WinkelOverzicht2 Knop om naar het winkeloverzicht te gaan. KolomBox. (1) 148 WW-WinkelOverzicht3 Knop om naar het winkeloverzicht te gaan. HeaderBox. (1) 149 WW-YouTubeHori YouTube filmpjes. Horizontale balk. 150 WW-YouTubeVert YouTube filmpjes. Vertikale balk. 151 WW-ZendDealerMail Stuur een bericht aan een dealer. (1) 152 WW-ZendMail Stuur een bericht van het ContactFormulier. 153 WW-ZendNieuwsBrief Stuur een bericht over de Nieuwsbrief. 154 WW-ZoekBox Zoeken op de site. 155 WW-ZoekResultaatArt Resultaat van zoeken in de producten. (1) 156 WW-ZoekResultaatLin Resultaat van zoeken op de site. 157 ZZ- Boxen Wat zijn ZZ-Boxen. 158 ZZ-404 Pagina bestaat niet tekst. 159 ZZ-ContactFormTekst Tik een vraag in tekst. 160 ZZ-iDealCancel ideal is afgebroken tekst. (1) 161 ZZ-iDealError ideal is mislukt tekst. (1) 162 ZZ-iDealSucces ideal is gelukt tekst. (1) 163 ZZ-NieuwsBriefReply Bevestiging aan of afmelden van de nieuwsbrief tekst. 164 ZZ-WinkelLeeg Winkelwagen is leeg tekst. (1) 165 ZZ-WinkelLeeg2 Winkelwagen is leeg tekst. (1) 166 ZZ-WinkelWagenInfo Informatie over de winkelwagen tekst. (1) 167 ZZ-ZendMail Bericht is verzonden tekst. 168 DATABoxen Wat zijn DATABoxen. 169 DATABox Aanbiedingen Lijst met aanbiedingen voor WW-ReklameBox05. (1) 170 DATABox BannerSlide Lijst met banners voor WW-Slider. 171 DATABox FlashBox Lijst met Flash Animaties voor WW-ShowFlash. 172 DATABox FlashFonts Lijst met karaktersets voor WW-SpeciaalTekst. 173 DATABox GoogleFonts Lijst met karaktersets voor WW-GoogleFonts. 175 DATABox IndexAanbiedingen Lijst met aanbiedingen voor WW-ReklameBox02A. (1) 177 DATABox SlidePics Lijst met foto s voor WW-SlideShow DATABox SysteemBox01 Lijst met systeem teksten. 179 DATABox WoordenLijst Lijst met woorden voor WW-ContactForm. 180 Extra s: Kleurnamen De namen van de toegestane kleuren. 181 De Database opbouw De MySQL Database 183 Updates x Wat is nieuw in WebDesignEditor x? 198 (1) Alleen voor WebWinkels beschikbaar CS-WebDesign & Courbois Software 4

5 WebDesignEditor De WebDesignEditor is het programma waarmee u zelf uw site kunt onderhouden, nieuwe pagina s aanmaken, foto s toevoegen, artikelen toevoegen en aanpassen en nog veel meer. U heeft geen kennis van HTML of PHP nodig om uw site aan te passen. De WebDesignEditor bestaat uit een aantal programma s die op uw site staan. Daardoor heeft u vanaf elke computer, waar ook ter wereld, toegang tot de editor als u de naam en toegangscode maar weet. De WebDesignEditor is zelf een Webprogramma en werkt in uw browser. De URL van de editor is: Deze heeft u van ons gekregen voor uw site Daarbij moet u natuurlijk uw eigen site naam invullen bij UwSite en uw eigen toegangscode bij toegangscode. HOOFDLETTERS ZIJN BELANGRIJK! Op het scherm dat u nu te zien krijgt kunt u kiezen tussen de verschillende programma s in de editor. Als u niet gekozen heeft voor een winkel zijn verschillende onderdelen niet zichtbaar en niet te kiezen CS-WebDesign & Courbois Software 5

6 Opbouw van de site Voor dat u start met het aanpassen van pagina s en menu s moet u iets weten over de opbouw van de WebSite/Winkel. Deze heeft namelijk een speciale structuur. De site is module georiënteerd. Ik noem deze modules in de rest van deze tekst BOXEN. Een pagina is opgebouwd uit een aantal boxen die elk een stuk van de site laat zien aan de bezoeker op internet. Een pagina heeft een bepaald Template, omlijning, waarin de boxen getoond worden. Een 2-tal voorbeelden zijn: Een linkerkolom, 10 boxen in het midden en een rechter kolom. En ook de kolommen bestaan uit een tiental boxen die helemaal gelijk zijn aan de boxen in het midden, alleen smaller. Een box kan wel of geen inhoud hebben, alle 10 zijn dus niet nodig. Elke box kan bestaan uit een tekst die getoond wordt, maar het kunnen ook programma s zijn die iets speciaals doen. Dat speciale resulteert weer in een uitvoer op het scherm. De site wordt dus bepaald door de inhoud van de boxen, in de Box Editor bepaalt u dus wat er op het scherm komt te staan. Daar past u teksten aan. De Pagina- en Kolom- Editor bepalen het uiterlijk, hoe en welke boxen op het scherm komen te staan. Er zijn veel meer dan deze 2 templates. Lees daar meer over bij de pagina editor op pagina 20. Lees met dit in gedachte verder in deze handleiding CS-WebDesign & Courbois Software 6

7 Producten Editor Dit is de Producten Editor of Artikelen Editor. In dit gedeelte kunt u de artikelen van uw WebWinkel invoeren en bijhouden. Dit is de menubalk van deze editor. U kunt hier 3 keuzes maken. Automatisch wordt de eerste gekozen. U ziet aan de linker kant een overzicht van de verschillende categorieën van uw winkel. Hier de winkel van ComputerShopNederland.nl De structuur daarvan maakt u in de WinkelMenu Editor (zie later) Door op een keuze te tikken krijgt u een overzicht te zien van die categorie van artikelen. Dat kan er uit zien zoals hier onder. De knop spreekt voor zich. Hiermee kunt u artikelen wissen uit de Winkel. U moet dat nog wel even bevestigen. En na het wissen is het nog niet helemaal weg. In het 2 e menu (Deleted Overzicht) kunt u ze nog terug vinden. Pas als u ze daar weghaalt zijn ze werkelijk weg. Daar vind u ook de knop om ze weer toe te voegen op dezelfde plaats. Maar de knop is de belangrijkste in dit overzicht. Tikt u dat aan dan kunt u een product aanpassen. Het scherm is gelijk aan de keuze Producten Editor in de menubalk, alleen zijn de velden niet leeg. Het plaatje staat op de volgende pagina, het is te lang voor de ruimte op deze pagina. Eerst even iets over de producten. Deze worden bijgehouden in een database op de site. Om een product te vinden moet de database naar iets kunnen zoeken. En dat dis in ons geval het ProductNummer. Een UNIEK nummer dat een product aanwijst. UNIEK wil zeggen, als u het zelfde nummer 2 keer gebruikt is het oude product HELEMAAL VERDWENEN. Pas daar dus mee op. Om u iets te helpen kunt u, als u een NIEUW product invoert (alle velden zijn nog leeg) rechts boven het ProductNummer invoeren en kiezen voor ZOEKEN. Als het ProductNummer al bestaat krijgt u de gegevens daarvan te zien. Zo kunt u snel zien of een ProductNummer al aanwezig is in de database. Doe dat bij twijfel, zo voorkomt u dat spullen verdwijnen CS-WebDesign & Courbois Software 7

8 Dit is het scherm van een reeds ingevuld product. Laten we dat maar eens gaan bekijken. Product Nummer Dat UNIEKE nummer (mag ook letters bevatten) dat het product aangeeft. Ik heb hier b.v. gekozen voor SWEEX-MI159. Het merk van dit product is Sweex en het nummer dat Sweex er aan gegeven heeft is MI159, er is dus geen vergissing mogelijk met zo n soort nummer. Product Naam Merk Type Dit is de naam van het product waaronder het op de site te zien is. Een heel beknopte omschrijving dus. Deze hoeft niet uniek te zijn. Ik heb b.v. verschillende Optische Muizen in mijn winkel. Een optioneel veld. Hier kunt u het merk van het artikel invoeren. Dit is belangrijk. Hier staan de verschillende categorieën van de WebWinkel. Kies uit de lijst de categorie van het product. Onder die categorie is het dan later in de winkel te vinden. Elk product kan maar in 1 categorie staan! Daarom de volgende tip: CS-WebDesign & Courbois Software 8

9 Voer het artikel geheel in in 1 categorie. Daarna verander het ProductNummer door er b.v. een b achter te zetten. Het is dan een ander artikel met dezelfde gegevens (ook plaatjes). Verander het Type in een ander en het product staat er 2 keer in. Upload Plaatje 1 Upload Plaatje 2 Upload Plaatje 3 Met deze functie voegt u een foto toe aan het product. Tik op de knop Bladeren en u kunt de foto op uw eigen computer opzoeken. Tik op de foto en kies laden. De naam van de foto komt in het vakje voor bladeren te staan. Straks stuurt de editor de foto naar de site toe. Een aantal winkel routines kunnen meerdere foto s van 1 product laten zien. Als u daar gebruik van maakt dan moet u hier op de zelfde manier een 2 e foto toevoegen. Zie de vorige regels voor als u een 3 e foto wilt laten zien. 3 Is nu het maximum. Routines die geen 2 e of 3 e foto gebruiken laten deze ook niet zien. Heeft u meer dan 1 foto, voer ze gerust in. Prijs Site Prijs Handels Prijs Verzendkosten De prijs van het product. Dit is de normale prijs voor zowel uw winkel als de site. Voer deze in met een. (punt) en NIET, (komma) omdat de computer nu eenmaal zo rekent. Dit is een speciale prijs van het product. Een aanbiedingsprijs of een speciale prijs voor de WebWinkel. Als u hier niets in voert dan wordt dat straks automatisch De WebWinkel weet dan dat er geen speciale aanbieding is. Maar als u er wel een bedrag neer zet dan zal de WebWinkel iets zeggen als : Van nu voor Dit werkt net zoals de Site Prijs, alleen wordt dit bedrag alleen getoond als de bezoeker als handelaar is ingelogd. Het zijn speciale prijzen voor handelaren. Geen dealers? Dan niets invullen. Bij het invoeren van nieuwe producten staat hier al automatisch de afgesproken verzendkosten. U kunt die per artikel aanpassen om zo voor een bepaald product minder porto te vragen (als het b.v. door de brievenbus past). Bij bestellingen telt de site alle verzendkosten bij elkaar op tot het maximaal afgesproken bedrag. Bus Optie Ja of Nee. Ik gebruik dit zelf om een korting te geven op een product dat normaal niet, maar zonder verpakking wel, door de brievenbus past. Den aan een geheugenstick met een doosje er om heen. Haal je dat doosje er vanaf, dan past het makkelijk door de brievenbus en hoef je geen pakketkosten te rekenen. Geen interesse daarin? Verander niets. Het staat standaard op NEE. Voorraad Dit is belangrijk bij een paar manieren waarop de winkel de producten kan laten zien. Een routine die er MET VOORRAADVLAG is, is er ook zonder. U kunt kiezen uit Ja, in voorraad. Nee, niet in voorraad, 1W, leverbaar binnen 1 week. Skip, langere levertijd. En Gratis, dit artikel kost niets (folders, kado s) CS-WebDesign & Courbois Software 9

10 Hier moet u even bij stil staan. Als u daar gebruik van wil gaan maken moet u zich realiseren dat dat betekend dat u dat moet bijhouden. D.w.z. als een product uitverkocht is, moet u dat aanpassen op de site. Het zelfde geld als een product weer in voorraad is. Dit kost VEEL WERK! Speciaal Datum Info regel 1 Dit zijn 2 vlaggen die u wel of niet kunt gebruiken. Ook hier geldt dat u het moet bijhouden. De vlag Nieuw Product laat dit artikel zien als de bezoeker om de nieuwste producten vraagt. De vlag Aanbieding laat dit artikel zien als de bezoeker naar aanbiedingen vraagt. Meestal hebben die artikelen ook een speciale Site Prijs. Dit is voor de Nieuw product vlag hier boven. Bij het invoeren van de producten staat die op de datum van die dag. U mag dat aanpassen. Bij het bekijken van de nieuwste producten staat het product met de nieuwste datum bovenaan. Dit is een korte mededeling over het product in 25 tot 30 tekens. Het geeft een verduidelijking van het product, geen complete informatie. U heeft daar 3 lijnen voor. Niet alle winkelroutines maken er gebruik van. En doen ze dat wel en u vult niets in dan blijft er een lege regel. Denk aan zo iets als : Ook in rood verkrijgbaar of : OP=OP artikel. Info Regel 2 Net zoals regel 1. Info Regel 3 Net zoals regel 1. WinkelKeuze 1 Dit zorgt er voor dat de klant een onder keuze kan maken bij een product. Denk daarbij aan een product dat u in verschillende kleuren of maten verkoopt. De klant krijgt een vakje te zien met de vraag een keuze te maken. Deze keuze mogelijkheden geeft u achter deze regel in. Er zijn 3 verschillende mogelijk, maar niet alle winkelpresentaties hebben plaats voor 3. Beperk het zo veel mogelijk tot 1 of 2. Bij Naam tikt u de soort onderverdeling in. B.v. Kleur of Maat. Bij 1, 2, 3. Tikt u de waarden daarvan in, b.v. Rood, Groen, Wit. Of M, L, XL. WinkelKeuze 2 Net zoals 1. WinkelKeuze 3 Net zoals 1. Belangrijk is dat er slechts 1 prijs aan zit. Alle varianten moeten dus dezelfde prijs hebben. Informatie Dit is het laatste vlak. Daar kunt u meer informatie, in de vorm van tekst of foto f, geven over het product. Als u hier iets in vult en de presentatieroutine van de winkel heeft een knop, dan, als de klant er op drukt, krijgt hij deze informatie te zien inclusief de eventuele meerdere foto s. Staat er niets, dan verschijnt de knop niet. En niet alle presentatieroutines hebben de mogelijkheid voor die knop CS-WebDesign & Courbois Software 10

11 Het invoeren van de tekst is iets wat ook bij de Boxen Editor gebeurd en staat daarom apart beschreven in deze handleiding. Kijk daarvoor bij het hoofdstuk WYSIWYG Editor op pagina 42. Nu nog 1 HEEL BELANGRIJKE knop, namelijk. Als u klaar bent met het invoeren van het product moet u op deze knop tikken. PAS DAN en NIET EERDER wordt het product aan de database toegevoegd. En als u een product aan het aanpassen bent, PAS DAN en NIET EERDER worden de veranderingen doorgegeven. Als u een product verandert, dan hoeft u de foto s NIET opnieuw in te voeren. Alleen als u een andere foto wilt kiezen kunt u dat doen. De database onthoud de eerder opgegeven foto s. Als u een product verandert, dan ziet u ook de gekozen foto s, met hun naam er onder. Als u met de muis over de eerste forto gaat, en u heeft al een tweede ingevoerd, dan wisselen die op dat moment. Dit wordt bij een presentatie routine gebruikt, maar is niet standaard op de site. Als u ENTER drukt na een invoer is dat hetzelfde als op Data Invoeren te drukken. Dus, als u een bijna gelijk product wil invoeren en daar de EDIT functie voor gebruikt, verander ALS EERSTE het ProductNummer om het originele product niet te wissen. Het zal niet de eerste keer zijn CS-WebDesign & Courbois Software 11

12 Upload Editor Via de Upload keuze kunt u files naar de WebSite sturen. Dit kunnen foto s zijn, maar ook word files, animaties enz. Eigenlijk alles. Als zo n file op de harddisk van de WebSite staat kun je het op de site gebruiken. Dus om een foto te laten zien moet je het eerst via Upload opsturen. In het scherm dat je nu ziet kun je een file opsturen. Kies eenvoudig een van de Bladeren knoppen en kies een file. Tik op laden in de requester en dan op het symbool. In de Status regel, helemaal onderaan, komt het resultaat te staan. Zoals u ziet zijn alle regels doorgestreept, behalve de eerste (OPSLAG). Dat is de keuze die u normaal maakt en waar ik in de rest van de teksten van uit ga. De andere werken volledig, maar de plaatjes komen dan op plaatsen op de harddisk die bedoelt zijn voor plaatjes van speciale functies (Menu s, Winkel, ideal, Google, enz. De namen verklaren het. De menu keuzes naast Upload zijn knoppen die de plaatjes in die directories op de site harddisk laat zien. Voor de ideal directory is dat b.v.: Door op een plaatje te tikken krijgt u een groter scherm te zien waar het plaatje in ware grootte staat. Tevens staat daar de naam van het plaatje voor als u het wilt gebruiken in een box CS-WebDesign & Courbois Software 12

13 Dit is het venster van het derde plaatje. U ziet dat de de naam van het plaatje Pics-iDeal/iDeal03.jpg is. Daarbij zijn hoofd- en kleine letter essentieel. Een fout daar in en het plaatje wordt niet gevonden. Tik op het plaatje om het venster te sluiten. Als u naar mij een plaatje of een tekst wil sturen dan kan dat ook via deze editor. Stuur het file naar de OPSLAG folder en ik krijg van de site een mail dat u dat gedaan heeft CS-WebDesign & Courbois Software 13

14 Nieuws Editor Dit is de Nieuws Editor. Deze is er om snel het laatste nieuws aan de bezoeker te laten zien. Er zijn 5 nieuwsberichten mogelijk, met of zonder uitgebreide tekst. Door op het nummer te tikken krijgt u dat bericht. Nieuwsregel Bericht Wissen Plus Tekstfile Tekst Hier staat de regel met tekst die de bezoeker op de site ziet. Gebruik de symbolen <BR> om een nieuwe regel te beginnen. De bedoeling is dat daar een korte kreet komt. Iets zoals Bezoek ons eens of Net nieuw binnen. Tik hier Ja aan als u dit bericht uit de lijst wilt halen. Tik hier Ja als u in het tekstveld daar onder meer informatie wilt geven. Als hier Ja is gekozen komt er op de WebSite een knop bij te staan om op te tikken. Als de bezoeker er op tikt krijgt deze de tekst te zien. De informatieve tekst. Zie meer over het invoeren daarvan bij de WYSIWYG Editor uitleg op pagina 42. Op de site staat de melding dat er nieuws is meestal in een zijkolom. Het ziet er dan b.v. zo uit: De eerste is een mededeling. De keuze Plus Tekstfile staat hier op Nee. De tweede is met een tekstfile. Er komt een info symbool te staan boven de regel CS-WebDesign & Courbois Software 14

15 Dit blokje wordt gemaakt door de box: WW-NieuwsBlok (Pagina 85). De nieuwtjes worden in de volgorde getoond. Is er 1 leeg, dan wordt die gewoon overgeslagen. Zijn ze alle 5 leeg, dan komt er ook niets in de kolom te staan. Het geeft dan echter wel een lege regel extra CS-WebDesign & Courbois Software 15

16 Pagina Editor De Pagina Editor bepaalt wat er op een pagina komt, en hoe het er staat. U krijgt meteen het volgende overzicht te zien, of iets wat er op lijkt. Tikt u op een knop, dan wordt de pagina gewist. Nog even een vraag of u het zeker wilt en weg.. Maar niet volledig. Met de 3 e knop kunt u de gewiste pagina s nog terughalen. Ook daar ziet u weer zo n lijst. Tikt u dan nogmaals op de delete knop dan is het niet meer terug te krijgen. Tikt u echter op de knop, dan is de pagina er weer. De knop laat u een pagina aanpassen. De knop Nieuwe Pagina geeft het zelfde, maar dan helemaal leeg. De gegevens van mijn index pagina, de startpagina van de site, staan op het plaatje op de volgende pagina. Ik begin hier vast met de uitleg. De rode regels, middenin boven, zijn speciaal en bespreek ik aan het einde. PaginaNaam Template # Linker Kolom Rechter Kolom De naam van de pagina. Deze moet UNIEK zijn want er kunnen niet 2 dezelfde pagina s op de site zijn. Met behulp van deze naam kan een pagina zichtbaar worden gemaakt. Hoofd- en kleine letters zijn verschillend. Dus Test is niet test en ook niet TEST. Hou daar rekening mee. Een speciale pagina is de index pagina. Dat is namelijk de pagina waar de site mee start. Deze moet met kleine letters geschreven zijn! Dit is het uiterlijk van de pagina. U ziet het uiterlijk van deze pagina rechts middenin staan. Meer over de verschillende Templates in het volgende hoofdstuk. De standaard template is 001. Kolommen moeten worden opgebouwd. U doet dat in de Kolommen Editor. Hier staat de naam van de kolom die aan de linker kant van het scherm zichtbaar wordt. Als een template geen linker kolom heeft, dan kunt u deze leeg laten. Identiek voor de kolom aan de rechter kant van het scherm CS-WebDesign & Courbois Software 16

17 Top Menu Header Menu Menuwaarde H Menuwaarde V Omschrijving Box 01 tot 20 Menu s worden gemaakt met de Menu Editor. Hier komt alleen de naam van de MenuBox (zie Boxen Overzicht) te staan. Het Top Menu is een menu dat bovenaan de pagina komt, in het midden gedeelte. In het template voorbeeld plaatje hier boven komt deze boven de 01 en 02, maar niet boven de kolommen. Ook dit is slechts de naam van een MenuBox (zie Boxen Overzicht). Het verschil met het Top menu is dat deze over de hele pagina komt te staan, dus ook boven de kolommen. Dit geeft aan welk menupunt geaccentueerd moet worden op deze pagina. Als u b.v. een menu heeft dat normaal blauw is en wit wordt als u er met de muis over heen gaat, dan kunt u met een getal hier opgeven dat dat automatisch gebeurt voor het opgegeven menupunt. Zo kunt u laten zien op welke pagina u bent. De waarde van het getal wordt bepaald door het gekozen menu uiterlijk en wordt daar (Boxen Overzicht) besproken. Deze regel is voor HORIZONTALE MENU S. Identiek, maar nu voor VERTOCALE MENU S. Hier zijn 3 verschillende waarden tegelijk mogelijk. Een eenvoudige tekst waarin u verteld welke pagina het is. U zag dat achter de PaginaNaam in het overzicht. Dit zijn de modules van de pagina. De teksten en de speciale functies. Hier staan de namen van deze BOXEN. Hiervoor moet u echter de Boxen Editor tekst lezen CS-WebDesign & Courbois Software 17

18 Wat u nu moet weten is dat elke pagina maximaal 20 boxen kan bevatten en dat niet alle gebruikt hoeven te worden. De boxen worden uitgevoerd in volgorde en volgens het opgegeven template. Dus in dit voorbeeld Boxen 01 en 02 naast elkaar en dan 03 en 04 er onder enz. enz. Verschillende templates hebben verschillende volgorden. META TAGS Titel Zoekwoorden Omschrijving De titel van de pagina. Hier kijken zoekmachines naar. Als uw pagina gevonden wordt in een zoekmachine dan staat dit meestal als eerste regel (die waar u op kunt drukken). Een korte omschrijving van deze pagina. Zoekmachines hebben het graag dat elke pagina een andere titel heeft, ze laten toch ook allemaal iets anders zien. Dit zijn de zoekwoorden waarmee zoekmachines onder anderen uw pagina indexeren. Er zijn nog meer dingen. Hier staan woorden gescheiden door komma s die betrekking hebben op uw site en deze pagina. De hele site kan dezelfde hebben, maar ook kan elke pagina specifieke woorden hier hebben staan. Zoekmachines hebben het liefst dat u tussen elke kreet een komma en een spatie zet om ze te onderscheiden. De regel eindigt echter ZONDER KOMMA. De editor corrigeert dat. U kunt verder tikken dan de invoer regel lang is. Er zijn 2 regels voor de zoekwoorden die u vrij kunt gebruiken. Dit is de omschrijving van uw site. Een vriendelijke tekst die in een zoekmachine getoond wordt aan die gene die aan het zoeken is. META TAGS moeten voor elke pagina ingevoerd worden om zoekmachines uw site te laten indexeren. Dat is elke keer veel werk, dus een klein hulpje. Als u de META TAGS invoert voor de index pagina, en een andere pagina heeft nog niets staan, dan komen de index META TAGS daar automatisch te staan. U hoeft dan alleen nog kleine aanpassingen voor die pagina te maken. Weer heel belangrijk: Vergeet niet aan het einde van het aanmaken of aanpassen van de pagina op de knop te drukken, anders wordt er niets met de database gedaan! Dan de speciale rode regels in het scherm. Een aantal variabelen worden voor de hele site gezet. Dat zijn b.v. de kleuren van de site en de logo s. Met deze rode regels kunt u een uitzondering maken voor 1 bepaalde pagina. Deze gegevens komen dan in plaats van de standaard die bij de Systeem Editor worden opgegeven. BG Kleur Links De achtergrondkleur van de linker kolom. BG Kleur Midden De achtergrondkleur van de middelste kolom. BG Kleur Rechts De achtergrondkleur van de rechter kolom. Foto Links Een achtergrond foto voor de linker kolom. Hier staat de naam en locatie van de foto. De hele naam, dus vergeet ook niet de.jpg of.gif. Ook de gegevens er achter zijn belangrijk: Repeat Ja Nee X Y CS-WebDesign & Courbois Software 18

19 Dit geeft aan hoe een plaatje in het vak herhaald moet worden. Ja Het plaatje herhalen in alle richtingen. Nee Het plaatje slechts 1 keer laten zien vanaf links boven. X Het plaatje horizontaal herhalen, als een balk. Y Het plaatje vertikaal herhalen, als een kolom. Foto Midden Foto Rechts Header Links Header Rechts Header Center Identiek voor een foto in het middenvak. Identiek voor de rechter kolom. Boven aan de site staat meestal een logo of zo iets. Deze kunt u hier veranderen. Header Links is voor de linker helft van de kopregel. U kunt hier weer de naam van een plaatje zetten. Het zelfde, maar nu voor de rechter helft. Ook het zelfde, maar nu gecentreerd over de hele kopregel. Links en rechts kunnen tegelijk gebruikt worden en komen dan naast elkaar te staan. Center beslaat de hele breedte. Gebruikt u Links en/of Rechts en Center, dan gaat Center voor. Als u hier een Box wilt gebruiken, b.v. met een tekst, dan moet er Box- VOOR de boxnaam staan om dit te onderscheiden met een plaatje. Dus als een box de naam Hallo heeft, dan moet hier het volgende staan: Box-Hallo. Dit alleen bij de Headers. Als u op mijn site kijkt wordt rechts boven een winkelwagen box gebruikt i.p.v. een plaatje. Daardoor is die tekst dynamisch als u wat in de winkelwagen stopt CS-WebDesign & Courbois Software 19

20 Pagina Templates Ook in de editor kunt u de templates bekijken door op de laatste knop van de Pagina Editor te drukken. Templates worden per site aangepast om het uiterlijk te veranderen. Deze zijn aanwezig op elke site: CS-WebDesign & Courbois Software 20

21 Er zitten tegenwoordig (vanaf versie 2.4.0) niet 10 maar 20 boxen in een pagina. Voer gewoon het zelfde patroon door. Ook de kolommen hebben boxen. Alleen die zijn overal het zelfde omdat de kolom smal is. Daar staan 15 boxen onder elkaar. Dat geeft u op in de Kolom Editor CS-WebDesign & Courbois Software 21

22 Box Editor Zoals u bij het stuk over de opbouw van de site heeft kunnen lezen is een BOX het deel van de site waar alles in gebeurd. Elke tekst of functie gebeurt in een box. Een site bestaat dus eigenlijk uit een reeks boxen achter elkaar, gepositioneerd in een template. Dus het aanmaken van een box is belangrijk. Er zijn 4 verschillende boxen: 1. Tekst Boxen. U kunt de naam hiervoor vrij kiezen, dus kies een naam die meteen aangeeft wat de box doet. De boxnaam mag NIET beginnen met WW- 2. WW-Boxen. Dit zijn voorgeprogrammeerde boxen die een functie uitvoeren. Deze zijn kant-enklaar en u kunt er zelf niets aan veranderen. Het enige wat u kunt doen zijn de instellingen (Codes) aanpassen zodat het uiterlijk en de functie iets kan veranderen. 3. ZZ-Boxen. Dit zijn gewone Tekst Boxen, maar met speciale namen omdat die door de WW- Boxen worden aangeroepen. Hier maakt u normaal geen nieuwe. U kunt wel de teksten en plaatjes aanpassen naar uw behoefte. 4. DATABoxen. Dit zijn eenvoudige bestanden met b.v. een lijst met plaatjes, een lijst met woorden, enz. Deze worden vanuit de WW-Boxen automatisch aangeroepen. U kunt ze bijmaken als u de Codes in de WW-Boxen veranderd. Er staat uitleg waar dat kan. Als u op Boxen tikt in het bovenste menu krijgt u het menu van hierboven te zien. Daaronder zo iets als: Als de knop zichtbaar is kunt u die box wissen. U wordt wel nog gevraagd of u het zeker wil, tikt u op JA dan is de box weg en niet meer te gebruiken. Als de delete knop er zo uit ziet:, dan kunt u het item NIET wissen. Een verwijderde box is nog niet helemaal weg. In de tweede menuregel bovenaan het scherm staat Deleted Overzicht. Tikt u daar op dan krijgt u een soortgelijke lijst te zien. Ook daar weer een delete knop. Nog een keer delete kiezen is definitief weg CS-WebDesign & Courbois Software 22

23 Op het scherm van de Deleted Boxen staat de site. Nu naar de belangrijkste knoppen op dit scherm : -knop. Deze voegt een box weer toe aan de. Deze staan voor elke boxnaam. Door op te tikken kunt u de teksten en het uiterlijk van de boxen aanpassen. U krijgt dan het volgende scherm te zien: Dit scherm krijgt u ook als u op de knop Nieuwe Box tikt. Bij de EDIT keuze staan er al waarden ingevuld en kunt u die aanpassen. Maar ik ga nu even van een nieuwe box uit. BoxNaam Clone van Breedte Omschrijving HTTP-Link De naam van de box. Vrij te kiezen of niet aanpassen bij EDIT. Met deze naam wordt de box aangeroepen in de site. Kies een zinnige naam. Hier staat meestal de naam van een WW-Box. Dit is de manier om andere gegevens aan een WW-Box door te geven als de standaard WW-Box. Stel u heeft meerdere pagina s met foto s die in een galerij getoond worden. De galerij box haalt de namen van de foto s uit een DATABox. Door een CLONE te gebruiken kunt u dezelfde galerij gebruiken met verschillende DATABoxen, dus verschillende sets foto s. Dit is de breedte van de box als deze afwijkt van de standaard ruimte. Wordt zelden gebruikt. Een omschrijving van de box. Dat zijn de regels die u in het overzicht ziet. Dit is de pagina waar de site heen moet springen als er op de box getikt wordt. Dit alleen als u wilt dat er ook gesprongen wordt. Een keuze als Contact.php springt naar die pagina op de site. Een volledige link kan ook : Daarbij zijn de eerste 4 letters belangrijk. Is dat http dan wordt die keuze geopend in HETZELFDE SCHERM als de site. Is dat echter HTTP (hoofdletters) dan wordt er een nieuw scherm geopend CS-WebDesign & Courbois Software 23

24 Speciale Codes Code 01 Inhoud Dit zijn variabelen die doorgegeven worden aan de box als deze aangeroepen wordt. Deze worden vooral gebruikt in de WW-Boxen. Elke code wordt in het overzicht van de WW-Boxen beschreven. Ook in de editor staat bij ELKE WW- Box een uitleg van de Codes. Dit is de enige code die gebruikt wordt in een normale TekstBox. Met deze kan een vreemd lettertype gekozen worden. De generatie van die letters wordt verzorgd door GOOGLE en staan genoemd in de DATABox GoogleFonts. Meer hier over in de beschrijving van die DATABox. Dan komt de inhoud. Bij TekstBoxen is dat de tekst die op het scherm komt te staan. Bij de meeste WW-Boxen is deze tekst onbelangrijk en staat daar de uitleg van die box. Over hoe u de tekst moet intikken kunt u meer lezen in het hoofdstuk over de WYSIWYG-Editor op pagina 42. Het is ZEER BELANGRIJK dat u afsluit door op de knop te drukken (rechts boven). Doet u dat niet en sluit u het venster op een andere manier, dan zijn alle veranderingen ongedaan gemaakt. Het is alsof u niets heeft gedaan. Tikt u er op, dan sluit het venster. Dan gaan we naar de DATABoxen: U krijgt weer een lijst te zien: De functies zijn hier net als bij de normale boxen. Bij EDIT krijgt u echter een ander scherm te zien (zie volgende pagina). In een DATABox staat een lijst met gegevens voor een andere box. Denk daar bij aan een lijst met foto namen, karaktersets, wachtwoorden, enz enz. De beschikbare DATABoxen staan beschreven achterin deze handleiding, na de normale boxen. Zelf maakt u ze alleen als u b.v. een nieuwe fotogalerij wil maken of willekeurig artikel in een reclame box wil laten zien. BoxNaam Omschrijving De naam van de box. Vrij te kiezen of niet aanpassen bij EDIT. Met deze naam wordt de box aangeroepen door een WW-Box. Kies een zinnige naam. Een omschrijving van de box. Dat zijn de regels die u in het overzicht ziet CS-WebDesign & Courbois Software 24

25 001 De gegevens die in de box komen. Totaal 40 stuks maximaal. Het is ZEER BELANGRIJK dat u afsluit door op de knop te drukken (rechts boven). Doet u dat niet en sluit u het venster op een andere manier, dan zijn alle veranderingen ongedaan gemaakt. Het is alsof u niets heeft gedaan. Tikt u er op, dan sluit het venster CS-WebDesign & Courbois Software 25

26 Kolom Editor De kolom Editor gebruikt u om de boxen voor de kolommen te definiëren. Elke kolom heeft 15 mogelijke boxen. Als u start krijgt u een lijst van de aanwezige boxen te zien: De knop wist de kolom. Ook weer de vraag of u het zeker weet, MAAR dit keer GEEN OPSLAG. WEG is WEG! Met de knop kunt u een kolom aanpassen. Het scherm is het zelfde als een die bij een nieuwe kolom, alleen is er nu al wat ingevoerd. Deze is heel eenvoudig en beperkt in de invoer. KolomNaam Box Vergeet niet op De naam van de kolom. Deze naam voort u bij de Pagina Editor in bij de Linker of Rechter kolom. De naam van de box die getoond moet worden. Kijk in het Boxen Overzicht voor de mogelijke namen. te drukken! CS-WebDesign & Courbois Software 26

27 Menu Editor Met de Menu Editor kunt u keuze menu s maken die u dan met een van de menu boxen kunt laten zien. Hier wordt dus niet het uiterlijk maar de menupunten gemaakt. U kunt weer nieuwe menu s maken of een oude aanpassen. De knop wist een menu. Een vraag of u het zeker weet, maar geen opslag. Voor menu s geldt: WEG is WEG. Er zijn 2 soorten menu s mogelijk: Enkele en Dubbele. U ziet ze gescheiden in het overzicht. Op het plaatje zijn er alleen enkele. Het Enkel Menu: Menu Naam De naam van het menu. U heeft deze naam nodig in een Menu Box (Zie Boxen Overzicht). Pas in een Box komt het uiterlijk van een menu naar voren. In de Menu Editor worden de namen van de menukeuzes gedefinieerd, en natuurlijk naar welke pagina gesprongen moet worden. Het zijn de links van de site CS-WebDesign & Courbois Software 27

28 Startwaarde Button Naam Button Link Dit is een getal waar het menu begint met tellen. Dit is het getal dat gebruikt wordt in de Pagina Editor voor de Horizontale en Verticale waarden. Eenvoudig doortellen. Als de Startwaarde 1 is, dan heeft button 9 de waarde 9. Is de Startwaarde 11, dan is de waarde van button 9 nu 19. De naam zoals u deze op het scherm ziet. Dingen als Home, Adres, Contact. Bij smallere menu s moet u rekening houden met de lente van die namen. Maximaal zijn het er 15. Dit is de naam van de pagina waar heen gegaan moet worden als er op die knop gedrukt wordt. Er zijn 2 mogelijkheden: 1. Een eenvoudige link op de site. B.v. Contact om naar de pagina Contact te gaan die u met de pagina Editor heeft aangemaakt. 2. Een link buiten de site. Deze moet volledig zijn. Een link naar een andere site kan dan zijn: De eerste 4 letters zijn daarbij belangrijk. Is dat http, dan komt de andere site op hetzelfde venster. Is het HTTP (hoofdletters) dan wordt er een nieuw venster geopend. Als er een naam opgegeven is maar geen link, dan gebeurt er niets als u op de knop tikt. Vergeet niet af te sluiten met Het Dubbel Menu: Een dubbel menu is een menu met sub-menu s, waar u dus onder keuzes kunt maken. Menu Naam Button Naam Hier weer de naam van het menu voor de diverse MenuBoxen. De naam die op het scherm verschijn. Als je een lijst met sites van vrienden wil maken kan dat b.v. Links zijn CS-WebDesign & Courbois Software 28

29 SubNaam SubLink De naam van een Sub Menu. In ons voorbeeld kan dat de naam van een site zijn waar de bezoeker heen kan. De link waar naar toe gesprongen moet worden. Ook hier zijn de twee mogelijkheden toegestaan: 1 Een eenvoudige link op de site. B.v. Contact om naar de pagina Contact te gaan die u met de pagina Editor heeft aangemaakt. 2 Een link buiten de site. Deze moet volledig zijn. Een link naar een andere site kan dan zijn: De eerste 4 letters zijn daarbij belangrijk. Is dat http, dan komt de andere site op hetzelfde venster. Is het HTTP (hoofdletters) dan wordt er een nieuw venster geopend. Hier is echter GEEN lege toegestaan. In het totaal zijn er 15 menu keuzes mogelijk, elk met 10 onder keuzes. Menu s worden doorgegeven aan diverse Boxen (WW-Boxen). Het zijn de boxen die beginnen met: WW-Top.. en WW-Side. Het zijn er een stuk of tien. Zie het Boxen Overzicht voor de beschrijving van die boxen CS-WebDesign & Courbois Software 29

30 BackUp Maker De BackUp Maker maakt veiligheids kopieën van de database. Dat betekend dat ALLE INSTELLINGEN van de site opgeslagen worden in een tekst file. Als er iets mis gaat kan met dit file de hele site teruggezet worden. Ik kijk elke week (vrijdag) of er veranderingen in de database zijn, en als dat zo is maak ik een kopie. U kunt dat zelf natuurlijk ook voor u veranderingen gaat maken of gaat experimenteren. Het is zelfs aan te raden. Tik eenvoudig op de Maak Database BackUp knop. U krijgt een scherm te zien van alle backups: Tikt u op een naam, dan krijgt u het file te zien. Gebruik de TERUG-knop van uw browser om terug te gaan. De naam van de backup bevat de datum. Niet de tijd, alleen de datum. Dat wil zeggen dat als u op een dag 2 keer een backup maakt, de eerste verloren gaat. Dus dit maar 1 keer per dag uitvoeren!!! CS-WebDesign & Courbois Software 30

31 WinkelMenu Editor In het Winkel menu wordt de structuur van de categorieën van de WebWinkel opgegeven. Hier staat welke categorieën er zijn en in welke volgorde ze op het scherm komen te staan. Het eerste deel, de Categorie Editor, is er voor alle typen winkels. Hier staan de namen van de categorieën. De volgorde is totaal onbelangrijk en er mogen zo veel leeg zijn als u wilt. Maar een overzichtelijke lijst is natuurlijk handiger. Vergeet niet als u klaar bent. Het nummer dat voor de naam staat is dadelijk belangrijk. Dit nummer wordt door de Producten Editor aan een product gekoppeld. Het is dus niet verstandig de namen later fundamenteel te veranderen. Stel u veranderd groep 041 van LAN Kaart in Muis, dan zullen de reeds ingevoerde LAN Kaarten bij de Muizen verschijnen. Maak liever een nieuwe groep. U heeft er 320, dus ruimte genoeg. NIEUW vanaf versie Na elke categorienaam is een klein vakje gekomen. In dit vakje kan niets of een getal van 0 t/m 9 staan. Dit getal geeft aal welke ProductLijst pagina gebruikt wordt voor die categorie. Niets of 0 = ProductLijst 1 = ProductLijst1 2 = ProductLijst2.. 9 = ProductLijst9 Op die manier kunt u verschillende categorieën op verschillende manieren in de winkel tonen. Op dit moment is ALLEEN WW-ProductMenuC03 daarvoor gereed CS-WebDesign & Courbois Software 31

32 Nu de namen van de categorieën bekend zijn moet u een beslissing nemen over hoe de lijst op de site moet komen. U kunt voor een Enkel Menu of een Dubbel Menu kiezen. Die keuze wordt als eerste gemaakt in de Systeem Editor. En daarna hier. Als u onderverdelingen maakt is het Dubbel Menu het verstandigste. Bij een gering aantal categorien kunt u beter een Enkel Menu kiezen. Een Dubbel Menu werkt, net als bij de Menu Editor met Sub menu s. We beginnen met het Enkel Menu op de volgende pagina. Hier bepaalt u de volgorde van de categorieën op het scherm, niet het uiterlijk. Dat laatste gebeurt in een Box. Door het nummer in te tikken zoals dat voor de categorie staat kunt u de volgorde opgeven. Dat hoeft dus niet te zijn. PAS OP 001, niet 1. Er mag GEEN LEGE TUSSENIN ZITTEN. De lijst stopt bij de eerste lege cel!!!! Vergeet niet als u klaar bent. Bij het Dubbel Menu is er wat meer werk nodig CS-WebDesign & Courbois Software 32

33 In het vak onder HoofdGroep xx staat de naam van die groep. B.v. Muizen. Daar onder staan de verschillende categorie nummers. Een lijst zonder lege vakken. De laatste met een nummer is de laatste in die lijst. Het zelfde geldt voor de HoofdGroep naam. De laatste met een naam is de laatste die getoond wordt. Een lege er tussen en het stopt daar. In het menu bovenaan is dit stuk in 6 stukken verdeeld, elk met 5 menu s. Dit alleen om de pagina niet heel erg lang te maken. Heeft u er meer dan 5 nodig? Ga dan gewoon verder met Vergeet niet als u klaar bent. Hoe alles op het scherm komt te staan wordt bepaald door de Box die het laat zien. De boxen die dat doen beginnen met WW-ProductMenu... Meer daar over in het Boxen Overzicht CS-WebDesign & Courbois Software 33

34 Systeem Editor De Systeem Editor is de plaats waar alle variabelen opgegeven worden. Hier wordt de kleur van de site bepaald, hoe alles er uit ziet en wat er afgedrukt kan worden. In 3 stukken de eerste pagina. Adres en Winkel Variabelen Dit eerste stuk is denk ik wel duidelijk. Het zijn de adresgegevens van de winkel. Deze gegevens worden vooral gebruikt als een klant wat koopt om de mail naar hem te sturen met alle gegevens die hij nodig heeft. Onderaan staan de diverse porto versies. Dit zijn limieten. Een waarde 0.00 geeft aan dat er geen limiet is. Scherm Variabelen Scherm Kleur De kleur van de achtergrond van het scherm. Dat mag een kleurnaam zijn (Black White) of een Hexedecimaal nummer # = Zwart, #FFFFFF = Wit. De waarde hier (#DDEEFF) is de kleur blauw die je in dit plaatje ziet. Scherm Background De naam van een achtergrond plaatje. De volledige naam, met b.v..jpg er achter CS-WebDesign & Courbois Software 34

35 Aan Repeat Dit geeft aan of het plaatje zichtbaar moet zijn. U kunt een plaatjesnaam invoeren maar het wordt pas zichtbaar als het vakje aangevinkt is. Ja Herhaal het plaatje in alle richtingen. Nee Toon het plaatje maar 1 keer. X Horizontaal herhalen. Y Vertikaal herhalen. Header Variabelen Banner Links Flash Links Flash Data De top banner aan de linker kant. Hier staat de naam van het plaatje. Hier kan ook de naam van een Box staan. Een Flash Animatie voor in de top banner aan de linker kant. X De breedte van de Flash animatie Y De hoogte van de Flash animatie. Loop Moet de animatie herhalen? Dan aanvinken. Banner Sel Links Het type van de banner die links getoond moet worden. Pic Het is een plaatje. Fla Het is een Flash animatie. Ran Niet gebruiken. Box Het is een box. De naam staat bij het plaatje. Geen Deze banner staat uit. Dit stuk is er voor de linker helft, de rechter helft en een gecentreerde banner. Links en Rechts kunnen samen maar niet met Center CS-WebDesign & Courbois Software 35

36 Dan nog wat extra variabelen voor de Header: Header Kleur Header Hoogte De achtergrondkleur van de top Header. Kleurnaam of HEX. De hoogte van de banner in pixels. Dit is een MINIMALE hoogte. Is het te tonen plaatje groter, dan wordt er ruimte gemaakt. Header Background Het achtergrond plaatje voor de Header. Met de Aan-knop. Ook hier weer de repeat mogelijkheden. Kolom Variabelen Kolom 1 Kleur Kolom 2 Kleur Kolom 3 Kleur KolomTop 1 KolomTop 2 De achtergrondkleur van de 1 e kolom. Kleurnaam of HEX. De achtergrondkleur van de 2 e kolom. Kleurnaam of HEX. De achtergrondkleur van de 3 e kolom. Kleurnaam of HEX. Dit bepaalt het uiterlijk van de kolom. Er zijn 4 mogelijkheden: 1. R1 Een ronde top met een kleine boog. 2. R2 Een ronde top met een grote boog. 3. Niets, het vlak eindigd zonder overgang. 4. B Een border (rand) om de box. Idem voor de 2 e kolom. KolomTop 3 En voor de 3 e. Kolom 1 Background Kolom 2 Background Kolom 3 Background Het achtergrond plaatje voor deze kolom. Ook weer met de Aanknop en de herhaal mogelijkheden. Idem. Idem. En dan het derde stuk. Het plaatje staat op de volgende pagina want er is op deze pagina geen ruimte meer. Footer Variabelen De Footer is de onderkant van de site. Footer Kleur De achtergrondkleur van het onderstuk. Kleurnaam of HEX. Footer TekstKleur De kleur van de copyright boodschap onder aan de site. Footer LijnKleur De kleur van de lijn onder aan de site. Wilt u deze absoluut niet zien. Kies dan kleuren die gelijk zijn aan de achtergrond. De copyright regel blijft echter altijd staan CS-WebDesign & Courbois Software 36

37 ##### NIEUW in Versie ##### In versie van de editor is de Footer optie iets uitgebreid. De lijn tussen de opyright tekst en de site kan nu weggelaten worden. Kies daar voor Uit achter de Footer LijnKleur. Daarnaast kunt u een plaatje opgeven, meestal een breed en dun plaatje, dat onder de webpagina wordt getoond. B.v. met uw adres gegevens. Niets is geen plaatje. Maximaal 990 pixels breed. Systeem Variabelen Dealer Password De toegangscode voor een dealer. Systeem COOKIE De naam van het systeem COOKIE. Mag van alles zijn. Menu Structuur Enkel De winkel gebruikt een Enkel menu Sub De winkel gebruikt een Dubbel menu. Beide beide menu s zijn toegestaan in de winkel CS-WebDesign & Courbois Software 37

38 Editor Variabelen Password De toegangscode voor de editor. Verander verder hier nooit iets. De layout kan er door in de war raken. Opmerkingen Zet hier dingen neer die u wilt onthouden. Dit was het eerste stuk van de Systeem Editor. Nu de volgende menu keuzes: Vergeet niet als u klaar bent. Systeem Plaatjes Systeem plaatjes zijn de plaatjes die de diverse boxen kunnen gebruiken. Hier kunt u die plaatjes vervangen door andere. De namen verklaren zich zelf. MySQL Blijf hier van af als u niet precies weet wat u doet. Hiermee kunt u de database aanpassen CS-WebDesign & Courbois Software 38