Användarhandbok Avbryt

Om Dreamweaver-mallar

  1. Användarhandbok för Dreamweaver
  2. Introduktion
    1. Grunderna i responsiv webbdesign
    2. Nyheter i Dreamweaver
    3. Webbutveckling med Dreamweaver – översikt
    4. Dreamweaver/vanliga frågor
    5. Kortkommandon
    6. Systemkrav för Dreamweaver
    7. Sammanfattning av funktioner
  3. Dreamweaver och Creative Cloud
    1. Synka inställningarna för Dreamweaver med Creative Cloud
    2. Creative Cloud Libraries i Dreamweaver
    3. Använda Photoshop-filer i Dreamweaver
    4. Arbeta med Adobe Animate och Dreamweaver
    5. Extrahera webboptimerade SVG-filer från bibliotek
  4. Arbetsytor och vyer i Dreamweaver
    1. Arbetsytan i Dreamweaver
    2. Optimera Dreamweaver-arbetsytan för visuell utveckling
    3. Söka efter filer baserat på filnamn eller innehåll | Mac OS
  5. Skapa webbplatser
    1. Om Dreamweaver-platser
    2. Skapa en lokal version av din webbplats
    3. Ansluta till en publiceringsserver
    4. Ställa i ordning en testserver
    5. Importera och exportera inställningarna för en Dreamweaver-plats
    6. För över befintliga webbplatser från en fjärrserver till din lokala platsrot
    7. Tillgänglighetsfunktioner i Dreamweaver
    8. Avancerade inställningar
    9. Ange platsinställningar för överföring av filer
    10. Ange proxyserverinställningar i Dreamweaver
    11. Synka inställningarna för Dreamweaver med Creative Cloud
    12. Använda Git i Dreamweaver
  6. Hantera filer
    1. Skapa och öppna filer
    2. Hantera filer och mappar
    3. Hämta och skicka filer till och från servern
    4. Checka in och checka ut filer
    5. Synka filer
    6. Jämför skillnader mellan filer
    7. Dölja filer och mappar på din Dreamweaver-plats
    8. Aktivera Design Notes för Dreamweaver-platser
    9. Sätta stopp för Gatekeeper
  7. Layout och design
    1. Använda visuella hjälpmedel för layout
    2. Layouta sidor med CSS
    3. Designa responsiva webbplatser med Bootstrap
    4. Skapa och använda mediefrågor i Dreamweaver
    5. Visa innehåll med tabeller
    6. Färger
    7. Responsiv design med flytande stödrasterlayouter
    8. Extract i Dreamweaver
  8. CSS
    1. Förstå Cascading Style Sheets (CSS)
    2. Utforma sidor med hjälp av CSS Designer
    3. Använda CSS-förbehandlare i Dreamweaver
    4. Ange CSS-formatinställningar i Dreamweaver
    5. Flytta CSS-regler i Dreamweaver
    6. Konvertera infogad CSS till en CSS-regel i Dreamweaver
    7. Arbeta med div-taggar
    8. Använda övertoningar på bakgrunden
    9. Skapa och redigera CSS3-övergångseffekter i Dreamweaver
    10. Formatera kod
  9. Sidinnehåll och resurser
    1. Ange sidegenskaper
    2. Ange CSS-rubrikegenskaper och CSS-länkegenskaper
    3. Arbeta med text
    4. Sök och ersätt text, taggar och attribut
    5. DOM-panel
    6. Redigera i live-vyn
    7. Koda dokument i Dreamweaver
    8. Markera och visa element i dokumentfönstret
    9. Ange textegenskaper i egenskapskontrollen
    10. Stavningskontrollera en webbsida
    11. Använda vågräta linjer i Dreamweaver
    12. Lägga till och ändra teckensnittskombinationer i Dreamweaver
    13. Arbeta med resurser
    14. Infoga och uppdatera datum i Dreamweaver
    15. Skapa och hantera favoritresurser i Dreamweaver
    16. Infoga och redigera bilder i Dreamweaver
    17. Lägga till medieobjekt
    18. Lägga till videor i Dreamweaver
    19. Infoga HTML5-video
    20. Infoga SWF-filer
    21. Lägga till ljudeffekter
    22. Infoga HTML5-ljud i Dreamweaver
    23. Arbeta med biblioteksobjekt
    24. Använda arabisk och hebreisk text i Dreamweaver
  10. Länkar och navigering
    1. Om länkar och navigering
    2. Länkning
    3. Bildmappningar
    4. Felsöka länkar
  11. jQuery-widgetar och effekter
    1. Använda jQuery-gränssnitt och mobilwidgetar i Dreamweaver
    2. Använd jQuery-effekter i Dreamweaver
  12. Koda webbplatser
    1. Om kodning i Dreamweaver
    2. Kodningsmiljön i Dreamweaver
    3. Ange kodningspreferenser
    4. Anpassa kodfärger
    5. Skriva och redigera kod
    6. Kodtips och kodkomplettering
    7. Komprimera och utöka kod
    8. Återanvända kod med fragment
    9. Granska kod
    10. Optimera kod
    11. Redigera kod i designvyn
    12. Arbeta med head-innehåll för sidor
    13. Infoga SSI i Dreamweaver
    14. Använda taggbibliotek i Dreamweaver
    15. Importera egna taggar i Dreamweaver
    16. Använda JavaScript-beteenden (allmänna instruktioner)
    17. Använda inbyggda JavaScript-beteenden
    18. Om XML och XSLT
    19. Utföra XSL-omvandlingar på servern i Dreamweaver
    20. Utföra XSL-omvandlingar på klienten i Dreamweaver
    21. Lägga till teckenentiteter för XSLT i Dreamweaver
    22. Formatera kod
  13. Arbetsflöden mellan produkter
    1. Installera och använda tillägg i Dreamweaver
    2. Uppdateringar i appen i Dreamweaver
    3. Infoga Microsoft Office-dokument i Dreamweaver (endast Windows)
    4. Använda Fireworks och Dreamweaver
    5. Redigera innehåll på Dreamweaver-webbplatser med Contribute
    6. Integrering mellan Dreamweaver och Business Catalyst
    7. Skapa anpassade e-postkampanjer
  14. Mallar
    1. Om Dreamweaver-mallar
    2. Känna igen mallar och mallbaserade dokument
    3. Skapa en Dreamweaver-mall
    4. Skapa ändringsbara regioner i mallar
    5. Skapa upprepande regioner och tabeller i Dreamweaver
    6. Använd valfria regioner i mallar
    7. Definiera redigerbara taggattribut i Dreamweaver
    8. Skapa kapslade mallar i Dreamweaver
    9. Redigera, uppdatera och ta bort mallar
    10. Exportera och importera XML-innehåll i Dreamweaver
    11. Lägga till eller ta bort en mall från ett befintligt dokument
    12. Redigera innehåll i Dreamweaver-mallar
    13. Syntaxregler för malltaggar i Dreamweaver
    14. Ange markeringsinställningar för mallområden
    15. Fördelar med att använda mallar i Dreamweaver
  15. Mobiler och flera skärmar
    1. Skapa mediefrågor
    2. Ändra sidorientering för mobila enheter
    3. Skapa webbappar för mobila enheter med Dreamweaver
  16. Dynamiska webbplatser, sidor och webbformulär
    1. Förstå webbprogram
    2. Konfigurera datorn för programutveckling
    3. Felsöka databasanslutningar
    4. Ta bort anslutningsskript i Dreamweaver
    5. Utforma dynamiska sidor
    6. Översikt över källor med dynamiskt innehåll
    7. Definiera källor med dynamiskt innehåll
    8. Lägga till dynamiskt innehåll på sidor
    9. Ändra dynamiskt innehåll i Dreamweaver
    10. Visa databasposter
    11. Ange och felsöka livedata i Dreamweaver
    12. Lägga till anpassade serverbeteenden i Dreamweaver
    13. Bygga formulär med Dreamweaver
    14. Använda formulär för att samla in information från användarna
    15. Skapa och aktivera ColdFusion-formulär i Dreamweaver
    16. Skapa webbformulär
    17. Förbättrat HTML5-stöd för formulärelement
    18. Använda Dreamweaver för att utveckla ett formulär
  17. Bygga program visuellt
    1. Bygga huvud- och detaljsidor i Dreamweaver
    2. Bygga sök- och resultatsidor
    3. Bygga en postinmatningssida
    4. Bygga en postuppdateringssida i Dreamweaver
    5. Bygga postborttagningssidor i Dreamweaver
    6. Förändra en databas med hjälp av ASP-kommandon i Dreamweaver
    7. Bygga en registreringssida
    8. Bygga en inloggningssida
    9. Bygga en sida som bara behöriga användare har åtkomst till
    10. Skydda mappar i ColdFusion med Dreamweaver
    11. Använda ColdFusion-komponenter i Dreamweaver
  18. Testa, förhandsgranska och publicera webbplatser
    1. Förhandsgranska sidor
    2. Förhandsgranska Dreamweaver-webbsidor på flera enheter
    3. Testa Dreamweaver-platsen
  19. Felsökning
    1. Korrigerade problem
    2. Kända fel

 

 

