JavaScript Redigering
Med JavaScript-redigeraren kan du förvandla din vackra design till en fullt fungerande webbplats. Du får tillgång till kraftfull Sublime Text-liknande redigering med flera markörer och kortkommandon.
JS Filer
För att börja måste du skapa en JavaScript-fil i designpanelen. Du kan göra detta genom att högerklicka på "JavaScript"-gruppen och välja menyn Ny > JS-fil.
I samma meny finns det också ett par alternativ:
- JSON-fil - Skapa en JSON-fil för att lagra data. Dessa filer kan redigeras i appen precis som vanliga JS-filer, men används i syfte att hålla statisk data.
- JS-modul - Lägg till en MJS-fil till ditt projekt. Detta är en filtyp som mestadels är utbytbar med vanliga JS-filer men som används specifikt när man skriver JS-moduler.
- Mapp - Skapa en mapp för att organisera dina tillgångar. Mappar kan kapslas inuti varandra.
Notering
Om du använder OS X och högerklicka på "JavaScript"-etiketten inte gör någonting, prova Ctrl + Klicka-metoden eller kontrollera om högerklickning är aktiverat i din dators inställningar.
Importera JS Filer
För att importera en befintlig JS-fil, dra och släpp den till programfönstret eller högerklicka på gruppen JavaScript och välj Importera JS-fil.
Du kan skapa/importera så många filer du vill och organisera dem i mappar för att göra dem lättare att hantera.
Notering
- När du importerar js-filer gör du en kopia av dem i ditt projekt. Eventuella ändringar som görs i originalfilen kommer inte att göras visas i ditt projekt. Om detta inte är vad du vill kan du länka JS-filer istället.
- Tänk på att jQuery (om aktiverat) och Bootstrap JS-filerna importeras till Bootstrap Studio automatiskt, det finns ingen anledning att inkludera dem igen.
JS-filordning
När du arbetar med flera JS-filer, ibland krävs det att du specificerar inkluderingsordningen. För att göra detta, högerklicka på JavaScript-gruppen och välj Inkludera beställning.
Här kan du sortera om filerna efter behov och sedan klicka på knappen Spara. Dessa ändringar kommer att tillämpas på alla sidor i din design.
Notering
Bootstrap framework JS-filen ingår alltid först på sidan, före all annan kod.
Synlighet
När du högerklickar på en JS-fil och väljer alternativet Synlighet öppnas en dialogruta där du kan kontrollera dess synlighet på de olika sidorna i din design.
Redigera JS
För att redigera din JavaScript-fil, dubbelklicka bara den. Detta öppnar filen i Editor panel på en ny flik.
När du klickar på Apply-knappen (eller trycker på Ctrl/Cmd + S) laddas förhandsgranskningen automatiskt in så att du kan prova dina ändringar direkt (se vår handledning om Preview och Export för mer).
Editor Inställningar
Den inbyggda editorn erbjuder färgmarkering, flera val, sök och ersätt (
) med stöd för regex och andra användbara funktioner.
Det finns också ett antal anpassningsalternativ som finns tillgänglig från redaktörens snabbmeny.
Dessa inställningar låter dig justera teckenstorleken, växla mellan flikar eller mellanslag och öppna JS-filen i en Extern redigerare.
Länka extern JS
Bootstrap Studio låter dig länka externa JS-filer utan att importera dem, vilket kan vara användbart för saker som JS-bibliotek. Högerklicka på JavaScript-gruppen och välj Link External JS.
I dialogrutan kan du klistra in en URL till en externt värd JS-fil och den läggs till i din design. Externt länkade resurser lagras inte som filer i ditt projekt, utan de ingår i <script>-taggar före sidans avslutande <body>-tagg.
Bootstrap Studio cachar externa JS-filer under en tid. Om du vill få den senaste versionen av den länkade filen måste du högerklicka på den och välja alternativet Uppdatera.
