Koodi kuvamine veebilehel

Koodi kuvamine veebilehel

Igal õigel programmeerijal on oma kogu vajalikest koodijuppidest. Erinevad testid ja katsetused. 
Enamasti on need salvestatud kusagile projektidesse või niisama eraldi failidesse. 

Enamus vajalikud näidised koodist on muidugi juba suurest ja laiast veebist leitavad, aga kuna Google kipub aegajalt vähe rumal olema või ei soovi õiget vastust anda, siis oma kogu koodidest on väga kasulik. 

Järgnevalt on siin näide kuidas lisada ilusat ja loetavat koodi oma veebilehele. 

Toimib: Drupal 9 ja 10, PHP veebilehed. 

 

1. Drupal mooduli loomine (PHP veebilehele Drupali moodulit ei lisa). 

Esmalt tuleb luua Drupali kaustas oleva modules kausta kaust nimega syntax_highlighter. Muidugi võid siin kasutada oma valitud projekti nime ja ei pea kasutama syntax_highlighter

Järgnevalt tuleb luua fail nimega syntax_highlighter.info.yml

Fail nimega syntax_highlighter.info.yml sisaldab järgnevat sisu:

  1. name: Syntax Highlighter
  2. type: module
  3. description: 'This Syntax Highlighter module description'
  4. core_version_requirement: ^9 || ^10
  5. package: 'my_package'
  6. version: '1.0'
  7. project: 'syntax_highlighter'
  8. datestamp: 1594655497

 

Järgnevalt tuleb luua fail nimega syntax_highlighter.module

Fail nimega syntax_highlighter.module sisaldab järgnevat sisu:

  1. function syntax_highlighter_node_view_alter(&$build, $node, $display){
  2. if(in_array($node->getType(),['article','page'])){
  3. preg_match_all('/<pre><code class="language-(\w+)">(.*(?!<\code))<\/code><\/pre>/siU',$build['body'][0]['#text'],$output_array);
  4. if($output_array){
  5. if(count($output_array[0])>0){
  6. include_once dirname(__FILE__).'/geshi/geshi.php';
  7. foreach($output_array[0] as $k=>$r){
  8. $geshi = new GeSHi(html_entity_decode($output_array[2][$k]),$output_array[1][$k]);
  9. $geshi->enable_line_numbers(GESHI_NORMAL_LINE_NUMBERS);
  10. //$geshi->set_highlight_lines_extra_style($style);
  11. $build['body'][0]['#text']=str_replace($output_array[0][$k],$geshi->parse_code(),$build['body'][0]['#text']);
  12. }
  13. }
  14. }
  15. }
  16. }

Drupali mooduli loomisel viimase tegevusena tuleb luua syntax_highlighter kausta kaust nimega geshi 
 

2. Geshi projekti lisamine oma moodulile või niisama PHP veebilehele. 

Kuna kasutame koodi ilustamisel Geshi  projekti, siis tuleb antud projektilt alla laadida vajalikud PHP scriptid. 
Selleks tuleb külastada projekti aadressil 
https://github.com/GeSHi/geshi-1.0/tree/master/src 
ja sealt laadida alla fail geshi.php ja samas kõrval olev kaust nimega geshi
Alla laetud fail ja kaust tuleb asetada juba loodud kausta nimega geshi

Drupali kasutajad saavad nüüd selle loodud mooduli aktiveerida oma Drupali moodulite lehel. 
Koodi sisestamiseks veebilehel kasuta CKEditor 5 redaktorit ja seal olevat "code block" nuppu. 

 

Mitte Drupal põhjal PHP veebilehed

Lisa oma PHP faili järgnev koodijupp:

  1. $html='<pre><code class="language-php">echo \'Hello World!\';</code></pre>';
  2. preg_match_all('/<pre><code class="language-(\w+)">(.*(?!<\code))<\/code><\/pre>/siU',$html,$output_array);
  3. if($output_array){
  4. if(count($output_array[0])>0){
  5. include_once dirname(__FILE__).'/geshi/geshi.php';
  6. foreach($output_array[0] as $k=>$r){
  7. $geshi = new GeSHi(html_entity_decode($output_array[2][$k]),$output_array[1][$k]);
  8. $geshi->enable_line_numbers(GESHI_NORMAL_LINE_NUMBERS);
  9. //$geshi->set_highlight_lines_extra_style($style);
  10. $html=str_replace($output_array[0][$k],$geshi->parse_code(),$html);
  11. }
  12. }
  13. }
  14. echo $html;

 

Kujundus

Lisaks on võimalus nüüd koodi kujundada vastavalt oma soovidele. Selleks ava geshi/geshi kaustas olev soovitud programmikeele PHP fail ja muuda seal sees olevad värvid vastavalt oma soovile. 

Lisaks võiks juurde lisada ka oma üldises CSS stiilifailis järgnevad read:

  1. pre{
  2. font-size: 1rem;
  3. padding: 0.25rem;
  4. box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.2);
  5. transition: all 200ms ease-out;
  6. border-radius: 3px;
  7. }
  8. pre:hover{
  9. box-shadow: 0 0 6px rgba(19, 196, 165, 1);
  10. }

 

Lisa kommentaar