Läs om hur du använder Dreamweaver-mallar för att utforma en ”fast” sidlayout och sedan skapa dokument som är baserade på mallen som ärver dess sidlayout.

En mall är en särskild typ av dokument som du använder för att utforma en ”fast” sidlayout. Du kan sedan skapa dokument som är baserade på mallen som ärver dess sidlayout. När du utformar en mall anger du innehåll som ”redigerbart” som användare kan redigera i ett dokument som är baserat på den mallen. Med mallar kan mallskaparen styra vilka sidelement användarna, t.ex. författare, grafiska formgivare eller andra webbutvecklare, kan redigera. Det finns flera typer av mallområden som mallskaparen kan inkludera i ett dokument.

Obs!

Med mallar kan du styra ett stort designområde och återanvända hela layouter. Om du vill återanvända enskilda designelement, t.ex. upphovsrättsinformation eller en logotyp, skapar du biblioteksposter.

Med mallar kan du uppdatera flera sidor samtidigt. Ett dokument som skapas från en mall förblir kopplad till den mallen (såvida du inte kopplar loss dokumentet senare). Du kan ändra en mall och direkt uppdatera designen i alla dokument som baseras på den.

Obs!

Mallar i Dreamweaver skiljer sig från mallar i vissa andra Adobe Creative Cloud-program på så sätt att sidavsnitten i Dreamweaver-mallar som standard är fasta (inte går att redigera).

