Legge inn eksterne skjema
Dersom du skal legge inn nyhetsbrevpåmelding til MailChimp, eller andre skjemaer som ikke kommer i en iframe, på en side som er bygget med asp.net er det ikke bare å lime form-taggen rett inn. Her er et løsningsforslag.
I dette Exampleet skal vi legge inn påmelding til nyhetsbrev fra MailChimp i en side som er bygget med Bootstrap. Vi løser det ved å lage en knapp som en trykker på som viser påmeldingsskjemaet i en modal boks.
Steg 1. Få tak i html-koden til påmeldingsskjemaet.
Dette gjøres på nettsiden til leverandøren, i dette tilfellet mailchimp.com
Steg 2. Legge inn koden i index.master
Lim inn koden rett under </form> som allerede ligger i index.master.
Steg 3. Finn kode for modal boks
Koden ligger på bootstraps nettside, og ser i versjon 2.2.2 slik ut:
<a href="#myModal" role="button" class="btn" data-toggle="modal">Launch demo modal</a>
<!-- Modal -->
<div id="myModal" class="modal hide fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
<h3 id="myModalLabel">Modal header</h3>
</div>
<div class="modal-body">
<p>One fine body…</p>
</div>
<div class="modal-footer">
<button class="btn" data-dismiss="modal" aria-hidden="true">Close</button>
<button class="btn btn-primary">Save changes</button>
</div>
</div>
Steg 4. Klarggjør den modale boksen
Plasser koden for den modale boksen rundt koden fra den eksterne leverandøren slik at den blir liggende der det står "One Fine body..." i koden over. Tilpass også tittelen og fjern eller tilpass lagre-knappen.
Steg 5. Plasser knappen der du vil ha den
Til slutt må knappen/lenken "Launch demo modal" plasseres et annet sted på siden og få angitt en passende tekst og form. Du kan plassere den i layouten, en sublayout, en snippet eller i en rendering.