Paano Magdagdag ng Syntax Highlighting sa Source Code sa Google Docs

Matagal nang ginagamit ng mga developer at programmer ang mga text editor bilang pangunahing paraan ng pagpasok ng computer code. Ang ilang mga development environment ay may sariling built-in na mga editor, ngunit ang mga developer ay karaniwang mahilig sa isang editor at nananatili sa program na iyon. Ang isang dahilan para dito ay ang isang mahusay na coding editor ay may kasamang syntax highlighting, isang tampok na nagfo-format ng source code at nagtatalaga ng mga font at kulay sa mga keyword at mga construct sa loob ng code upang gawing mas madaling basahin. Ang mga text editor tulad ng Notepad ++, na saklaw sa gabay na ito ng Tech Junkie, ay pinapaboran ng mga developer para sa kadahilanang ito. Karamihan sa mga developer ay hindi tumitingin sa Google Docs bilang isang potensyal na coding editor, sa kabila ng mahusay na mga feature ng workgroup at cloud integration, dahil hindi nito kasama ang mga built-in na opsyon sa pag-highlight ng syntax.

Paano Magdagdag ng Syntax Highlighting sa Source Code sa Google Docs

Gayunpaman, maaari kang magdagdag ng pag-highlight ng syntax sa code sa mga dokumento ng Google Doc. Mayroong, sa katunayan, hindi bababa sa ilang mga add-on para sa Docs na nagbibigay-daan sa iyong mag-format ng iba't ibang programming at markup na wika na may pag-highlight ng syntax. Marami ring web app na maaari mong gamitin upang magpasok ng source code na may pag-highlight sa Google Docs. Sa artikulong ito ipapakita ko sa iyo kung paano magdagdag ng source code syntax highlighting sa iyong mga dokumento sa Docs.

I-format ang source code gamit ang Code Pretty

Ang Code Pretty ay isang add-on para sa Google Docs na awtomatikong nagdaragdag ng pag-highlight sa napiling code. Ang Code Pretty ay hindi nagsasama ng malaking halaga ng mga setting para sa pag-customize ng syntax formatting, ngunit nagdaragdag pa rin ito ng isang madaling gamiting opsyon sa pag-highlight ng syntax sa Docs. Maaari kang magdagdag ng CP sa Docs sa pamamagitan ng pag-click sa Sinabi ni Free button sa webpage na ito. Pagkatapos ay pindutin ang Payagan button upang kumpirmahin ang mga pahintulot para sa add-on.

Susunod, buksan ang Docs sa iyong browser; at i-click ang tab na Mga Add-on upang buksan ang menu nito. Isasama na ngayon sa menu na iyon ang Code Pretty add-on. Upang bigyan ka ng halimbawa kung paano itina-highlight ng add-on na ito ang syntax, piliin at kopyahin ang sample na JavaScript code sa ibaba sa isang dokumento ng Docs sa pamamagitan ng pagpindot sa Ctrl + C.

Ano ang Magagawa ng JavaScript?

Maaaring baguhin ng JavaScript ang mga katangian ng HTML.

Sa kasong ito, binago ng JavaScript ang src (source) na katangian ng isang imahe.

Buksan ang ilaw

Patayin ang ilaw

I-paste ang sample ng JavaScript na iyon sa Docs sa pamamagitan ng pagpindot sa Ctrl + V. Pagkatapos ay piliin ang code sa word processor gamit ang cursor. I-click Mga add-on >Code Pretty at piliin ang Pagpili ng Format opsyon mula sa submenu. Ipo-format nito ang JavaScript tulad ng ipinapakita sa snapshot nang direkta sa ibaba.

Gaya ng nakasaad, hindi kasama sa CP ang maraming setting para sa pag-highlight ng syntax. Gayunpaman, maaari mong ayusin ang laki ng font ng naka-highlight na code sa pamamagitan ng pag-click Mga add-on >Code Pretty at Mga setting. Bubuksan nito ang sidebar na direktang ipinapakita sa ibaba. Pagkatapos ay maaari kang pumili ng alternatibong default na laki ng font para sa naka-highlight na code mula doon.

I-format ang source code gamit ang Code Blocks

Ang Code Blocks ay isang alternatibong add-on sa CP na maaari mong idagdag sa Docs. Ito ay talagang isang bahagyang mas mahusay na add-on upang i-highlight ang syntax dahil kinabibilangan ito ng maraming mga tema sa pag-highlight. pindutin ang Libre button sa pahina ng website na ito upang magdagdag ng Mga Code Block sa Docs.

Kapag na-install mo na ang Code Blocks, buksan ang Docs at kopyahin at i-paste ang parehong JavaScript code sa itaas sa word processor gaya ng dati. I-click Mga add-on >Mga Block ng Code at piliin Magsimula upang buksan ang sidebar na ipinapakita sa shot nang direkta sa ibaba.

Piliin lamang ang teksto ng JavaScript gamit ang iyong cursor. Tiyaking hindi ka pipili ng anumang bakanteng espasyo ng dokumento sa itaas o ibaba ng code. Pumili JavaScript mula sa unang drop-down na menu. Pagkatapos ay maaari ka ring pumili ng tema mula sa Tema drop-down na menu. pindutin ang Format button upang idagdag ang syntax highlight sa code tulad ng ipinapakita sa ibaba. Ngayon ang teksto ng JavaScript ay mas malinaw sa mga markup tag nito na naka-highlight.

Kopyahin at I-paste ang Naka-highlight na Source Code sa Google Docs

Bukod sa Code Blocks at Code Pretty Docs, maaari mo ring gamitin ang syntax highlighter web apps upang i-format ang source code. Pagkatapos ay maaari mong kopyahin at i-paste ang naka-highlight na source code mula sa isang web app pabalik sa iyong dokumento ng Docs. Ang Textmate ay isang syntax highlighter web app na nag-format ng maraming programming at markup language.

I-click ang hyperlink na ito para buksan ang Textmate. Pagkatapos ay kopyahin at i-paste ang teksto ng JavaScript na kasama sa post na ito sa kahon ng source code ng Textmate gamit ang mga hotkey na Ctrl + C at Ctrl + V. Pumili JavaScript mula sa drop-down na menu ng Wika. Pumili ng syntax highlight na tema mula sa drop-down na menu ng Tema. pindutin ang I-highlight button upang makakuha ng preview para sa pag-format ng source code tulad ng ipinapakita sa snapshot nang direkta sa ibaba.

Susunod, piliin ang naka-highlight na JavaScript sa preview gamit ang cursor at pindutin ang Ctrl + C. I-paste ang naka-highlight na code sa Google Docs sa pamamagitan ng pagpindot sa Ctrl + V. Iyon ay magdaragdag ng naka-highlight na JavaScript source code sa dokumento ng Docs tulad ng direktang ipinapakita sa ibaba.

Kaya, hindi mo kailangan ng desktop text editor para magdagdag ng syntax highlighting sa software at website code. Sa halip, maaari mong i-highlight ang syntax code sa mga dokumento ng Docs gamit ang mga extension ng Code Pretty at Code Blocks. Bilang kahalili, kopyahin at i-paste ang iyong code papunta at mula sa Textmate web app upang ipasok ang source code na may pag-highlight sa Google Docs.

Mayroon ka bang iba pang mga paraan upang magdagdag ng syntax formatting sa Google Docs? Ibahagi ang mga ito sa amin sa ibaba!