Werken met middelen

Laatst bijgewerkt op 25 apr. 2024

Gebruik het deelvenster Middelen in Dreamweaver voor het beheer van middelen op de huidige site.

Met Adobe Dreamweaver kunt u de elementen (middelen) bijhouden en voorvertonen die zijn opgeslagen op uw site, zoals afbeeldingen, films, kleuren, scripts en koppelingen. Ook kunt een element rechtstreeks slepen om dit in een pagina van het huidige document in te voegen.

Middelen zijn beschikbaar via verschillende bronnen. Je kunt bijvoorbeeld assets maken in een applicatie zoals Adobe Photoshop of Adobe Animate, ze ontvangen van een collega, ze kopiëren van een clip-art-cd of een website met afbeeldingen.

Dreamweaver biedt tevens toegang tot twee speciale typen middelen: bibliotheken en sjablonen. Beide zijn gekoppelde middelen: als u een bibliotheekitem of sjabloon bewerkt, werkt Dreamweaver alle documenten bij waarin deze middelen worden gebruikt. Over het algemeen bestaan bibliotheekitems uit kleine ontwerpelementen, zoals het logo of copyrightgegevens van een site. Voor het aansturen van een groter ontwerpgebied gebruikt u een sjabloon.

Gebruik het deelvenster Middelen (Venster > Middelen) voor het beheer van middelen op de huidige site. Het middelenpaneel geeft elementen weer voor de site die is gekoppeld aan het actieve document in het documentvenster.

Notitie

Voordat elementen worden weergegeven in het middelenpaneel dient u eerst een lokale site te definiëren.

Deelvenster Middelen in Live View
Deelvenster Middelen in Live View

Deelvenster Middelen in de ontwerpweergave en codeweergave

Het Assets-deelvenster biedt verschillende manieren om assets te bekijken:

Sitelijst

Toont alle assets in je site, inclusief kleuren en URL's die worden gebruikt in elk document in je site.

Lijst Favorieten

Hiermee worden alleen de elementen weergegeven, die u expliciet hebt gekozen.

Om te schakelen tussen deze twee weergaven, selecteer je het keuzerondje Site of Favorieten boven het voorvertoningsgebied.(Deze twee weergaven zijn niet beschikbaar voor de categorieën Sjablonen en Bibliotheek.)

Notitie

De meeste bewerkingen van het deelvenster Middelen werken voor beide lijsten hetzelfde. Er zijn echter enkele taken die u alleen in de lijst Favorieten kunt uitvoeren.

In beide lijsten vallen elementen in een van de volgende categorieën:

Afbeeldingen

Afbeeldingsbestanden in GIF-, JPEG- of PNG-formaten.

Kleuren

Kleuren gebruikt in documenten en stijlpagina's, inclusief kleuren van tekst, achtergronden en koppelingen.

URL's

