Suggerimenti sul codice e completamento del codice

Le funzioni di completamento intelligente del codice o di suggerimento del codice di Dreamweaver consentono di inserire e modificare rapidamente il codice, riducendo gli errori di ortografia e altri errori comuni.

Questa funzione può essere utilizzata anche per visualizzare:

• Gli attributi disponibili per un tag,
• I parametri disponibili per una funzione o
• I metodi disponibili per un oggetto.

Dreamweaver supporta i suggerimenti codice per i linguaggi e le tecnologie seguenti:

• HTML
• CSS
• JavaScript 
• PHP

Continuate a leggere per apprendere il funzionamento dei suggerimenti sul codice e del completamento del codice per questi linguaggi.

Abilitare i suggerimenti sul codice

Per abilitare i suggerimenti per il codice, fate clic su Modifica > Preferenze > Suggerimenti codice, quindi selezionate Abilita suggerimenti per il codice. Per disabilitare i suggerimenti per il codice, deselezionate Abilita suggerimenti per il codice.

Per attivare l’inserimento automatico di parentesi e virgolette, selezionate rispettivamente Inserisci automaticamente le parentesi e Inserisci automaticamente le virgolette.

Per abilitare le descrizioni nei suggerimenti per il codice, selezionate Abilita descrizioni comandi. Potete quindi vedere le descrizioni con i suggerimenti per il codice.

Suggerimenti sul codice HTML

Per HTML sono disponibili i seguenti tipi di suggerimenti per il codice:

• Suggerimenti per i tag
• Suggerimenti per il nome attributo
• Suggerimenti per il valore di attributo

Suggerimenti per i tag

Premete il tasto < sulla tastiera per iniziare a digitare il codice. Mentre digitate, Dreamweaver visualizza i tag HTML validi. Se la stringa che si sta digitando viene visualizzata nel menu, scorrete fino alla stringa e premete Invio per completare l’immissione.

Ad esempio, quando digitate <, un menu a comparsa mostra un elenco di nomi di tag. Invece di digitare tutto nome di tag, potete selezionare nel menu il tag da includere nel testo.

Questi suggerimenti per i tag HTML includono anche una breve descrizione del tag, se disponibile.

Suggerimenti per il nome attributo

Dreamweaver visualizza gli attributi appropriati per i tag durante la codifica in Dreamweaver. Digitate un nome di tag e premete la barra spaziatrice per visualizzare i nomi di attributo validi che potete utilizzare.

Suggerimenti per il valore di attributo

Il testo dei suggerimenti per il codice dei valori di attributo può essere statico o dinamico (poiché nei suggerimenti per il codice vengono visualizzati i valori in base al contenuto dei
file correlati). 

La maggior parte dei suggerimenti del valore di attributo sono statici. Prendete ad esempio il valore dell’attributo di destinazione che è statico per natura; pertanto, anche i suggerimenti sono statici. 

Dreamweaver visualizza i suggerimenti dinamici per il codice per quei valori di attributo che lo richiedono, ad esempio ID, destinazione, src, href e classe.

Seguono alcuni esempi di suggerimenti per codice visualizzati in modo dinamico. 

Suggerimenti dinamici per il codice di src

In questo esempio, quando digitate src, vengono visualizzati valori di attributo validi e quando selezionate le immagini, Dreamweaver visualizza le immagini che sono attualmente valide presenti nella cartella delle immagini Potete scorrere verso il basso e scegliere l’immagine desiderata.

Se avete risorse in CC Libraries, anche queste vengono visualizzate quando digitate src. Queste risorse di libreria CC sono indicate da un’icona a forma di nuvola.

Quando scegliete una risorsa di libreria CC, viene visualizzato un menu a comparsa che consente di ricampionare le dimensioni dell’immagine e di modificarne il formato.

Suggerimenti dinamici per il codice di href

Quando digitate href, Dreamweaver visualizza un elenco di file nella cartella e consente anche di sfogliare e selezionare il file che desiderate collegare.

Suggerimenti dinamici per il codice di ID e stile

Se avete definito gli ID nei file CSS, quando digitate l’ID nei file HTML Dreamweaver visualizza tutti gli ID disponibili.