Typer av mallområden

När du sparar ett dokument som en mall är de flesta områden i ett dokument låsta. Som mallskapare anger du vilka områden i ett mallbaserat dokument som ska gå att redigera genom att infoga ändringsbara regioner eller redigerbara parametrar i mallen.

När du skapar mallen kan du ändra både redigerbara och låsta regioner. I ett dokument som baseras på en mall kan dock användaren bara göra ändringar i ändringsbara regioner. Låsta områden går inte att ändra.

Det finns fyra typer av mallområden:

En ändringsbar region: Ett olåst område i ett mallbaserat dokument, ett avsnitt som mallanvändaren kan redigera. En mallskapare kan ange ett område i en mall som redigerbart. För att en mall ska vara effektiv bör den innehålla minst en ändringsbar region, annars kan inte sidor som är baserade på mallen redigeras. Mer information om redigerbara områden finns i Skapa redigerbara områden i mallar.

En upprepande region: Ett avsnitt i dokumentlayouten som är angivet så att mallanvändaren kan lägga till eller ta bort kopior av den upprepande regionen som är baserad på mallen vid behov. Du kan t.ex. ange att en tabellrad ska upprepas. Upprepade avsnitt är redigerbara så att mallanvändaren kan redigera innehållet i det upprepade elementet medan själva designen styrs av mallskaparen.

Det finns två typer av upprepande regioner som du kan infoga i en mall: upprepande region och upprepande tabell. Mer information om hur du arbetar med upprepande regioner finns i Skapa upprepande regioner och tabeller i Dreamweaver.

En valfri region: Ett avsnitt i en mall som har ett innehåll, t.ex. text eller en bild, som kan visas eller ej i ett dokument. På den mallbaserade sidan styr oftast mallanvändaren om innehållet visas eller ej. I avsnittet Valfri region finns mer information.

Ett ändringsbart taggattribut: Gör att du kan låsa upp ett taggattribut i en mall så att du kan redigera attributet på en mallbaserad sida. Du kan t.ex. låsa vilken bild som visas i dokumentet, men låta mallanvändaren ange justeringen som vänster, höger eller mitten. Mer information finns i Definiera redigerbara taggattribut i Dreamweaver.

