Paano Madaling Ipakita ang Code sa Iyong WordPress Site

Nais mo bang ipakita ang code sa iyong mga blog sa WordPress? Kung sinubukan mong magdagdag ng code tulad ng regular na teksto, hindi ito maipakita nang tama ng WordPress.


Pinapatakbo ng WordPress ang iyong nilalaman sa pamamagitan ng maraming mga filter ng paglilinis sa bawat oras na nai-save mo ang isang post. Nariyan ang mga filter na ito upang matiyak na ang isang tao ay hindi mag-iniksyon ng code sa pamamagitan ng post editor upang i-hack ang iyong website.

Sa artikulong ito, ipapakita namin sa iyo ang tamang mga paraan upang madaling ipakita ang code sa iyong site ng WordPress. Ipapakita namin sa iyo ang iba’t ibang mga pamamaraan, at maaari mong piliin ang isa na pinakaangkop sa iyong mga pangangailangan.

Paano madaling ipakita ang code sa mga post ng WordPress

Paraan 1. Ipakita ang Code ng Paggamit ng Default na Editor sa WordPress

Inirerekomenda ang pamamaraang ito para sa mga nagsisimula at mga gumagamit na hindi kailangang ipakita ang code nang madalas.

I-edit lamang ang post sa blog o pahina kung saan nais mong ipakita ang code. Sa screen ng pag-edit ng post, magdagdag ng isang bagong block ng code sa iyong post.

Magdagdag ng code block sa iyong mga post sa WordPress

Maaari mo na ngayong ipasok ang code snippet sa lugar ng teksto ng bloke.

Magdagdag ng code sa iyong post sa blog

Pagkatapos nito, maaari mong mai-save ang iyong post sa blog at i-preview ito upang makita ang code block sa pagkilos.

Ipinapakita ang code ng PHP sa WordPress

Depende sa iyong WordPress na tema, maaaring magkakaiba ang hitsura ng code block sa iyong website.

Pamamaraan 2. Ipakita ang Code sa WordPress Gamit ang isang Plugin

Para sa pamamaraang ito, gumagamit kami ng isang plugin ng WordPress upang ipakita ang code sa iyong mga post sa blog. Inirerekomenda ang pamamaraang ito para sa mga gumagamit na madalas na nagpapakita ng code sa kanilang mga artikulo.

Binibigyan ka nito ng mga sumusunod na pakinabang sa default na block ng code:

  • Pinapayagan ka nitong madaling ipakita ang anumang code sa anumang wikang programming
  • Ipinapakita nito ang code na may syntax highlight at mga numero ng linya
  • Madaling pag-aralan ng iyong mga gumagamit ang code at kopyahin ito

Una, kailangan mong i-install at i-activate ang plugin na SyntaxHighlighter Evolved. Para sa higit pang mga detalye, tingnan ang aming hakbang-hakbang na gabay sa kung paano mag-install ng isang plugin ng WordPress.

Sa pag-activate, maaari kang magpatuloy at i-edit ang post sa blog kung saan nais mong ipakita ang code. Sa screen ng pag-edit ng post, idagdag ang block na ‘SyntaxHighlighter Code’ sa iyong post.

SyntaxHighlighter code block

Makakakita ka na ngayon ng isang bagong code block sa post editor kung saan maipasok mo ang iyong code. Matapos idagdag ang code, kailangan mong piliin ang mga setting ng block mula sa kanang haligi.

Mga setting ng bloke ng SyntaxHighlighter code

Una, kailangan mong piliin ang wika para sa iyong code. Pagkatapos nito, maaari mong i-off ang mga numero ng linya, magbigay ng numero ng unang linya, i-highlight ang anumang linya na gusto mo, at i-off ang tampok upang ma-click ang mga link.

Kapag tapos ka na, i-save ang iyong post at mag-click sa pindutan ng preview upang makita ito sa aksyon.

Ang code na ipinapakita gamit ang pag-highlight ng syntax

Ang plugin ay may isang bilang ng mga scheme ng kulay at tema. Upang mabago ang tema ng kulay, kailangan mong bisitahin Mga Setting »SyntaxHighlighter pahina.

Mga setting ng SyntaxHighlighter

Mula sa pahina ng mga setting, maaari kang pumili ng isang tema ng kulay at baguhin ang mga setting ng SyntaxHighlighter. Maaari mong i-save ang iyong mga setting upang makita ang isang preview ng code block sa ibaba ng pahina.

Preview ng code block

Paggamit ng SyntaxHighlighter sa Classic Editor

Kung gumagamit ka pa rin ng lumang klasikong editor ng WordPress, pagkatapos dito ay kung paano mo gagamitin ang plugin na SyntaxHighlighter upang magdagdag ng code sa iyong mga blog sa WordPress.

I-wrap lamang ang iyong code sa paligid ng mga square bracket na may pangalan ng wika. Halimbawa, kung magdaragdag ka ng code ng PHP, pagkatapos ay idagdag mo ito tulad nito:

[php]
<?php
pribadong pag-andar get_time_tags () {
$ oras = get_the_time (‘d M, Y’);
bumalik $ oras;
}
?>
[/ php]

Katulad nito, kung nais mong magdagdag ng isang HTML code, pagkatapos ay ibalot mo ito sa paligid ng HTML shortcode na tulad nito:

[html]
Isang sample na link
[/ html]

Pamamaraan 3. Ipakita ang Code sa WordPress Manu-manong (Walang Plugin o I-block)

Ang pamamaraang ito ay para sa mga advanced na gumagamit dahil nangangailangan ito ng mas maraming trabaho at hindi palaging gumagana tulad ng nilalayon.

Ito ay angkop para sa mga gumagamit na gumagamit pa rin ng lumang klasikong editor at nais na ipakita ang code nang hindi gumagamit ng isang plugin.

Una, kailangan mong ipasa ang iyong code sa pamamagitan ng isang tool na encoder ng HTML na nilalang. Babaguhin nito ang iyong code sa markup sa mga HTML entity, na magbibigay-daan sa iyo upang magdagdag ng code at mag-bypass ng mga filter ng WordPress sa paglilinis..

Ngayon kopyahin at ilagay ang iyong code sa text editor at balutin ito sa paligid at mga tag.

Manu-manong pagdaragdag ng code sa klasikong editor

Ang iyong code ay magiging ganito:

Ito ay isang sample na link

Maaari mo na ngayong i-save ang iyong post at i-preview ang code sa pagkilos. Ang iyong browser ay mai-convert ang mga HTML entities at ang mga gumagamit ay maaaring makita at kopyahin ang tamang code.

Mano-manong pagpapakita ng code sa WordPress

Inaasahan naming nakatulong sa iyo ang artikulong ito kung paano madaling ipakita ang code sa iyong WordPress site. Maaari mo ring makita ang aming panghuli listahan ng mga pinaka nais na mga tip, trick, at hack ng WordPress.

Jeffrey Wilson Administrator
Sorry! The Author has not filled his profile.
follow me