Nello stesso modo, se avete definito gli stili CSS, quando digitate lo stile nei file HTML Dreamweaver visualizza tutti gli stili disponibili.

Suggerimenti sul codice CSS

I suggerimenti per il codice sono disponibili per i seguenti tipi diversi di CSS:

• @rules
• Proprietà
• Pseudo-selettori e pseudo-elementi
• Scrittura stenografica

Oltre ai suggerimenti per il codice, i suggerimenti sono anche disponibili per le proprietà CSS.

Suggerimenti per il codice per @regole CSS

Dreamweaver visualizza i suggerimenti per il codice di tutti i @rules con una descrizione della regola CSS come indicato qui.

Suggerimenti sulle proprietà CSS

Durante l’inserimento delle proprietà CSS, quando digitate i due punti, vengono visualizzati i suggerimenti per il codice per facilitare la scelta di un valore valido.

Nel seguente codice di esempio, quando si immette tipo di carattere:, vengono visualizzati dei set di caratteri validi.

Potete scegliere uno dei set di caratteri, oppure potete aprire la finestra di dialogo Gestisci caratteri dall’interno di questi suggerimenti e impostate i caratteri preferiti. 

Un altro esempio di utili suggerimenti per il codice sono quelli che è possibile visualizzare quando si lavora con il colore in CSS. Mentre digitate del testo in qualsiasi proprietà correlata ai colori (ad esempio il colore del bordo e il colore dello sfondo), quando premete i due punti, i suggerimenti per il codice visualizzano un elenco di colori. Potete selezionare un colore dall’elenco, oppure potete aprire il Selettore colore dall’interno dei suggerimenti stessi e impostare un colore preferito.

Se avete campioni di colori nelle librerie CC, i suggerimenti per il codice visualizzano anche questi campioni.

Suggerimenti su pseudo-selettore e pseudo-elemento

Potete aggiungere uno pseudo-selettore CSS ad un selettore per definire un determinato stato dell’elemento. Ad esempio, quando usate :hover, lo stile si applica quando l’utente passa sopra all’elemento specificato dal selettore.

Quando digitate “:”, Dreamweaver mostra un elenco di pseudo-selettori validi se il cursore è nel contesto corretto.

Quando digitate “::”, Dreamweaver mostra un elenco di pseudo-elementi validi (usati per disegnare le parti specificate di un elemento) se il cursore è nel contesto corretto.

Suggerimenti per la scrittura stenografica CSS

Le proprietà di scrittura stenografia sono proprietà CSS che consentono di impostare i valori di diverse altre proprietà CSS simultaneamente. Alcuni esempi delle proprietà di scrittura stenografica CSS sono le proprietà background e font.

Come si può notare nell’esempio seguente, se digitate una proprietà di scrittura stenografia CSS (ad esempio, background) e digitate uno spazio, Dreamweaver visualizza:

• Valori di proprietà appropriati in ordine di importanza
• I valori obbligatori che devono essere utilizzati (ad esempio, se usate font, font-size e font-family sono obbligatori)
• Espansione del browser per tale proprietà

Quando le proprietà di scrittura stenografica CSS sono compilate, anche i suggerimenti per il codice visualizzano i valori della proprietà che avete digitato.

Suggerimenti per il codice CSS

Per alcune proprietà CSS (ad esempio, box-shadow o text-shadow), Dreamweaver visualizza i suggerimenti che indicano quali valori devono seguire e indica con un asterisco anche i valori obbligatori. 

Potete inoltre osservare come il browser interpreta il codice CSS.

Suggerimenti per il codice di JavaScript

Nei file JavaScript, Dreamweaver fornisce suggerimenti per il codice per i parametri delle funzioni e le variabili. 

Nell’esempio seguente, lo snippet di codice indica il tipo.

Dreamweaver aggiorna automaticamente l’elenco dei suggerimenti per il codice disponibili quando lavorate nei file JavaScript. Ad esempio, se state lavorando in un file HTML principale e volete passare a un file JavaScript per apportare una modifica. La modifica apportata nel file JavaScript viene riportata nell’elenco dei suggerimenti per il codice quando tornate al file HTML principale. 