När du skapar en mallfil genom att spara en befintlig sida som en mall uppdateras den nya mallen i mappen Mallar och länkar i filen så att deras dokumentberoende sökvägar är korrekta. När du sedan skapar ett dokument som är baserat på den mallen och sparar det uppdateras alla dokumentberoende länkar på nytt för att peka på de rätta filerna.

När du lägger till en ny dokumentberoende länk i en mallfil är det lätt att skriva fel namn på sökvägen om du skriver in sökvägen i länktextrutan i egenskapskontrollen. Den rätta sökvägen i en mallfil är sökvägen från mappen Mallar till det länkade dokumentet, inte sökvägen från det mallbaserade dokumentets mapp till det länkade dokumentet. Se till att det är rätt sökvägar för länkarna genom att använda antingen mappikonen eller ikonen Peka på fil i egenskapskontrollen när du skapar länkar i mallar.

Serverskript i mallar och mallbaserade dokument

Vissa serverskript infogas i början eller slutet av ett dokument (före <html>-taggen eller efter </html>-taggen). Sådana skript kräver särskild hantering i mallar och mallbaserade dokument. I vanliga fall gör du ändringar i skriptkoden före <html>-taggen eller efter </html>-taggen i en mall. Ändringarna kopieras inte till dokument som är baserade på den mallen. Detta kan orsaka serverfel om andra serverskript i huvuddelen av mallen som är beroende av skripten inte kopieras. Du får en varning om du ändrar skript före <html>-taggen eller efter </html>-taggen i en mall.

Om du vill undvika det här problemet kan du infoga följande kod i head-sektionen i mallen:

<!-- TemplateInfo codeOutsideHTMLIsLocked="true" -->

När den här koden finns i mallen kopieras ändringar av skript före <html>-taggen eller efter </html>-taggen till dokument som är baserade på den mallen. Du kommer dock inte längre kunna redigera dessa skript i dokument som är baserade på mallen. Men du kan välja att antingen kunna redigera dessa skript i mallen eller i dokument som är baserade på mallen, men inte båda.

Mallparametrar

Mallparametrar anger värden för att styra innehåll i dokument som är baserade på en mall. Använd mallparametrar för valfria regioner eller redigerbara taggattribut eller för att ange värden som du vill skicka till ett kopplat dokument. Välj ett namn, en datatyp och ett standardvärde för varje parameter. Varje parameter måste ha ett unikt namn som är skiftlägeskänsligt. De måste vara någon av dessa fem tillåtna datatyper: text, boolesk, färg, URL-adress eller siffra.

Mallparametrar skickas till dokumentet som instansparametrar. I de flesta fall kan en mallanvändare redigera parameterns standardvärde för att anpassa det som visas i ett mallbaserat dokument. I andra fall kan mallskaparen bestämma vad som visas i dokumentet baserat på värdet för ett malluttryck.

Malluttryck

Malluttryck är satser som beräknar eller utvärderar ett värde.

Du kan använda ett uttryck för att spara ett värde och visa det i ett dokument. Ett uttryck kan t.ex. vara så enkelt som värdet för en parameter, t.ex. @@(Param)@@ eller tillräckligt komplicerat för att beräkna värden som växlar bakgrundsfärg i en tabellrad, t.ex. @@((_index & 1) ? röd : blå)@@.

Du kan även definiera uttryck för if- och multiple if-villkor. När ett uttryck används i en villkorssats utvärderar Dreamweaver det som sant eller falskt. Om villkoret är sant visas den valfria regionen i det mallbaserade dokumentet. Om det är falskt visas det inte.

Du kan definiera uttryck i kodvyn eller i dialogrutan Valfri region när du infogar en valfri region.

I kodvyn finns två sätt att definiera malluttryck: använd kommentaren <!-- TemplateExpr expr="ditt uttryck"--> eller @@(ditt uttryck)@@. När du infogar uttrycket i mallkoden visas en uttrycksmarkör i designvyn. När du använder mallen utvärderar Dreamweaver uttrycket och visar värdet i det mallbaserade dokumentet.

Språk för malluttryck

Språket för malluttryck är en liten delmängd med JavaScript och använder JavaScript-syntax och företrädesregler. Använd JavaScript-operatörer för att skriva ett uttryck som detta:

