Opzetten van je site – Stap 1: Kies een ontwerp



Dovnload 52.28 Kb.
Datum22.07.2016
Grootte52.28 Kb.
- Opzetten van je site –

Stap 1: Kies een ontwerp

Klik op “Instellingen”
Klik op “Kies design”
Klik op een ontwerp dat je aanspreekt
Klik op de kleurstelling die je aanspreekt (niet voor winkelketens)

Je ziet nu een lege website.


Stap 2: Voer je bedrijfsnaam in

Klik op “Instellingen”
Klik op “Algemeen”
Vul hier je bedrijfsnaam en je bedrijfsslogan in. Heb je geen slogan dan kun je dit vlak leegmaken.


Klik op “Wijzigen”

Je ziet nu je site met je bedrijfsnaam en eventueel je slogan.


Stap 3: Zet een logo erin

Een standaard logo:


Klik op “Instellingen”
Klik op “Kies logo”
Klik op een logo dat je aanspreekt (of kies “geen logo”)
(even wachten)

Je ziet nu je site met logo en met je bedrijfsnaam en eventueel je slogan.




Je eigen logo:
Wil je je eigen bedrijfslogo op je site hebben staan, neem dan even contact op met Alphamega: 040-2085353 (voor België: 011/547498). Voor een eenmalig bedrag van € 35,- (excl. BTW) bewerken we je logo en zetten we die in je site. Daarvoor hebben we je logo digitaal nodig.
Stap 4: Maak een menu
Nu moet je eerst wat denkwerk doen, voordat je een menu gaat maken. Wat wil je vertellen? Welke informatie moet er allemaal op je site? Wat mag je niet vergeten? Ik zal je hier nu eerst wat richtlijnen voor geven, dan leg ik zo meteen uit hoe je de verschillende pagina’s aanmaakt.
Wat wil je vertellen op je site? Natuurlijk wil je wat vertellen over je bedrijf, over de mensen die er werken en wat je bedrijf zo anders maakt dan al die andere bedrijven. Je bezoekers moeten ook weten wat ze van je kunnen verwachten. Je kunt dus iets vertellen over je producten, je diensten en je garantie. Je kunt ook de bezoekers van je site stimuleren om naar je winkel te komen. Dat doe je bijvoorbeeld door aanbiedingen op je site te zetten. En dan kun je ook nog eens online omzet genereren door de ASWO E-shop aan je site te koppelen. Als je dit allemaal zou willen vertellen op je site zou je menu er zo uit kunnen zien:
Home (welkomstwoord, toelichting hoe de site werkt)

Over ons (Uitleg over je bedrijf, stukje historie)

Personeel (uitleg over je personeel, eventueel met foto’s erbij)

Waarom wij? (uitleg waarom je beter bent dan al die andere)

Producten (Korte uitleg van welk assortiment je voert)

Merken (Diverse merken in de spotlight, uitleg over merken)
Producten (Diverse producten bv vaatwassers met tips en uitleg erbij)

Aanbiedingen (link naar hoofdpagina aanbiedingen)

Diensten (Korte uitleg van diensten zoals bezorgen en reparaties)
Onderdelen (Korte uitleg en link naar je eigen ASWO E-shop)

Online Shop (directe link naar je eigen ASWO E-shop)
Aanbiedingen (pagina met foto’s, omschrijvingen en prijzen)
Contact (foto van pand, adres, route beschrijving, openingstijden, email)
Je ziet hier 7 hoofdmenupunten en (2+3+1=) 6 submenupunten.
Het aanmaken van dit menu is nog geen vijf minuten werk... nou vooruit dan... tien minuten. Het gaat zo:
Klik op “Bewerk site”
Klik op “Bewerk menu”
Home , Menu 2 en Menu 3 zijn al aangemaakt. Dit zijn hoofdmenupunten. Het zijn er maar 3 en we moeten er 7 hebben.

Klik daarom nog 4 keer op de knop “Hoofdmenu toevoegen” totdat er in totaal 7 hoofdmenupunten staan.