Analisi di oggetti dal vivo

Dreamweaver aggiorna automaticamente anche i suggerimenti per il codice di tipo JavaScript.

Ad esempio, se definite una variabile come numero, Dreamweaver conserva tale informazione. Quando in seguito fate riferimento a tale variabile nel codice, ne indica il tipo.

Se cambiate il tipo di variabile, ad esempio in stringa, i suggerimenti per il codice di Dreamweaver indicano automaticamente che la variabile è una stringa.

Inclusione della documentazione dinamica

Se avete aggiunto commenti per una determinata funzione, quando tale funzione è suggerita, Dreamweaver visualizza anche la documentazione per questa funzione. 

Suggerimenti sul codice PHP

Dreamweaver supporta i suggerimenti sul codice per le versioni 5.6 e 7.1 di PHP. Questi suggerimenti per il codice PHP sono specifici per il sito e sono disponibili per tutte le funzioni, classi e costanti principali.

Per ulteriori informazioni su PHP 5.6 e 7.1, consultate il Manuale di PHP.

Per ulteriori informazioni sui suggerimenti per il codice specifici per il sito, vedete Suggerimenti per il codice specifici per il sito.

Una funzione di suggerimento per il codice PHP utile è la funzione di completamento automatico delle variabili.

Quando digitate il simbolo del dollaro ($), viene visualizzato un elenco di tutte le variabili presenti nello script. Selezionate quella desiderata, quindi premete Invio. Sono elencate anche le variabili dei file correlati, in modo da eliminare il rischio di riutilizzare la stessa variabile per uno scopo diverso.

Quando PHP 7.1 è l’impostazione predefinita, Dreamweaver visualizza i suggerimenti sul codice specifici a PHP 7.1.

Modificare le impostazioni di ritardo per i suggerimenti sul codice per PHP

Per migliorare le prestazioni di digitazione del codice nei file .php, in Dreamweaver 2017.5 e nelle versioni successive è stato aggiunto un ritardo per i suggerimenti sul codice per PHP. Quando digitate il codice PHP, Dreamweaver visualizza i suggerimenti dopo un ritardo di 400 ms. Se desiderate modificare le impostazioni di ritardo per il codice PHP, seguite questa procedura: 

Suggerimenti per il codice specifici per il sito

Dreamweaver permette agli sviluppatori che utilizzano Joomla, Drupal, Wordpress o altri framework di visualizzare i suggerimenti per il codice PHP mentre scrivono in vista Codice. Per visualizzare questi suggerimenti, dovete innanzi tutto creare un file di configurazione usando la finestra di dialogo Suggerimenti per il codice specifici per il sito. La configurazione viene utilizzata da Dreamweaver per cercare i suggerimenti per il codice specifici per il sito che state sviluppando.

Per un’esercitazione video sui suggerimenti per il codice specifici per il sito, vedete www.adobe.com/go/learn_dw_comm13_it.

Creare il file di configurazione

Utilizzate la finestra di dialogo Suggerimenti per il codice specifici per il sito per creare il file di configurazione necessario per visualizzare i suggerimenti per il codice in Dreamweaver.

Per impostazione predefinita, Dreamweaver memorizza il file di configurazione nella directory Adobe Dreamweaver CS5\configuration\Shared\Dinamico\Presets.

Salvare la struttura del sito

Potete salvare la struttura del sito personalizzata che avete creato nella finestra di dialogo Suggerimenti per il codice specifici per il sito.

Rinominare le strutture dei siti

Quando rinominate la struttura del sito, tenete presente che non potete utilizzare i nomi delle tre strutture di framework predefinite, né la parola "custom" (personalizzato).

Aggiungere file o cartelle alla struttura di un sito

Potete aggiungere cartelle o file associati al framework. Dopo aver aggiunto i file o le cartelle, potete quindi specificare le estensioni dei nomi file di cui eseguire la scansione. 

Cercare le estensioni di nome file all’interno di un sito

Utilizzate la finestra di dialogo Trova estensioni per visualizzare e modificare le estensioni di nome file incluse nella struttura del sito.