Piiratud HTML

  • Lubatud HTML- märgendid: <a href hreflang> <em> <strong> <cite> <blockquote cite> <code> <ul type> <ol start type> <li> <dl> <dt> <dd> <h2 id> <h3 id> <h4 id> <h5 id> <h6 id>
  • Automaatne rea- ja lõiguvahetus
  • Veebilehe aadressid ja e-posti aadressid muutuvad linkideks automaatselt.
CAPTCHA
Enter the characters shown in the image.

neanky logo Neanky uudised

Taevas oli näha virmalisi.

Jätka lugemist →

Raadio. Eesti raadiojaamad Windows rakendus. Kõik parimad Eesti raadiojaamad ühes rakenduses. Kuula kõikjal maailmas. Raadio kuulamine.

Jätka lugemist →

Neanky tutvumine on turvaline ja mõeldud kõigile. Eestis asuv ja eestlastele mõeldud võrgustik. Lisa oma kuulutus ja leia kaaslane. Ei mingeid lepinguid.

Jätka lugemist →

Eesti parimad supluskohad. Kus on parim rand või mõnusam vesi? Kus käid sina suvel suplemas.

Jätka lugemist →

Osalesid Eestis toimuval üritusel ja tegid seal ka pilte? Saada need fotod meie uudistele koos arvustuse või lisainfoga üritusest.

Jätka lugemist →

Sõnala sõnamäng

06.05.2024

Sõnala sõnamäng on uus ja hariv sõnamäng. Eestikeelsed sõnad, sõna arvamisel seletavad sõnastikud. Järjest ette antavate tähtede järgi tuleb moodustada sõnad.

Jätka lugemist →

Saada oma vihje ja fotod uudisest. Lisa oma uudis või loe teiste lisatud uudiseid. Eesti kohalikud uudised. Proovi ajakirjaniku ametit. Reklaami oma toodet.

Jätka lugemist →

DPD nimel levib petukiri. Re: Pakk saadaval kohaletoimetamiseks. Tollimaks tasuda 24h jooksul. PETUKIRI!

Jätka lugemist →

Soojuspump

02.05.2024

2023/2024 väga külmal ja korralikul talvel jäi õhksoojuspumbaga kolmetoalise vana erilise soojustuseta maja kütmine 75-100 € juurde. Eriti külm ja kalli elektrihinnaga jaanuar oli 150 €. Üldiselt on õhksoojuspump puiduga kütmisest odavam.

Jätka lugemist →

Kuidas Sul läheb?

02.05.2024

Kas kõigil on viimasel ajal väga palju tööd ja tegemist või on see vaid mul nii?

Jätka lugemist →

Soovitame üritusi

02.05.2024

Suvine hooaeg on avatud, aga kusagile ei oska minna. Ürituste reklaame pole näinud ega tea, mis kusagil toimub. Soovitame häid ja huvitavaid üritusi, mida võiks külastada. Etendused, kontserdid, näitused, võistlused, koolitused jne.

Jätka lugemist →

22. aprilli hommikul oli maa lumest valge ja lund sadas aina juurde. Taas oli talv tagasi. 23. aprill talv kestab. Lund maas 2-3cm. Õhutemperatuur -2 kuni 1 kraadi. Ilmateade lubab 24ndal 8 kraadi sooja ja lõpuks peaks talv läbi saama.

Jätka lugemist →

Eestis on veel peale Maksekeskuse ja Montonio pangalinkide pakkujaid. LHV pank pakub koostöös EveryPayga pangalinke e-poodidele ja lisaks ka kõiki muidu makselahendusi. Kahjuks on vaid võimatu tuvastada nende hinnakirja. Pole teada palju kuumakse on ja palju tehingu pealt teenustasu võtavad. Info on väga vähene. Dokumentatsioon arendajale on nähtav ja lihtsasti mõistetav. Lisaks ühendub kõigi levinumate e-poe moodulitega. Esto pakub lisaks pangalinkidele laene ja järelmaksu. Nende hinnakiri on ka peidetud või salajane. Tehingutasu näitab 0.00 €

Jätka lugemist →

Kas jood piima?

11.04.2024

Joon küll piima; piim on hea; lehmadel on samuti hea; kui keegi ei jooks piima, siis ei oleks ka lehmi!

Jätka lugemist →

Kui sind huvitab laiemalt rahva arvamus mõnes küsimuses, siis soovita seda siia. Me lisame selle oma külastajatele vastata ja tulemust on hiljem kõigile näha. Küsimus peab olema sobilik igas vanuses vastajale ja ei tohi olla solvav. 2-10 vastusevarianti.

Jätka lugemist →

1. Isamaa - 34.1% (15 häält)2. EKRE - 29.5% (13 häält)3. Ei oma eelistust - 13.6% (6 häält)4. Reformierakond - 11.4% (5 häält)5. Midagi muud - 6.8% (3 häält)6. SDE - 2.3% (1 häält)7. Rohelised - 2.3% (1 häält)8. Eesti 200 - 0% (0 häält)9. Keskerakond - 0% (0 häält)10. Parempoolsed - 0% (0 häält)Vastanuid kokku: 44

Jätka lugemist →

Mõned päevad on nüüd taas tunda olnud halba aega. Kõik tegemised ebaõnnestuvad ja olemine on kuidagi kehva. Kohe kuidagi ei lähe. Maailmas toimub aina hulle asju ja ilm on ka halb olnud. Virmalised, täiskuu ja mida kõike veel. Kas tunnete ka midagi veidralt halba?

Jätka lugemist →