Hoe wijzig ik mijn google layout van mijn formulier om hem mooi te maken (mooier dus).
Ik gebruik redelijk vaak Google formulieren, ze zijn handig, je maakt ze snel, ze zijn betrouwbaar, en het mooiste van alles, je kunt samenwerken binnen het document. Echter, de opmaak van het formulier laat te wensen over en is, ach ja, hoe kan je het het beste verwoorden, google-achtig. Lekker simpel, je weet meteen waar je aan toe bent. Opzich heb ik daar geen problemen mee, echter er zijn mensen die willen het formulier in de opmaak / style van hun eigen website. Een google formulier opmaken is niet moeilijk, ik ga je straks uitleggen hoe je dat moet doen.
CSS opmaken zodat je google formulier er mooier uitziet
Ik gebruik css (cascade style sheets) voor de opmaak van al mijn websites. Het is handig, want een verandering in 1 file veranderd je hele website. Zo ook je google formulieren. Je google formulier veranderen door css toe te passen is perfect, ik ga uitleggen hoe je dit doet.
Layout van de google formulieren anders maken kan door onderstaande op je eigen site door te voeren, het is simpel en effectief. Als in de loop der tijd google wijzigt zal deze pagina niet meewijzigen.
stap 1
Meld je aan voor een google Docs account, of login je google docs account
stap 2
Klik op nieuw, en begin een nieuw formulier (nieuw --> formulier),
stap 3
Maak het gewenste formulier (een kind kan de was doen)
stap 4
Als je het formulier klaar hebt, kan je onderaan het formulier klikken op ‘You can view the published form here’. Ik werk met Engelstalige Apple computers, kan het niet wijzigen. Het is in iedergeval de link onderaan je formulier. Deze ziet er ongeveer zo uit:
- http://spreadsheets.google.com/viewform?formkey=cFVBRUlNdzJZYzJxRExnaE
stap 5
>> een pagina opent, en deze ziet er zo uit (klik)
Rechtermuisknop op de pagina (maakt niet uit waar) om de broncode te bekijken.
Kopieer nu alles tussen <form... en /form>. Plak deze informatie op de pagina waar je het formulier wilt hebben.
Het formulier ziet er nu zo uit:
stap 6
Nu kan je het formulier gaan opmaken. Plak de css code tussen je <head> tags.
>> bekijk het google formulier nu opgemaakt.
stap 7
Nu je een mooi opgemaakte google formulier hebt, zit je nog met 1 probleem. Als het formulier ingevuld is krijg je zo een "lelijke" comfirmation page terug. Om dit te veranderen kan je een stukje javascript op je formulier zetten:
Verander:
<form action="jou-google-spreadsheet-link" method="POST">
Met:
<script type="text/javascript">var submitted=false;</script>
<iframe name="hidden_iframe" id="hidden_iframe"
style="display:none;" onload="if(submitted)
{window.location='http://jou-dank-je-wel-pagina.html;}"></iframe>
<form action="jou-dank-je-wel-pagina" method="post"
target="hidden_iframe" onsubmit="submitted=true;">
Dit stukje javascript had ik ooit ergens gevonden, ik kan mij niet meer herinneren waar ik deze vandaan heb. Ben jij de auteur mail mij dan even, kan ik dit hierbij vermelden.
Belangrijk
Het veranderen van google formulieren (de opmaak) als je verplichte velden hebt, werkt het java script niet voor de "dankje" pagina. Gebruik dit dus alleen als je geen verplichte velden hebt.
Ik krijg vaak mail binnen over vragen m.b.t. het opmaken van dit formulier. 99 van de 100 keer staat het andwoord op deze pagina. Mocht het niet lukken dan heeft u iets niet goed gedaan. Mijn advies is dan om gewoon weer helemaal overnieuw te beginnen. Het formulier werkt 100% gegarandeerd.