Klik op “Wijzigen” achter Menu 2

Verander de naam in: Over ons

Klik op “Wijzigen”
Je hebt nu hoofdmenupunt 2 aangemaakt: Over ons
Klik op “Wijzigen” achter Menu 3

Verander de naam in: Producten

Klik op “Wijzigen”
Je hebt nu hoofdmenupunt 3 aangemaakt: Producten
Klik op “Wijzigen” achter Menu 4

Verander de naam in: Diensten

Klik op “Wijzigen”
Je hebt nu hoofdmenupunt 4 aangemaakt: Diensten
Klik op “Wijzigen” achter Menu 5

Verander de naam in: Onderdelen

Klik op “Wijzigen”
Je hebt nu hoofdmenupunt 5 aangemaakt: Onderdelen
Klik op “Wijzigen” achter Menu 6

Verander de naam in: Aanbiedingen

Klik op “Wijzigen”
Je hebt nu hoofdmenupunt 6 aangemaakt: Aanbiedingen
Klik op “Wijzigen” achter Menu 7

Verander de naam in: Contact

Klik op “Wijzigen”
Je hebt nu hoofdmenupunt 7 aangemaakt: Contact
Nu gaan we de submenupunten aanmaken.
We willen 2 submenupunten onder hoofdmenupunt Over ons. Klik daarom 2 keer op de knop “Submenu toevoegen” achter hoofdmenupunt Over ons.
We willen 3 submenupunten onder hoofdmenupunt Producten. Klik daarom 3 keer op de knop “Submenu toevoegen” achter hoofdmenupunt Producten.
We willen 1 submenupunt onder hoofdmenupunt Onderdelen. Klik daarom 1 keer op de knop “Submenu toevoegen” achter hoofdmenupunt Onderdelen.
Klik op “Wijzigen” achter Over ons - Submenu 1

Verander de naam in: Personeel

Klik op “Wijzigen”
Je hebt nu submenupunt 1 aangemaakt: Personeel
Klik op “Wijzigen” achter Over ons - Submenu 2

Verander de naam in: Waarom wij?

Klik op “Wijzigen”
Je hebt nu submenupunt 2 aangemaakt: Waarom wij?
Klik op “Wijzigen” achter Producten - Submenu 1

Verander de naam in: Merken

Klik op “Wijzigen”
Je hebt nu submenupunt 3 aangemaakt: Merken
Klik op “Wijzigen” achter Producten - Submenu 2

Verander de naam in: Producten

Klik op “Wijzigen”
Je hebt nu submenupunt 4 aangemaakt: Producten
Klik op “Wijzigen” achter ProductenSubmenu 3

Verander de naam in: Aanbiedingen

Klik op “Wijzigen”
Je hebt nu submenupunt 5 aangemaakt: Aanbiedingen
Klik op “Wijzigen” achter OnderdelenSubmenu 1

Verander de naam in: Online Shop

Klik op “Wijzigen”
Je hebt nu submenupunt 6 aangemaakt: Online Shop
KLIK NU EERST OP DE KNOP “BEKIJKEN”   