Externe koppelingen in je huidige sitedocumenten, inclusief FTP-, gopher-, HTTP-, HTTPS-, JavaScript-, e-mail (mailto)- en lokaal bestand (file://)-koppelingen.

Media

Mediabestanden zoals Adobe Flash (alleen SWF)-bestanden, Adobe Shockwave-bestanden, QuickTime- of MPEG-bestanden.

Scripts

JavaScript- of VBScript-bestanden. Scripts in HTML-bestanden (in tegenstelling tot zelfstandige JavaScript- of VBScript-bestanden) worden niet weergegeven in het deelvenster Middelen. Deze categorie is alleen beschikbaar in de weergave Code en Ontwerp.

Sjablonen

Indelingen voor hoofdpagina's die op meerdere pagina's worden gebruikt. Wanneer u sjabloon wordt gewijzigd, worden tevens automatisch alle pagina's gewijzigd, die hieraan zijn gekoppeld. Deze categorie is alleen beschikbaar in de weergave Code en Ontwerp.

Bibliotheekitems

Ontwerpelementen die u op meerdere pagina's gebruikt; wanneer u een bibliotheekitem wijzigt, worden op alle pagina's met dat item bijgewerkt. Deze categorie is alleen beschikbaar in de weergave Code en Ontwerp.

Notitie

Voor weergave in het deelvenster Middelen dient een bestand in een van deze categorieën te vallen. Bepaalde andere typen bestanden worden soms middelen genoemd, maar worden niet in het deelvenster weergegeven.

Standaard worden assets in een categorie alfabetisch op naam vermeld, maar je kunt ze sorteren op type en verschillende andere criteria.Je kunt ook assets voorvertonen en de kolommen en het voorvertoningsgebied aanpassen.

Het Creative Cloud-pictogram in de kolom Type geeft aan dat de bijbehorende middelen zijn geïmporteerd vanuit Creative Cloud Libraries. U kunt op het Creative Cloud-pictogram dubbelklikken om resampling voor de bijbehorende middelen uit te voeren. Voor meer informatie over het hergebruiken van assets in Creative Cloud Libraries, zie Creative Cloud Libraries in Dreamweaver.

Een middel in het voorbeeldgebied weergeven

Selecteer het middel in het deelvenster Middelen.

Middelen in een categorie weergeven

Klik op een categoriepictogram aan de linkerkant van het Assets-paneel.

Middelen sorteren

Klik op een kolomkop.

Om bijvoorbeeld de lijst met afbeeldingen te sorteren op type (zodat alle GIF-afbeeldingen bij elkaar staan, alle JPEG-afbeeldingen bij elkaar, enzovoort), klik je op de kolomkop Type.

Het formaat van een kolom wijzigen

Sleep de lijn die twee kolomkoppen scheidt.

Het formaat van het voorbeeldgebied wijzigen

Sleep de splitterbalk (tussen het voorvertoningsgebied en de lijst met assets) omhoog of omlaag.

Het deelvenster Middelen vernieuwen

Het kan enkele seconden duren om de sitelijst te maken omdat Dreamweaver eerst de sitecache moet lezen.

Bepaalde wijzigingen worden niet onmiddellijk in het deelvenster Middelen weergegeven. Wanneer u bijvoorbeeld een middel toevoegt aan of verwijdert van de site, worden de wijzigingen pas in het deelvenster Middelen weergegeven als u de lijst Site vernieuwt door op de knop Sitelijst vernieuwen te klikken. Als je een asset toevoegt of verwijdert buiten Dreamweaver om—met Windows Explorer of de Finder bijvoorbeeld—moet je de site-cache opnieuw opbouwen om het Assets-paneel bij te werken.

Wanneer u het enige exemplaar van een bepaalde kleur of URL op uw site verwijdert of wanneer u een nieuw bestand opslaat met een nog niet eerder op de site gebruikte kleur of URL, worden de wijzigingen pas zichtbaar in het middelenpaneel wanneer u de sitelijst vernieuwt.

  • Om de sitelijst handmatig te vernieuwen, klik je op de knop Sitelijst vernieuwen .Dreamweaver maakt de site-cache aan of werkt het indien nodig bij.
  • Om de sitelijst te vernieuwen en handmatig de sitecache opnieuw op te bouwen, klik je met de rechtermuisknop (Windows) of Cmd+klik (Macintosh) in de Assets-lijst en selecteer je Sitelijst vernieuwen.

Een middel aan een document toevoegen

U kunt de meeste middelen in een document invoegen door deze in Live View, de codeweergave of de ontwerpweergave naar het documentvenster te slepen of door de knop Invoegen van het deelvenster te gebruiken. Je kunt de assets slepen vanuit zowel de lijstweergave als het voorvertoningsvenster van het Assets-panel.

Opmerking: Slepen vanuit het voorvertoningsvenster wordt alleen ondersteund op Mac.

U kunt kleuren en URL's invoegen in ontwerpweergave of Live View. In de ontwerpweergave kun je kleuren en URL's toepassen op geselecteerde elementen.

 

Plaats in het document het invoegpunt waar je wilt dat de asset verschijnt.

Selecteer in het Assets-deelvenster een van de knoppen voor assetcategorieën aan de linkerkant.
Notitie

U kunt elke categorie behalve Sjablonen selecteren. Een sjabloon wordt toegepast op een heel document; het kan niet in een document worden ingevoegd.

Selecteer Site of Favorieten bovenin het venster en selecteer vervolgens de asset.

Er zijn geen site- of favorieten-lijsten voor bibliotheekitems; sla deze stap over als je een bibliotheekitem invoegt.

Voer een van de volgende stappen uit:
  • Sleep het middel van het deelvenster naar het document. Je kunt slepen vanuit de lijstweergave en ook vanuit het voorvertoningsvenster.

    Opmerking: In Windows kun je geen assets slepen vanuit het voorvertoningsvenster.

    U kunt scripts naar het kopinhoudsgebied van het documentvenster slepen. Als dat gebied niet zichtbaar is, selecteert u Weergave > Kopinhoud.

  • Selecteer het element in het paneel en klik op Invoegen.

    Als het ingevoegde element uit een kleur bestaat, wordt deze toegepast op de tekst achter de invoegpositie.

Kleur toepassen op tekst met het Assets-deelvenster

Het Assets-deelvenster toont de kleuren die je al hebt toegepast op verschillende elementen, zoals tekst, tabelranden, achtergronden, enzovoort.

Voer in Ontwerpweergave de volgende stappen uit:

Selecteer de tekst in het document.

Selecteer in het Assets-deelvenster de categorie Kleuren.

Selecteer de gewenste kleur en klik op Toepassen.

Voer in Liveweergave de volgende stappen uit:

Selecteer in het Assets-deelvenster de categorie Kleuren.

Voer een van de volgende stappen uit:

  • Klik met de rechtermuisknop op de kleur in het deelvenster Middelen en klik op Kleurwaarde kopiëren. De kleurwaarde wordt naar het klembord gekopieerd. Je kunt nu de kleurwaarde plakken (Ctrl+v, Cmd+v) in CSS Designer.
  • Sleep de kleur uit de voorvertoning en plaats de muisaanwijzer boven elementen in Live View.Wanneer je de kleur neerzet, verschijnt het dialoogvenster Nieuwe CSS-regel. Wanneer je op OK klikt, wordt de kleur toegepast op het geselecteerde element.
  • Klik op Toepassen in het deelvenster Middelen. Het dialoogvenster Nieuwe CSS-regel verschijnt en wanneer je op OK klikt, wordt de kleur toegepast op het geselecteerde element.

URL's toewijzen aan afbeeldingen of tekst

Voer in Ontwerpweergave de volgende stappen uit:

Selecteer de tekst of afbeelding.

Selecteer in het deelvenster Assets de categorie URL's in de weergave Sites of Favorieten, afhankelijk van waar de URL is opgeslagen.

Notitie

URL's voor de bestanden van je site worden standaard opgeslagen in de weergave Sites. De weergave Favorieten bevat URL's die je zelf hebt toegevoegd.

Selecteer de URL.
Voer een van de volgende handelingen uit:
  • Sleep de URL van het deelvenster naar de selectie in Ontwerpweergave.

  • Selecteer eerst de URL en klik vervolgens op Invoegen.

Voer in Live-weergave de volgende stappen uit:

Selecteer in het Assets-paneel de URL-categorie in de weergave Sites of Favorieten, afhankelijk van waar de URL is opgeslagen.

Voer een van de volgende stappen uit:

  • Sleep de URL vanuit de voorvertoning of de lijstweergave. Plaats de muisaanwijzer boven elementen in Live View. Wanneer je de URL neerzet, wordt het element dat is gemarkeerd in Live-weergave omhuld met <a>.
  • Klik op het gewenste element in Live View. Kies de URL in het deelvenster Middelen en klik op Toepassen. Het geselecteerde element wordt omhuld met de <a>-tag.

Middelen selecteren en bewerken

In het Assets-paneel kun je meerdere assets tegelijk selecteren.Tevens biedt het een snelle manier om te beginnen met het bewerken van middelen.

Meerdere middelen selecteren

Selecteer een middel in het deelvenster Middelen.
Selecteer de overige middelen op een van de volgende manieren:
  • Shift+klik om een opeenvolgende reeks assets te selecteren.

  • Control+klik (Windows) of Command+klik (Macintosh) om een individuele asset aan de selectie toe te voegen (ongeacht of deze aansluit op de bestaande selectie).Control+klik of Command+klik op een geselecteerde asset om de selectie ervan op te heffen.

Een middel bewerken

Wanneer je een asset bewerkt in het Assets-paneel, varieert het gedrag volgens het asset-type.Voor sommige assets, zoals afbeeldingen, gebruik je een externe editor die automatisch wordt geopend als je een editor hebt gedefinieerd voor dat assettype.Je kunt kleuren en URL's alleen bewerken in de lijst Favorieten.Wanneer je sjablonen en bibliotheekitems bewerkt, breng je de wijzigingen aan binnen Dreamweaver.

Voer in het Assets-paneel een van de volgende handelingen uit:
  • Dubbelklik op het middel.

  • Selecteer de asset en klik op de knop Bewerken.

Notitie

Als het element moet worden bewerkt in een externe editor, maar niet automatisch een editor wordt gestart, selecteert u Bewerken > Voorkeuren (Windows) of Dreamweaver > Voorkeuren (Macintosh). Selecteer de categorie Bestandstypen/Editors en zorg ervoor dat u voor dat type element een externe editor hebt gedefinieerd.

Breng uw wijzigingen aan.
Als u klaar bent, voert u een van de volgende handelingen uit:
  • Als het middel bestaat uit een bestand (dus alles behalve een kleur of URL), slaat u dit op (in de editor die u gebruikt) en sluit u het.

  • Als het element bestaat uit een URL, klikt u op OK in het dialoogvenster URL bewerken.

Notitie

Als het element bestaat uit een kleur, wordt de kleurkiezer automatisch gesloten nadat u de kleur hebt gekozen. Als u de kleurkiezer wilt afsluiten zonder een kleur te kiezen, drukt u op Esc.

Elementen opnieuw gebruiken op een andere site

Het Assets-deelvenster toont alle assets (van herkende typen) in je huidige site.Om een asset van de huidige site in een andere site te gebruiken, moet je deze naar de andere site kopiëren.Je kunt een individuele asset, een set van individuele assets of een hele map Favorieten tegelijk kopiëren.

Mogelijk moet je het bestand in het deelvenster Bestanden opzoeken dat overeenkomt met een asset in het Assets-deelvenster voordat je de asset naar of van je externe site overbrengt.

Notitie

Het deelvenster Bestanden toont mogelijk een andere site dan de site die het Assets-deelvenster toont.Dit komt doordat het Assets-deelvenster is gekoppeld aan het actieve document.

Een assetbestand zoeken in het deelvenster Bestanden

Selecteer in het Assets-paneel de categorie van de asset die je wilt vinden.
Klik met de rechtermuisknop (Windows) of Control-klik (Macintosh) op de naam of het pictogram van de asset in het Assets-paneel en selecteer vervolgens Lokaliseren in site in het contextmenu.
Notitie

Locate In Site is niet beschikbaar voor kleuren en URL's die niet overeenkomen met bestanden in de site.

Het paneel Bestanden wordt geopend, met het assetbestand geselecteerd.De opdracht Locate In site lokaliseert het bestand dat overeenkomt met de asset zelf; het lokaliseert niet de bestanden die die asset gebruiken.

Assets kopiëren van het Assets-paneel naar een andere site

Selecteer in het Assets-paneel de categorie van de asset die je wilt kopiëren.
Klik met de rechtermuisknop (Windows) of Control+klik (Macintosh) op een of meer assets in de lijst Site of de lijst Favorieten, selecteer Kopiëren naar site en selecteer de naam van de doelsite in het submenu met alle sites die je hebt gedefinieerd.
Notitie

In de lijst Favorieten kun je een map Favorieten kopiëren evenals individuele assets.

De assets worden gekopieerd naar hun overeenkomstige locaties in de doelsite.Dreamweaver maakt indien nodig nieuwe mappen in de hiërarchie van de doelsite.De assets worden ook toegevoegd aan de lijst Favorieten van de doelsite.

Notitie

Als de asset die je hebt gekopieerd een kleur of een URL is, verschijnt deze alleen in de lijst Favorieten van de doelsite.Omdat kleuren en URL's niet overeenkomen met bestanden, is er geen bestand om naar de andere site te kopiëren.