Hoe Embed de Mozilla Bespin Editor

Bespin is een Web-based code-editor die u kunt insluiten in uw website pagina's voor het bewerken van uw code direct vanuit uw browser. Het programma werd ontwikkeld door de Mozilla Labs en werkt in Mozilla Firefox, Google Chrome en Safari Web browsers. Bespin vereist twee bestanden om te kunnen functioneren naar behoren: een JavaScript-bestand dat het script Bespin bevat en een CSS-bestand gebruikt voor het maken van de code-editor correct weergegeven. Het vereist ook dat u wilt toewijzen een van de DIV-containers op uw Web-pagina met de "bespin" CSS klasse en "editor" ID aanduiding.

Instructies

1

Download en haal Bespin in een map op uw computer dat uw Web-pagina documenten bevat. De "BespinEmbedded.js" en "BespinEmbedded.css" bestanden moeten in dezelfde map als het document waarin u wilt insluiten Bespin.

2

Klik met de rechtermuisknop op het document van de webpagina die u wilt insluiten Bespin, en klik vervolgens op "Openen met". Schakel "Kladblok" of "WordPad" van de toepassingslijst, en klik vervolgens op 'OK'.

3

Klik om de cursor tussen de "< HEAD >" en "< / HEAD >" tags in de buurt van de bovenkant van het document en druk op "Enter" om een lege regel te maken.

4

Type "< script type = ' text/javascript' src='BespinEmbedded.js >< / script >" op de lege regel en druk op "Enter". Het document van de webpagina aan het Bespin JavaScript-bestand gekoppeld.

5

Type "< link href='BespinEmbedded.css' type = ' text/css' rel = 'stylesheet' >" en druk op "Enter". Deze coderegel verbindt het document van de Web-pagina met het opmaakmodel Bespin.

6

Klik om de cursor tussen de "< BODY >" en "< / BODY >" tags en druk op "Enter" om een lege regel te maken.

7

Typ de volgende regel code om te creƫren een DIV container met de ingesloten Bespin code-editor: < div id = 'editor' class = 'bespin' gegevens-bespinoptions ='{"instellingen": {"strictlines": waar}, "stealFocus": waar}'>

8

Typ de code die u wilt weergeven als bewerkbare binnen de DIV container.

9

Type "< / DIV >" om te sluiten van de DIV container.

10

Het menu "Bestand", klik op "Opslaan".