Stap 5: Pagina’s bewerken
We hebben nu de site klaar in de juiste vormgeving, met de bedrijfsnaam en eventueel slogan erin. We hebben een logo er in gezet en we hebben een menu aangemaakt. De site is nu, op de inhoud na, af. We gaan nu, pagina voor pagina, inhoud geven aan de site.
Bij elke pagina ben je vrij om zelf de indeling te maken. Je zit dus niet vast aan voor opgezette indeling. Dat is ideaal, want zo geef je de site je eigen signatuur.
TIP: Schrijf de teksten die je op je site wilt hebben eerst in Microsoft Word of een ander tekstverwerkingsprogramma. In alle rust. Daarna maak je verbinding met de Sitemanager en kun je de teksten kopieren en plakken.
TIP:
We zullen nu samen een wat moeilijkere pagina gaan maken, alleen al om te laten zien hoe makkelijk het is . Laten we samen de aanbiedingen pagina maken.
Maak eerst een schetsje op papier van hoe de pagina er uit moet gaan zien. De pagina kan gerust langer zijn dan een A4-tje. Bedenk welke artikelen je er in wilt zetten. Maak er digitale foto’s van (of vraag het hoofdkantoor of de leverancier om digitale foto’s van de artikelen). Zet alle foto’s in een mapje op de harde schijf van je PC. Zorg dat je de omschrijving en de van/voor prijzen hebt. Dat zijn de ingrediënten van deze pagina.


  1. Klik op “Bewerk site”

  2. Klik op “Plaatjes”

  3. Klik op de knop: “Voeg nieuw plaatje toe (uploaden)”

  4. Klik op de 'Bladeren' of 'Browse'
    Je bent nu op je harde schijf.

  5. Ga naar het mapje met de foto’s van de aanbiedingsartikelen

  6. Klik op een foto die je op je site wilt laten zien

  7. Klik op de knop: “Voeg het geselecteerde plaatje toe (uploaden)”
    (even wachten nu)
    De Sitemanager geeft je nu de keuze hoe groot je de foto wilt laten zien op je site. Deze optie optimaliseert niet alleen de foto maar zorgt er ook nog eens voor dat je pagina sneller zichtbaar is voor de bezoekers en dat je minder schijfruimte gebruikt.

  8. Kies het formaat dat je graag wilt hebben

Herhaal de stappen 3 tot 8 voor alle foto’s die je op je site wilt laten zien. Zo leg je een “mapje” aan met foto’s waar we straks uit kunnen kiezen.

Heb je alles? Klik dan op de knop “Bekijken”.


Klik in het menu op de hoofdmenupagina “Aanbiedingen”.

Klik vervolgens op “bewerk pagina”



Het inhoudvlak van de pagina wordt nu getoond in een soort tekstverwerkingsprogramma. Eigenlijk heet dit een “HTML editor” omdat het veel meer kan dan alleen tekst verwerken. De knoppen betekenen het volgende:
Knippen
Kopieren
Plakken
Ongedaan maken
Herstellen
Opmaak verwijderen
Interne link maken
Externe link maken
Link verwijderen
Horizontale lijn invoegen
Speciale tekens invoegen
Foto of plaatje invoegen
Tekstomloop om de foto heen, foto links
Tekstomloop om de foto heen, foto rechts
Eigenschappen van de foto of het plaatje
Links uitlijnen
Centreren
Rechts uitlijnen
Uitvullen
Genummerde lijst
Puntsgewijze lijst
Minder inspringen


Meer inspringen

HTML bewerken
Vet maken
Schuin zetten


Onderstrepen
Doorstrepen
Tekst kleur
Tekst Arceren


Haal de regel die er al staat weg en zet er bijvoorbeeld het volgende in:
--------------------------------------------------------------------------------

Speciale aanbiedingen!

INDESIT KOEL/VRIES COMBINATIE RA24

240 liter inhoud.


Automatische ontdooiing.
3 verstelbare legplateaus.
2 groenteladen.
4 sterren vriesgedeelte.
Energieklasse A = zeer zuinig.

Adviesprijs: € 359,-
Onze prijs: € 269,-

--------------------------------------------------------------------------------

Nu gaan we de tekst opmaken.


Selecteer “Speciale aanbiedingen!” en klik op het pijltje naast “normaal”.

Klik op “Kopje 1”

Selecteer “INDESIT KOEL/VRIES COMBINATIE RA24” en klik op het pijltje naast “normaal”.

Klik op “Kopje 2”


Zet voor elk van de komende regels een bolletje met behulp van deze knop:
Selecteer “€ 359,-” en klik op het meest rechtse van de drie pijltjes.
Klik op “1 (8pt)”

En klik op de knop
Selecteer “Onze prijs: € 269,-” en klik op de knop
Selecteer “€ 269,-” en klik op het meest rechtse van de drie pijltjes.
Klik op “3 (12pt)”


En klik op de knop en kies fel rood en klik op OK
De tekst ziet er nu zo uit:


--------------------------------------------------------------------------------
Speciale aanbiedingen!

