PC e cellulari

Come aggiungere l'evidenziazione della sintassi al codice sorgente in Google Docs

Sviluppatori e programmatori hanno utilizzato a lungo gli editor di testo come metodo principale per inserire il codice del computer. Alcuni ambienti di sviluppo hanno i propri editor incorporati, ma gli sviluppatori di solito amano un editor e si attengono a quel programma. Uno dei motivi è che un buon editor di codice include l'evidenziazione della sintassi, una funzionalità che formatta il codice sorgente e assegna caratteri e colori a parole chiave e costrutti all'interno del codice per renderlo molto più facile da leggere. Gli editor di testo come Notepad ++, trattati in questa guida Tech Junkie, sono preferiti dagli sviluppatori per questo motivo. La maggior parte degli sviluppatori non considera Google Documenti come un potenziale editor di codice, nonostante le sue ottime funzionalità per i gruppi di lavoro e l'integrazione cloud, perché non include opzioni di evidenziazione della sintassi integrate.

Come aggiungere l'evidenziazione della sintassi al codice sorgente in Google Docs

Tuttavia, puoi aggiungere l'evidenziazione della sintassi al codice nei documenti di Google Doc. Esistono, infatti, almeno un paio di componenti aggiuntivi per Docs che consentono di formattare vari linguaggi di programmazione e markup con l'evidenziazione della sintassi. Esistono anche numerose app Web che puoi utilizzare per inserire il codice sorgente con l'evidenziazione in Google Docs. In questo articolo ti mostrerò come aggiungere l'evidenziazione della sintassi del codice sorgente ai tuoi documenti di Documenti.

Formatta il codice sorgente con Code Pretty

Code Pretty è un componente aggiuntivo per Google Docs che aggiunge automaticamente l'evidenziazione al codice selezionato. Code Pretty non include un'enorme quantità di impostazioni per personalizzare la formattazione della sintassi, ma aggiunge comunque una pratica opzione di evidenziazione della sintassi a Documenti. Puoi aggiungere CP a Documenti facendo clic su FReee pulsante su questa pagina web. Quindi premere il Permettere pulsante per confermare le autorizzazioni per il componente aggiuntivo.

Quindi, apri Documenti nel tuo browser; e fai clic sulla scheda Componenti aggiuntivi per aprire il relativo menu. Quel menu ora includerà il componente aggiuntivo Code Pretty. Per darti un esempio di come questo componente aggiuntivo evidenzia la sintassi, seleziona e copia il codice JavaScript di esempio di seguito in un documento di Documenti premendo Ctrl + C.

Cosa può fare JavaScript?

JavaScript può modificare gli attributi HTML.

In questo caso JavaScript cambia l'attributo src (source) di un'immagine.

Accendi la luce

Spegni la luce

Incolla l'esempio JavaScript in Documenti premendo Ctrl + V. Quindi seleziona il codice nell'elaboratore di testi con il cursore. Clic Componenti aggiuntivi >codice carino e seleziona il Selezione del formato opzione dal sottomenu. Ciò formatterà il JavaScript come mostrato nell'istantanea direttamente sotto.

Come affermato, CP non include molte impostazioni per l'evidenziazione della sintassi. Tuttavia, puoi regolare la dimensione del carattere del codice evidenziato facendo clic su Componenti aggiuntivi >codice carino e Impostazioni. Questo aprirà la barra laterale mostrata direttamente sotto. Quindi puoi selezionare una dimensione del carattere predefinita alternativa per il codice evidenziato da lì.

Formatta il codice sorgente con Code Blocks

Code Blocks è un componente aggiuntivo alternativo a CP che puoi aggiungere a Documenti. Questo è in realtà un componente aggiuntivo leggermente migliore per evidenziare la sintassi in quanto include numerosi temi di evidenziazione. premi il Gratuito pulsante in questa pagina del sito Web per aggiungere Blocchi di codice a Documenti.

Dopo aver installato Code Blocks, apri Documenti e copia e incolla lo stesso codice JavaScript sopra nell'elaboratore di testi come prima. Clic Componenti aggiuntivi >Blocchi di codice e seleziona Cominciare per aprire la barra laterale mostrata nello scatto direttamente sotto.

Seleziona solo il testo JavaScript con il cursore. Assicurati di non selezionare alcuno spazio documento vuoto sopra o sotto il codice. Selezionare JavaScript dal primo menu a tendina. Quindi puoi anche selezionare un tema dal Tema menu a discesa. premi il Formato per aggiungere l'evidenziazione della sintassi al codice come mostrato di seguito. Ora il testo JavaScript è molto più chiaro con i tag di markup evidenziati.

Copia e incolla il codice sorgente evidenziato in Google Docs

Oltre a Code Blocks e Code Pretty Docs, puoi anche utilizzare app Web di evidenziatore di sintassi per formattare il codice sorgente. Quindi puoi copiare e incollare il codice sorgente evidenziato da un'app Web nel documento di Documenti. Textmate è un'app web per evidenziare la sintassi che formatta numerosi linguaggi di programmazione e markup.

Fare clic su questo collegamento ipertestuale per aprire Textmate. Quindi copia e incolla il testo JavaScript incluso in questo post nella casella del codice sorgente di Textmate con i tasti di scelta rapida Ctrl + C e Ctrl + V. Selezionare JavaScript dal menu a discesa Lingua. Seleziona un tema di evidenziazione della sintassi dal menu a discesa Tema. premi il Evidenziare per ottenere un'anteprima della formattazione del codice sorgente come mostrato nell'istantanea direttamente sotto.

Quindi, seleziona il JavaScript evidenziato nell'anteprima con il cursore e premi Ctrl + C. Incolla il codice evidenziato in Google Documenti premendo Ctrl + V. Ciò aggiungerà il codice sorgente JavaScript evidenziato al documento Documenti come mostrato direttamente di seguito.

Quindi, non è necessario un editor di testo desktop per aggiungere l'evidenziazione della sintassi al software e al codice del sito web. Puoi invece evidenziare il codice di sintassi nei documenti di Documenti con le estensioni Code Pretty e Code Blocks. In alternativa, copia e incolla il tuo codice da e verso l'app Web Textmate per inserire il codice sorgente con l'evidenziazione in Google Documenti.

Hai altri modi per aggiungere la formattazione della sintassi a Google Documenti? Condividili con noi qui sotto!

$config[zx-auto] not found$config[zx-overlay] not found