Redigera ditt kontaktformulär

På N.nu så finns det ett kraftfullt inbyggt kontaktformulär. Bara använd koden ##CONTACT-FORM## varsom helst för att få fram det. Då får man med fält för namn, e-post, ämne och meddelande.

Nu har jag gjort det möjligt att själv kunna redigera sitt kontaktformulär. Detta kräver att man växlar till HTML-läge och klistrar in koden nedan:

<!-- Här börjar koden -->
##BEGIN-CUSTOM-CONTACT-FORM##
<fieldset id="contact-form">
<label>Namn:</label><br />
<input name="name" type="text" required><br />
<label>E-post *:</label><br />
<input name="email" type="email" required><br />
<label>Ämne:</label><br />
<input name="subject" type="text"><br />
<label>Telefonnummer:</label><br />
<input name="phone_number" type="text"><br />
<label>Meddelande *:</label><br />
<textarea cols="40" rows="10" name="message" required ></textarea><br />
<input id="contact-button" name="submit" type="submit" value="Skicka meddelande" />
</fieldset>
##END-CUSTOM-CONTACT-FORM##
<!-- Här slutar koden -->

Som ni ser finns det nu tillagt fält för telefonnummer. Du kan ändra från name="phone_number" till name="phone_number_required" för att kräva telefonnummer för att skicka formuläret. Sätt i så fall en * så att folk förstår att du kräver det.

Det finns även möjlighet till ett valfritt fält som du kan kalla vad du vill. Använd då <input name="custom" type="text"> eller <input name="custom_required" type="text"> om du kräver att det ska vara ifyllt. Detta kan även ändras till textarea precis som med meddelandet om du vill ha en större ruta som ska fyllas i.

Du kan även nu ta bort "Ämne" och "Namn" om du skulle vilja det och ändra texten "Skicka meddelande".

Med denna lösning kan du bara ett extra fält. Om du vill ha fler så rekommenderar jag då wufoo.com som du kan bädda in på hemsidan.

Om du vill ändra utseendet

Om du vill ändra hur ditt kontaktformulär ser ut så är det CSS du ska jobba med. Leta efter #contact-form vilket brukar vara längst ner i din CSS-fil.

10 nov 2011
Comments powered by Disqus

Andra inlägg