INDESIT KOEL/VRIES COMBINATIE RA24



  • 240 liter inhoud.

  • Automatische ontdooiing.

  • 3 verstelbare legplateaus.

  • 2 groenteladen.

  • 4 sterren vriesgedeelte.

  • Energieklasse A = zeer zuinig.


Adviesprijs: € 359,-
Onze prijs: € 269,-

--------------------------------------------------------------------------------

Nu gaan we de bijpassende foto erbij zetten.

Ga ergens op de pagina staan.

Klik op de knop

Klik op de juiste foto

Klik op de knop

Sleep de foto met je muis op de juiste hoogte.
Klik 1x op de foto


Klik op de knop
Typ bij alternatieve tekst: Onze prijs: € 269,- (€ = alt + 5)
Lege ruimte horizontaal 10
Lege ruimte verticaal 10

Klik nu op de menuknop “Bewaren”.


Nu zie je de pagina, zoals die straks voor je bezoekers ook zichtbaar is. Dat viel mee hè? Ga nu eens met je muis boven de foto staan...
Op deze manier kun je dus alle pagina’s van je site van inhoud voorzien. Speel ermee. Probeer dingen uit. Je zult zien dat je er zo feeling voor krijgt. Veel succes!
Stap 6: Overige mogelijkheden
Weet je nog dat we niet alleen een hoofdmenupagina “Aanbiedingen” hebben gemaakt maar ook een submenupagina “Aanbiedingen”? Soms wil je namelijk op twee of meer plekken dezelfde pagina laten zien. Maar als er iets verandert dan wil je maar één pagina veranderen en niet allebei. Daar hebben we iets op gevonden.

Klik op “Bewerk site”
Klik op “Bewerk menu”
Klik op “Wijzigen” achter de
submenupagina “Aanbiedingen”

Zet het knopje achter “Welke inhoud heeft deze pagina” op “andere pagina”


en kies in het dropdownmenu de hoofdpagina: “Aanbiedingen”

Klik op “Wijzigen”

Klik nu op de knop “Bekijken”. Je komt dan weer in je site. Nu kun je op de submenuknop “Aanbiedingen” klikken en je zult zien dat die dezelfde inhoud heeft als hoofdmenuknop “Aanbiedingen”.
Altijd de actuele datum op je site?


  1. Kijk maar eens op deze website: http://www.alphamegahosting.com/51/nl

  2. Vul daar de velden in en klik op “Genereer code”
    Er verschijnt een pagina met een HTML code.

  3. Selecteer de hele tekst en kopieer deze (Crtl + c)

  4. Ga nu in de Sitemanager naar de pagina waar je de datum op wilt hebben staan.

  5. Klik op “Bewerk pagina”

  6. Klik op knop:

  7. Ga met de cursor helemaal links boven in het hoekje staan en plak de geselecteerde tekst in de HTML (Ctrl + v)

  8. Klik nogmaals op knop:


Wil je de kleur van de tekst veranderen?
Klik op knop:

In de eerste regel staat: color=#0000ff

0000ff staat voor fel blauw
ff0000 staat voor fel rood
00ff00 staat voor fel groen
ffff00 staat voor geel

000000 staat voor zwart


385878 staat voor donker blauw

9f009f staat voor paars


Je kunt zelf die paar cijfers en letters aanpassen en daarmee de kleur van de datum. Dit zijn je eerste ervaringen met HTML!!! Valt best mee hè!
Er staat in de eerste regel ook: face=verdana
Verdana is een lettertype. Je kunt dit bijvoorbeeld veranderen in: arial
Check even of in de laatste regel van de HTML code niet de huidige datum staat. Indien die er wel staat moet je die even verwijderen.
Belangrijk: Klik nu direct op de knop “Bewaren” en niet eerst op de knop

Je ziet nu het resultaat van je aanpassingen in de pagina van je site. Deze datum zal elke dag automatisch verspringen op de juiste stand!


De database wordt beschermd door het auteursrecht ©opleid.info 2016
stuur bericht

    Hoofdpagina