@@(firstName+lastName)@@

Följande funktioner och operatörer stöds:

  • numeriska konstanter, strängkonstanter (endast syntax med dubbla cittatecken), booleska konstanter (sant eller falskt)

  • variabelreferens (se listan med definierade variabler senare i det här avsnittet)

  • fältreferens (”punktoperatören”)

  • unära operatörer: +, -, ~, !

  • binära operatörer: +, -, *, /, %, &, |, ^, &&, ||, <, <=, >, >=, ==, !=, <<, >>

  • villkorsstyrd operatör: ?:

  • parenteser: ()

    Följande datatyper används: boolesk, flyttal med IEEE 64 bitar per kanal, sträng och objekt. Dreamweaver-mallar stöder inte användning av JavaScript-typerna ”null” eller ”undefined”. Scalar-typer tillåts inte heller att underförstått konverteras till ett objekt, därmed skulle uttrycket "abc".length framkalla ett fel istället för att ge värdet 3.

    De enda objekten som är tillgängliga är de som definieras av objektsmodellen för uttryck. Följande variabler är definierade:

    _document

    Innehåller malldata på dokumentnivå med ett fält för varje parameter i mallen.

    _repeat

    Endast definierad för uttryck som visas inuti en upprepad region. Innehåller inbyggd information om regionen

    _index

    Det numeriska indexet (från 0) för den aktuella posten

    _numRows

    Det totala antalet poster i denna upprepade region

    _isFirst

    Sant om den aktuella posten är den första posten i dess upprepade region

    _isLast

    Sant om den aktuella posten är den sista posten i dess upprepade region

    _prevRecord

    _repeat-objektet för den föregående posten. Det är fel att öppna denna egenskap för den första posten i regionen.

    _nextRecord

    _repeat-objektet för nästa post. Det är fel att öppna denna egenskap för den sista posten i regionen.

    _parent

    I en kapslad upprepad region ger detta _repeat-objektet för den avgränsande (yttre) upprepade regionen. Det är fel att öppna denna egenskap utanför en kapslad upprepad region.

    Under utvärderingen av uttrycket är alla fält för _document-objektet och _repeat-objektet tillgängliga. Du kan t.ex. ange title istället för _document.title för att öppna dokumentets rubrikparametrar.

    I de fall där det förekommer en fältkonflikt har fälten för _repeat-objektet företräde före fälten för _document-objektet. Därför ska du inte behöva hänvisa uttryckligen till _document eller _repeat förutom att _document kan behövas inuti en upprepad region för att hänvisa till dokumentparametrar som är dolda av parametrar för upprepade regioner.

    När kapslade upprepade regioner används är endast fält för de innersta upprepade regionerna tillgängliga. Yttre regioner måste uttryckligen hänvisas till med _parent.

Multiple If-villkor i mallkod

Du kan definiera malluttryck för if- och multiple if-villkor. I det här exemplet visas hur du anger en parameter som heter ”Dept”, anger ett första värde och definierar ett multiple if-villkor som avgör vilken logotyp som ska visas.

Följande är ett exempel på koden som du kan ange i head-sektionen i mallen:

<!-- TemplateParam name="Dept" type="number" value="1" -->

Följande villkorssats kontrollerar värdet som tilldelats parametern Dept. När villkoret är sant eller överensstämmer visas lämplig bild.

<!-- TemplateBeginMultipleIf --> 
<!-- checks value of Dept and shows appropriate image--> 
<!-- TemplateBeginIfClause cond="Dept == 1" --> <img src=".../sales.gif"> <!-- TemplateEndIfClause --> 
<!-- TemplateBeginIfClause cond="Dept == 2" --> <img src=".../support.gif"> <!-- TemplateEndIfClause--> 
<!-- TemplateBeginIfClause cond="Dept == 3" --> <img src=".../hr.gif"> <!-- TemplateEndIfClause --> 
<!-- TemplateBeginIfClause cond="Dept != 3" --> <img src=".../spacer.gif"> <!-- TemplateEndIfClause --> 
<!-- TemplateEndMultipleIf -->

När du skapar ett mallbaserat dokument skickas mallparametrarna automatiskt till det. Mallanvändaren avgör vilken bild som ska visas.

Få hjälp snabbare och enklare

Ny användare?