{"id":73867,"date":"2026-07-14T03:01:00","date_gmt":"2026-07-13T17:01:00","guid":{"rendered":"https:\/\/www.rjmprogramming.com.au\/ITblog\/?p=73867"},"modified":"2026-07-14T08:47:33","modified_gmt":"2026-07-13T22:47:33","slug":"wikipedia-colour-coded-mark-word-list-and-styling-tutorial","status":"publish","type":"post","link":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wikipedia-colour-coded-mark-word-list-and-styling-tutorial\/","title":{"rendered":"Wikipedia Colour Coded Mark Word List and Styling Tutorial"},"content":{"rendered":"
\"Wikipedia<\/a>

Wikipedia Colour Coded Mark Word List and Styling Tutorial<\/p><\/div>\n

The “remembering talents” within yesterday’s YouTube API Songname Providence Highlighting Tutorial<\/a> got us to thinking about a revisit to Wikipedia Colour Coded Mark History Tutorial<\/a> because we could “value add” to it’s work, though (it is mainly serverside)<\/font> PHP, some client end window.localStorage<\/a> or window.sessionStorage “remembering smarts” into it’s mix wouldn’t go astray!<\/p>\n

After all, PHP and Javascript are like Ginger and Fred or<\/i> Fred and Ginger or like Alice and Ted and Carol and Bob or<\/i> Bob and Carol and Ted and Alice … come to think of it<\/font>.<\/p>\n

This time around we got to a point doing this where with yesterday’s Javascript …<\/p>\n

\n if (eval(” + marklista.length) > 0) {
\n wasivih=top.document.getElementById(‘ovdiv’).innerHTML;
\n isivih=wasivih;
\n for (iml=0; iml<marklista.length; iml++) {
\n while (isivih.replace(\/<\\\/mark>\/g,’#@#@’).indexOf(‘>’ + marklista[iml] + ‘<‘) != -1) {
\n isivih=isivih.replace(\/<\\\/mark>\/g,’#@#@’).replace(‘>’ + marklista[iml] + ‘<‘, ‘><mark>’ + marklista[iml] + ‘<\/mark><‘).replace(\/\\#\\@\\#\\@\/g, ‘<\/mark>’);
\n }
\n while (isivih.replace(\/<\\\/mark>\/g,’#@#@’).indexOf(‘>’ + marklista[iml] + ‘ ‘) != -1) {
\n isivih=isivih.replace(\/<\\\/mark>\/g,’#@#@’).replace(‘>’ + marklista[iml] + ‘ ‘, ‘><mark>’ + marklista[iml] + ‘ <\/mark><‘).replace(\/\\#\\@\\#\\@\/g, ‘<\/mark>’);
\n }
\n while (isivih.replace(\/<\\\/mark>\/g,’#@#@’).indexOf(‘ ‘ + marklista[iml] + ‘<‘) != -1) {
\n isivih=isivih.replace(\/<\\\/mark>\/g,’#@#@’).replace(‘ ‘ + marklista[iml] + ‘<‘, ‘ <mark>’ + marklista[iml] + ‘ <\/mark><‘).replace(\/\\#\\@\\#\\@\/g, ‘<\/mark>’);
\n }
\n while (isivih.replace(\/<\\\/mark>\/g,’#@#@’).indexOf(‘ ‘ + marklista[iml] + ‘ ‘) != -1) {
\n isivih=isivih.replace(\/<\\\/mark>\/g,’#@#@’).replace(‘ ‘ + marklista[iml] + ‘ ‘, ‘ <mark>’ + marklista[iml] + ‘ <\/mark> ‘).replace(\/\\#\\@\\#\\@\/g, ‘<\/mark>’);
\n }
\n while (isivih.replace(\/<\\\/mark>\/g,’#@#@’).indexOf(‘,’ + marklista[iml] + ‘ ‘) != -1) {
\n isivih=isivih.replace(\/<\\\/mark>\/g,’#@#@’).replace(‘,’ + marklista[iml] + ‘ ‘, ‘,<mark>’ + marklista[iml] + ‘ <\/mark> ‘).replace(\/\\#\\@\\#\\@\/g, ‘<\/mark>’);
\n }
\n while (isivih.replace(\/<\\\/mark>\/g,’#@#@’).indexOf(‘,’ + marklista[iml] + ‘,’) != -1) {
\n isivih=isivih.replace(\/<\\\/mark>\/g,’#@#@’).replace(‘,’ + marklista[iml] + ‘ ‘, ‘,<mark>’ + marklista[iml] + ‘ <\/mark>,’).replace(\/\\#\\@\\#\\@\/g, ‘<\/mark>’);
\n }
\n while (isivih.replace(\/<\\\/mark>\/g,’#@#@’).indexOf(‘ ‘ + marklista[iml] + ‘,’) != -1) {
\n isivih=isivih.replace(\/<\\\/mark>\/g,’#@#@’).replace(‘ ‘ + marklista[iml] + ‘,’, ‘ <mark>’ + marklista[iml] + ‘ <\/mark>,’).replace(\/\\#\\@\\#\\@\/g, ‘<\/mark>’);
\n }
\n while (isivih.replace(\/<\\\/mark>\/g,’#@#@’).indexOf(‘ ‘ + marklista[iml] + ‘.’) != -1) {
\n isivih=isivih.replace(\/<\\\/mark>\/g,’#@#@’).replace(‘ ‘ + marklista[iml] + ‘.’, ‘ <mark>’ + marklista[iml] + ‘ <\/mark>.’).replace(\/\\#\\@\\#\\@\/g, ‘<\/mark>’);
\n }
\n while (isivih.replace(\/<\\\/mark>\/g,’#@#@’).indexOf(‘ ‘ + marklista[iml] + String.fromCharCode(10)) != -1) {
\n isivih=isivih.replace(\/<\\\/mark>\/g,’#@#@’).replace(‘ ‘ + marklista[iml] + String.fromCharCode(10), ‘ <mark>’ + marklista[iml] + ‘ <\/mark>’ + String.fromCharCode(10)).replace(\/\\#\\@\\#\\@\/g, ‘<\/mark>’);
\n }
\n while (isivih.replace(\/<\\\/mark>\/g,’#@#@’).indexOf(String.fromCharCode(10) + marklista[iml] + ‘ ‘) != -1) {
\n isivih=isivih.replace(\/<\\\/mark>\/g,’#@#@’).replace(String.fromCharCode(10) + marklista[iml] + ‘ ‘, String.fromCharCode(10) + ‘<mark>’ + marklista[iml] + ‘ <\/mark>’ + ‘ ‘).replace(\/\\#\\@\\#\\@\/g, ‘<\/mark>’);
\n }
\n }
\n if (isivih != wasivih) {
\n top.document.getElementById(‘ovdiv’).innerHTML=isivih;
\n }
\n }\n<\/p><\/blockquote>\n

… we wanted a pretty close equivalent in PHP, and came up with …<\/p>\n

<?php
\n
\n if (sizeof($marklista) > 0) {
\n $wasivih=$url_get_contents_data;
\n $isivih=$wasivih;
\n for ($iml=0; $iml<sizeof($marklista); $iml++) {
\n while (strpos(str_replace('<\/mark>','#@#@',$isivih),'>' . $marklista[$iml] . '<') !== false) {
\n $isivih=str_replace('#@#@','<\/mark>',str_replace('>' . $marklista[$iml] . '<', '><mark style=background-color:#ffc0cb;>' . $marklista[$iml] . '<\/mark><', str_replace('<\/mark>','#@#@',$isivih)));
\n }
\n while (strpos(str_replace('<\/mark>','#@#@',$isivih),'>' . $marklista[$iml] . ' ') !== false) {
\n $isivih=str_replace('#@#@','<\/mark>',str_replace('>' . $marklista[$iml] . ' ', '><mark style=background-color:#ffc0cb;>' . $marklista[$iml] . ' <\/mark><', str_replace('<\/mark>','#@#@',$isivih)));
\n }
\n while (strpos(str_replace('<\/mark>','#@#@',$isivih),' ' . $marklista[$iml] . '<') !== false) {
\n $isivih=str_replace('#@#@','<\/mark>',str_replace(' ' . $marklista[$iml] . '<', ' <mark style=background-color:#ffc0cb;>' . $marklista[$iml] . ' <\/mark><', str_replace('<\/mark>','#@#@',$isivih)));
\n }
\n while (strpos(str_replace('<\/mark>','#@#@',$isivih),' ' . $marklista[$iml] . ' ') !== false) {
\n $isivih=str_replace('#@#@','<\/mark>',str_replace(' ' . $marklista[$iml] . ' ', ' <mark style=background-color:#ffc0cb;>' . $marklista[$iml] . ' <\/mark> ', str_replace('<\/mark>','#@#@',$isivih)));
\n }
\n while (strpos(str_replace('<\/mark>','#@#@',$isivih),',' . $marklista[$iml] . ' ') !== false) {
\n $isivih=str_replace('#@#@','<\/mark>',str_replace(',' . $marklista[$iml] . ' ', ',<mark style=background-color:#ffc0cb;>' . $marklista[$iml] . ' <\/mark> ', str_replace('<\/mark>','#@#@',$isivih)));
\n }
\n while (strpos(str_replace('<\/mark>','#@#@',$isivih),',' . $marklista[$iml] . ',') !== false) {
\n $isivih=str_replace('#@#@','<\/mark>',str_replace(',' . $marklista[$iml] . ' ', ',<mark style=background-color:#ffc0cb;>' . $marklista[$iml] . ' <\/mark>,', str_replace('<\/mark>','#@#@',$isivih)));
\n }
\n while (strpos(str_replace('<\/mark>','#@#@',$isivih),' ' . $marklista[$iml] . ',') !== false) {
\n $isivih=str_replace('#@#@','<\/mark>',str_replace(' ' . $marklista[$iml] . ',', ' <mark style=background-color:#ffc0cb;>' . $marklista[$iml] . ' <\/mark>,', str_replace('<\/mark>','#@#@',$isivih)));
\n }
\n while (strpos(str_replace('<\/mark>','#@#@',$isivih),' ' . $marklista[$iml] . '.') !== false) {
\n $isivih=str_replace('#@#@','<\/mark>',str_replace(' ' . $marklista[$iml] . '.', ' <mark style=background-color:#ffc0cb;>' . $marklista[$iml] . ' <\/mark>.', str_replace('<\/mark>','#@#@',$isivih)));
\n }
\n while (strpos(str_replace('<\/mark>','#@#@',$isivih),' ' . $marklista[$iml] . \"\\n\") !== false) {
\n $isivih=str_replace('#@#@','<\/mark>',str_replace(' ' . $marklista[$iml] . \"\\n\", ' <mark style=background-color:#ffc0cb;>' . $marklista[$iml] . ' <\/mark>' . \"\\n\", str_replace('<\/mark>','#@#@',$isivih)));
\n }
\n while (strpos(str_replace('<\/mark>','#@#@',$isivih),\"\\n\" . $marklista[$iml] . ' ') !== false) {
\n $isivih=str_replace('#@#@','<\/mark>',str_replace(\"\\n\" . $marklista[$iml] . ' ', \"\\n\" . '<mark style=background-color:#ffc0cb;>' . $marklista[$iml] . ' <\/mark>' . ' ', str_replace('<\/mark>','#@#@',$isivih)));
\n }
\n }
\n if ($isivih != $wasivih) {
\n $url_get_contents_data=$isivih;
\n }
\n }
\n<\/code>
\n?><\/p>\n

Symbiotic, indeed?!<\/p>\n

So feel free to (re-)try the latest draft<\/a> PHP wiki_mark_eight.php<\/a> web application<\/a> to see what we mean.<\/p>\n

\n

\n

Previous relevant Wikipedia Colour Coded Mark History Tutorial<\/a> is shown below.<\/p>\n

\"Wikipedia<\/a>

Wikipedia Colour Coded Mark History Tutorial<\/p><\/div>\n

The idea to gather history of “user interest” into a new dropdown as a feature to enhance a comma (ie, “,”) hardcoding in an “eighth draft”<\/a> PHP wiki_mark_eight.php<\/a> web application<\/a>, perhaps below<\/a>, has several advantages today, we figure …<\/p>\n