{"id":36099,"date":"2018-02-11T03:01:21","date_gmt":"2018-02-10T17:01:21","guid":{"rendered":"http:\/\/www.rjmprogramming.com.au\/ITblog\/?p=36099"},"modified":"2018-07-17T08:31:48","modified_gmt":"2018-07-16T22:31:48","slug":"wordpress-blog-isbn-links-primer-tutorial","status":"publish","type":"post","link":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wordpress-blog-isbn-links-primer-tutorial\/","title":{"rendered":"WordPress Blog ISBN Links Primer Tutorial"},"content":{"rendered":"<div style=\"width: 230px\" class=\"wp-caption alignnone\"><a target=_blank href=\"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp_isbn.jpg\"><img decoding=\"async\" style=\"border: 15px solid pink;\" alt=\"WordPress Blog ISBN Links Primer Tutorial\" src=\"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp_isbn.jpg\" title=\"WordPress Blog ISBN Links Primer Tutorial\"  style=\"float:left;\" \/><\/a><p class=\"wp-caption-text\">WordPress Blog ISBN Links Primer Tutorial<\/p><\/div>\n<p>When you are tailoring a WordPress blog, using the &#8220;edit header.php&#8221; principles we use so much here, at this blog, different aims coalesce on shared Javascript function intervention points, just about all associated with document.body <i>onload<\/i> event intervention, we most often find, and today&#8217;s &#8220;create <a target=_blank title='International Standard Book Number information from Wikipedia ... thanks' href='https:\/\/en.wikipedia.org\/wiki\/International_Standard_Book_Number'>ISBN<\/a> (International Standard Book Number) helper links&#8221; (courtesy of <a target=_blank title='ISBN Search' href='https:\/\/isbnsearch.org\/'>ISBN Search<\/a> website, thanks) calls on the previous <a title='WordPress Blog Complex Selectors Tutorial' href='#wpbcst'>WordPress Blog Complex Selectors Tutorial<\/a>&#8216;s same Javascript function intervention point.  <a target=_blank title='?' href='https:\/\/www.youtube.com\/watch?v=l5Zpmaz2OKE'>&#8220;Sisters of code&#8221;<\/a>.<\/p>\n<p>Why might these two quite disparate aims meet at our WordPress blog&#8217;s (homegrown) Javascript <i>function checkonl() { &#8230; }<\/i> entry point?  For us, doing the changes today, we knew that &#8230;<\/p>\n<ul>\n<li>we wanted to intervene at document.body <i>onload<\/i> event &#8230; all easy and good there &#8230; and then &#8230;<\/li>\n<li>we wanted to scour the [htmlElement].<a target=_blank title='HTML innerHTML property information' href='http:\/\/www.w3schools.com\/jsref\/prop_html_innerhtml.asp'>innerHTML<\/a> (and today [htmlElement].<a target=_blank title='HTML textContent property information' href='https:\/\/www.w3schools.com\/jsref\/prop_node_textcontent.asp'>textContent<\/a> is also useful) of all HTML <a target=_blank title='HTML p tag information from w3schools' href='http:\/\/www.w3schools.com\/tags\/tag_p.asp'><i>p<\/i><\/a> (paragraph) elements looking for our &#8220;ISBN:&#8221; habitual flaggings of referring to a book (but not having already established an <a target=_blank title='HTML a tag information from w3schools' href='http:\/\/www.w3schools.com\/tags\/tag_a.asp'><i>a<\/i><\/a> link regarding it) &#8230; so &#8230;<\/li>\n<li>we looked in WordPress theme TwentyTen&#8217;s header.php for mentions of (the ilk) &#8230;<br \/>\n<code><br \/>\nvar arrayVar=document.getElementsByTagName('p');<br \/>\n<\/code>\n<\/li>\n<\/ul>\n<p> &#8230; and so it came to pass that <i>function checkonl() { &#8230; }<\/i> was the best place to &#8220;share&#8221; interventional (document.body <i>onload<\/i> event) Javascript (client) code.<\/p>\n<p>Now with a lot of jobs, that is the most &#8220;telling&#8221; thing to establish, and yes, it is somewhat &#8220;telling&#8221; today too, but more on the scale that we <a target=_blank title='?' href='https:\/\/www.youtube.com\/watch?v=xVxYhF6liTU'>&#8220;go tell it on a <strike>moun-tain<\/strike>mole-hill&#8221;<\/a> because doing <a target=_blank title='HTML a tag information from w3schools' href='http:\/\/www.w3schools.com\/tags\/tag_a.asp'><i>a<\/i><\/a> linking &#8220;after the event&#8221; can be difficult not so much for the &#8230;<\/p>\n<ul>\n<li><i>ISBN: [<a target=_blank title='International Standard Book Number information from Wikipedia ... thanks' href='https:\/\/en.wikipedia.org\/wiki\/International_Standard_Book_Number'>ISBN<\/a> number]<\/i> habit we have, that is easy to track &#8230; but working backwards to attempt to find &#8230;<\/li>\n<li><i> by [author list]<\/i> &#8230; and\/or &#8230;<\/li>\n<li><i> thanks to [book title]<\/i><\/li>\n<\/ul>\n<p> &#8230; eg. Thanks to WordPress Web Design for Dummies, 3rd Edition by Lisa Sabin-Wilson  ISBN: 978-1-1190886-4-6 &#8230; is so much harder to track, though resorting to [htmlElement].textContent property can help, sometimes.  It&#8217;s one of those jobs that you do your best, but do not act (to create the new link) if the result is uncertain (especially because there is no harm done not having the link).<\/p>\n<p>Bits of <i>function checkonl() { &#8230; }<\/i> <b>changed<\/b> as below &#8230;<\/p>\n<p><code><br \/>\n function checkonl() {<br \/>\n   var bisi=[-1], iisi=[-1], pisi=[-1], jbisi=0, jiisi=0, jpisi=0, iourps;<br \/>\n   var ourps=document.getElementsByTagName(\"b\");<br \/>\n   for (iourps=0; iourps&lt;ourps.length; iourps++) {<br \/>\n     if (ourps[iourps].innerHTML.replace(\/&lt;p&gt;\/g,\"\").replace(\/&lt;i&gt;\/g,\"\").replace(\/&lt;b&gt;\/g,\"\").replace(\/&lt;\\\/p&gt;\/g,\"\").replace(\/&lt;\\\/i&gt;\/g,\"\").replace(\/&lt;\\\/b&gt;\/g,\"\") == \"Did you know?\") {<br \/>\n       bisi[jbisi]=iourps;<br \/>\n       jbisi++;<br \/>\n       bisi[jbisi]=-1;<br \/>\n     } else if (ourps[iourps].innerHTML.replace(\/&lt;p&gt;\/g,\"\").replace(\/&lt;i&gt;\/g,\"\").replace(\/&lt;b&gt;\/g,\"\").replace(\/&lt;\\\/p&gt;\/g,\"\").replace(\/&lt;\\\/i&gt;\/g,\"\").replace(\/&lt;\\\/b&gt;\/g,\"\") == \"Stop Press\") {<br \/>\n       bisi[jbisi]=iourps;<br \/>\n       jbisi++;<br \/>\n       bisi[jbisi]=-1;<br \/>\n     }<br \/>\n   }<br \/>\n   ourps=document.getElementsByTagName(\"i\");<br \/>\n   for (iourps=0; iourps&lt;ourps.length; iourps++) {<br \/>\n     if (ourps[iourps].innerHTML.replace(\/&lt;p&gt;\/g,\"\").replace(\/&lt;i&gt;\/g,\"\").replace(\/&lt;b&gt;\/g,\"\").replace(\/&lt;\\\/p&gt;\/g,\"\").replace(\/&lt;\\\/i&gt;\/g,\"\").replace(\/&lt;\\\/b&gt;\/g,\"\") == \"Did you know?\") {<br \/>\n       iisi[jiisi]=iourps;<br \/>\n       jiisi++;<br \/>\n       iisi[jiisi]=-1;<br \/>\n     } else if (ourps[iourps].innerHTML.replace(\/&lt;p&gt;\/g,\"\").replace(\/&lt;i&gt;\/g,\"\").replace(\/&lt;b&gt;\/g,\"\").replace(\/&lt;\\\/p&gt;\/g,\"\").replace(\/&lt;\\\/i&gt;\/g,\"\").replace(\/&lt;\\\/b&gt;\/g,\"\") == \"Stop Press\") {<br \/>\n       iisi[jiisi]=iourps;<br \/>\n       jiisi++;<br \/>\n       iisi[jiisi]=-1;<br \/>\n     }<br \/>\n   }<br \/>\n   ourps=document.getElementsByTagName(\"p\");<br \/>\n   for (iourps=0; iourps&lt;ourps.length; iourps++) {<br \/>\n     if (ourps[iourps].innerHTML.replace(\/&lt;p&gt;\/g,\"\").replace(\/&lt;i&gt;\/g,\"\").replace(\/&lt;b&gt;\/g,\"\").replace(\/&lt;\\\/p&gt;\/g,\"\").replace(\/&lt;\\\/i&gt;\/g,\"\").replace(\/&lt;\\\/b&gt;\/g,\"\") == \"Did you know?\") {<br \/>\n       pisi[jpisi]=iourps;<br \/>\n       jpisi++;<br \/>\n       pisi[jpisi]=-1;<br \/>\n     } else if (ourps[iourps].innerHTML.replace(\/&lt;p&gt;\/g,\"\").replace(\/&lt;i&gt;\/g,\"\").replace(\/&lt;b&gt;\/g,\"\").replace(\/&lt;\\\/p&gt;\/g,\"\").replace(\/&lt;\\\/i&gt;\/g,\"\").replace(\/&lt;\\\/b&gt;\/g,\"\") == \"Stop Press\") {<br \/>\n       pisi[jpisi]=iourps;<br \/>\n       pisi[jpisi]=iourps;<br \/>\n       jpisi++;<br \/>\n       pisi[jpisi]=-1;<br \/>\n     <b>} else if (ourps[iourps].innerHTML.toUpperCase().indexOf(\"ISBN:\") != -1) {<br \/>\n       var isbnis='', jisbn=0, okays=\"-0123456789\", preis=[];<br \/>\n       if (ourps[iourps].innerHTML.toUpperCase().indexOf(\"ISBN: \") != -1) {<br \/>\n         preis=ourps[iourps].textContent.replace(\/\\\"\/g,'').replace(\/\\'\/g,\"\").replace(\/\\&lt;b\\&gt;\/g,'').replace(\/\\&lt;\\\/b\\&gt;\/g,'').replace(\/\\&lt;i\\&gt;\/g,'').replace(\/\\&lt;\\\/i\\&gt;\/g,'').split(\"ISBN: \");<br \/>\n         if (preis.length &gt; 1 &amp;&amp; preis[0].indexOf(\"(\") != -1) preis=preis[0].split(\"(\");<br \/>\n         while (okays.indexOf(ourps[iourps].innerHTML.toUpperCase().split(\"ISBN: \")[1].substring(jisbn, eval(jisbn + 1))) != -1) {<br \/>\n           isbnis+=ourps[iourps].innerHTML.toUpperCase().split(\"ISBN: \")[1].substring(jisbn, eval(jisbn + 1));<br \/>\n           jisbn++;<br \/>\n         }<br \/>\n       } else if (ourps[iourps].innerHTML.toUpperCase().indexOf(\"ISBN:&NBSP;\") != -1) {<br \/>\n         preis=ourps[iourps].textContent.replace(\/\\\"\/g,'').replace(\/\\'\/g,\"\").replace(\/\\&lt;b\\&gt;\/g,'').replace(\/\\&lt;\\\/b\\&gt;\/g,'').replace(\/\\&lt;i\\&gt;\/g,'').replace(\/\\&lt;\\\/i\\&gt;\/g,'').split(\"ISBN:&nbsp;\");<br \/>\n         if (preis.length &gt; 1 &amp;&amp; preis[0].indexOf(\"(\") != -1) preis=preis[0].split(\"(\");<br \/>\n         while (okays.indexOf(ourps[iourps].innerHTML.toUpperCase().split(\"ISBN:&NBSP;\")[1].substring(jisbn, eval(jisbn + 1))) != -1) {<br \/>\n           isbnis+=ourps[iourps].innerHTML.toUpperCase().split(\"ISBN:&NBSP;\")[1].substring(jisbn, eval(jisbn + 1));<br \/>\n           jisbn++;<br \/>\n         }<br \/>\n       } else {<br \/>\n         preis=ourps[iourps].innerText.replace(\/\\\"\/g,'').replace(\/\\'\/g,\"\").replace(\/\\&lt;b\\&gt;\/g,'').replace(\/\\&lt;\\\/b\\&gt;\/g,'').replace(\/\\&lt;i\\&gt;\/g,'').replace(\/\\&lt;\\\/i\\&gt;\/g,'').split(\"ISBN:\");<br \/>\n         if (preis.length &gt; 1 &amp;&amp; preis[0].indexOf(\"(\") != -1) preis=preis[0].split(\"(\");<br \/>\n         while (okays.indexOf(ourps[iourps].innerHTML.toUpperCase().split(\"ISBN:\")[1].substring(jisbn, eval(jisbn + 1))) != -1) {<br \/>\n           isbnis+=ourps[iourps].innerHTML.toUpperCase().split(\"ISBN:\")[1].substring(jisbn, eval(jisbn + 1));<br \/>\n           jisbn++;<br \/>\n         }<br \/>\n       }<br \/>\n       if (isbnis != '') {<br \/>\n         ourps[iourps].innerHTML=ourps[iourps].innerHTML.replace(isbnis, \"&lt;a target=_blank title='ISBN lookup' href='https:\/\/isbnsearch.org\/isbn\/\" + isbnis.replace(\/\\-\/g,'') + \"'&gt;\" + isbnis + \"&lt;\/a&gt;\");<br \/>\n         if (preis.length &gt; 1) {<br \/>\n          isbnis='';<br \/>\n          jisbn=0;<br \/>\n          okays=\"\";<br \/>\n          var authoris='', authord='';<br \/>\n          \/\/ \/search?s=How+English+Works<br \/>\n          if (preis[0].indexOf(' by ') != -1 && preis[0].indexOf('hanks to ') != -1) {<br \/>\n            isbnis=preis[0].split('hanks to ')[eval(-1 + preis[0].split('hanks to ').length)].split(' by ')[0]; \/\/.split(' ');<br \/>\n            preis=preis[0].split('hanks to ')[eval(-1 + preis[0].split('hanks to ').length)].split(' by ')[1].trim().split(' ');<br \/>\n            if (preis.length &gt; 1) {<br \/>\n              for (jisbn=0; jisbn&lt;preis.length; jisbn++) {<br \/>\n                if (preis[jisbn].substring(0,1) == preis[jisbn].substring(0,1).toUpperCase() || preis[jisbn].length &lt;= 2) {<br \/>\n                  authoris+=(authord + preis[jisbn]);<br \/>\n                  authord=' ';<br \/>\n                } else if (authoris != '') {<br \/>\n                  ourps[iourps].innerHTML=ourps[iourps].innerHTML.replace(authoris, \"&lt;a target=_blank title='ISBN lookup' href='https:\/\/isbnsearch.org\/search?s=\" + authoris.replace(\/\\&amp\\;\/g,'and').replace(\/\\&\/g,'and').replace(\/\\ \/g,'+') + \"'&gt;\" + authoris + \"&lt;\/a&gt;\");<br \/>\n                  authoris='';<br \/>\n                  authord='';<br \/>\n                }<br \/>\n              }<br \/>\n              if (authoris != '') {<br \/>\n               ourps[iourps].innerHTML=ourps[iourps].innerHTML.replace(authoris, \"&lt;a target=_blank title='ISBN lookup' href='https:\/\/isbnsearch.org\/search?s=\" + authoris.replace(\/\\&amp\\;\/g,'and').replace(\/\\&\/g,'and').replace(\/\\ \/g,'+') + \"'&gt;\" + authoris + \"&lt;\/a&gt;\");<br \/>\n              }<br \/>\n            }<br \/>\n          } else if (preis[0].indexOf(' by ') != -1 && preis[0].indexOf('hank ') != -1) {<br \/>\n            isbnis=preis[0].split('hank ')[eval(-1 + preis[0].split('hank ').length)].split(' by ')[0]; \/\/.split(' ');<br \/>\n            preis=preis[0].split('hank ')[eval(-1 + preis[0].split('hank ').length)].split(' by ')[1].trim().split(' ');<br \/>\n            if (preis.length &gt; 1) {<br \/>\n              for (jisbn=0; jisbn&lt;preis.length; jisbn++) {<br \/>\n                if (preis[jisbn].substring(0,1) == preis[jisbn].substring(0,1).toUpperCase() || preis[jisbn].length &lt;= 2) {<br \/>\n                  authoris+=(authord + preis[jisbn]);<br \/>\n                  authord=' ';<br \/>\n                } else if (authoris != '') {<br \/>\n                  ourps[iourps].innerHTML=ourps[iourps].innerHTML.replace(authoris, \"&lt;a target=_blank title='ISBN lookup' href='https:\/\/isbnsearch.org\/search?s=\" + authoris.replace(\/\\&amp\\;\/g,'and').replace(\/\\&\/g,'and').replace(\/\\ \/g,'+') + \"'&gt;\" + authoris + \"&lt;\/a&gt;\");<br \/>\n                  authoris='';<br \/>\n                  authord='';<br \/>\n                }<br \/>\n              }<br \/>\n              if (authoris != '') {<br \/>\n               ourps[iourps].innerHTML=ourps[iourps].innerHTML.replace(authoris, \"&lt;a target=_blank title='ISBN lookup' href='https:\/\/isbnsearch.org\/search?s=\" + authoris.replace(\/\\&amp\\;\/g,'and').replace(\/\\&\/g,'and').replace(\/\\ \/g,'+') + \"'&gt;\" + authoris + \"&lt;\/a&gt;\");<br \/>\n              }<br \/>\n            }<br \/>\n          } else if (preis[0].indexOf('hanks to ') != -1) {<br \/>\n            isbnis=preis[0].trim().split('hanks to ')[eval(-1 + preis[0].split('hanks to ').length)]; \/\/.split(' ');<br \/>\n          } else if (preis[0].indexOf('hank ') != -1) {<br \/>\n            isbnis=preis[0].trim().split('hank ')[eval(-1 + preis[0].split('hank ').length)]; \/\/.split(' ');<br \/>\n          }<br \/>\n          if (isbnis != '') {<br \/>\n            okays=\"\";<br \/>\n            jisbn=0;<br \/>\n            preis=isbnis.split(' ');<br \/>\n            while (okays == \"\" && jisbn &lt; preis.length && preis[jisbn].substring(0,1) == preis[jisbn].substring(0,1).toLowerCase()) {<br \/>\n             if (okays == \"\" && isbnis.indexOf(preis[jisbn] + \" \") != -1) {<br \/>\n              isbnis=isbnis.replace(preis[jisbn] + \" \",\"\");<br \/>\n              jisbn++;<br \/>\n             } else {<br \/>\n              okays=\"n\";<br \/>\n              jisbn++;<br \/>\n             }<br \/>\n            }<br \/>\n            if (isbnis != '') {<br \/>\n             if (ourps[iourps].innerHTML.indexOf(isbnis) != -1) {<br \/>\n               ourps[iourps].innerHTML=ourps[iourps].innerHTML.replace(isbnis, \"&lt;a target=_blank title='ISBN lookup' href='https:\/\/isbnsearch.org\/search?s=\" + isbnis.replace(\/\\&amp\\;\/g,'and').replace(\/\\&\/g,'and').replace(\/\\ \/g,'+') + \"'&gt;\" + isbnis + \"&lt;\/a&gt;\");<br \/>\n             }<br \/>\n            }<br \/>\n          }<br \/>\n         }<br \/>\n       }<br \/>\n       <\/b><br \/>\n     }<br \/>\n   }<br \/>\n   jbisi=0;<br \/>\n   jiisi=0;<br \/>\n   jpisi=0;<br \/>\n   if (bisi[jbisi] != -1) {<br \/>\n   ourps=document.getElementsByTagName(\"b\");<br \/>\n   for (iourps=0; iourps&lt;ourps.length; iourps++) {<br \/>\n     if (iourps == bisi[jbisi]) {<br \/>\n       ourps[iourps].className = \"dyk dykb\";<br \/>\n       jbisi++;<br \/>\n     }<br \/>\n   }<br \/>\n   }<br \/>\n   if (iisi[jiisi] != -1) {<br \/>\n   ourps=document.getElementsByTagName(\"i\");<br \/>\n   for (iourps=0; iourps&lt;ourps.length; iourps++) {<br \/>\n     if (iourps == iisi[jiisi]) {<br \/>\n       ourps[iourps].className = \"dyk dyki\";<br \/>\n       jiisi++;<br \/>\n     }<br \/>\n   }<br \/>\n   }<br \/>\n   if (pisi[jpisi] != -1) {<br \/>\n   ourps=document.getElementsByTagName(\"p\");<br \/>\n   for (iourps=0; iourps&lt;ourps.length; iourps++) {<br \/>\n     if (iourps == pisi[jpisi]) {<br \/>\n       ourps[iourps].className = \"dyk dykp\";<br \/>\n       jpisi++;<br \/>\n     }<br \/>\n   }<br \/>\n   }<br \/>\n}<br \/>\n<\/code><\/p>\n<p> &#8230; with no need to change the document.body <i>onload<\/i> code because we share Javascript function entry points.  Hope you find some books!<\/p>\n<hr>\n<p id='wpbcst'>Previous relevant <a target=_blank title='WordPress Blog Complex Selectors Tutorial' href='https:\/\/www.rjmprogramming.com.au\/ITblog\/wordpress-blog-complex-selectors-tutorial\/'>WordPress Blog Complex Selectors Tutorial<\/a> is shown below.<\/p>\n<div style=\"width: 230px\" class=\"wp-caption alignnone\"><a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/did_you_know.jpg\"><img decoding=\"async\" style=\"border: 15px solid pink;\" alt=\"WordPress Blog Complex Selectors TutorialWordPress Blog Complex Selectors Tutorial\" src=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/did_you_know.jpg\"  \/><\/a><p class=\"wp-caption-text\">WordPress Blog Complex Selectors Tutorial<\/p><\/div>\n<p>We&#8217;re now setting our sights on improving the aesthetics of our WordPress blog that you are reading now, using some of the principles of <a title='CSS and HTML Complex Selectors Tutorial' href='#cahcst'>CSS and HTML Complex Selectors Tutorial<\/a> as shown way below, and also worth reading is <a title='CSS and HTML Complex Attribute Selectors Tutorial' href='#cahcast'>CSS and HTML Complex Attribute Selectors Tutorial<\/a> as shown below, inspired by this <a target=_blank title='Great link' href='http:\/\/learn.shayhowe.com\/advanced-html-css\/complex-selectors\/'>wonderful link<\/a>.<\/p>\n<p>But these CSS principles sometimes need a helping hand via Javascript DOM techniques, and know here that you could also use <a target=_blank href='http:\/\/jquery.org' title='jQuery Javascript library home page'>jQuery<\/a> logic to help out with this job.<\/p>\n<p>So, what&#8217;s the premise for the job?  Okay &#8230; <font size=1>once upon a time &#8230; but we digress<\/font> &#8230; regular reader (or not), you may have gleaned that at this blog, things change.<\/p>\n<p style='padding-top:250px;'>And we have two &#8220;appendix&#8221; homebrand mechanisms to bring you changes and\/or bits we&#8217;d like to emphasise, but only after you understand the issue, and come back later after things have moved on a bit, and these homebrand &#8220;appendix&#8221; sections we call &#8230;<\/p>\n<ol>\n<li>Did you know?<\/li>\n<li>Stop Press<\/li>\n<\/ol>\n<p> &#8230; and though we class these types of content as pretty important, we haven&#8217;t CSS-wise distinguished them much except that we&#8217;ve, mostly &#8230;<\/p>\n<ul>\n<li>encased them within &lt;b&gt;&lt;i&gt; &#8230; &lt;\/i&gt;&lt;\/b&gt;<\/li>\n<li>have kept to the wording above<\/li>\n<li>have followed the flagging of the special section of content by the next HTML element being an HTML <i>p<\/i> paragraph element<\/li>\n<li>we can rely on the fact that because we are talking WordPress blog content here, there&#8217;ll be an encasing parent HTML <i>div<\/i> element of some sort &#8230; important for the working of any of these CSS Complex (Attribute) Selector ideas<\/li>\n<\/ul>\n<p> &#8230; so, how can we incorporate what we know about CSS Complex Selectors with this existant &#8220;not very notable&#8221; HTML for &#8220;Did you know?&#8221; and\/or &#8220;Stop Press&#8221; content, and attract the user to content that stands out more?  Well, the first step in our minds is to change <i>&#8220;not very notable&#8221;<\/i> to <i>&#8220;uniquely identifiable&#8221;<\/i> and for the two reasons &#8230;<\/p>\n<ol>\n<li>we are talking CSS here<\/li>\n<li>we are talking about several different HTML element types<\/li>\n<\/ol>\n<p> &#8230; then it becomes a good idea, from our experience, for the Javascript DOM &#8220;saver of the day<font size=1>er<\/font>&#8221; to deal with HTML element property <a target=_blank title='HTML element Javascript DOM property className information from w3schools'><i>&#8220;className&#8221;<\/i><\/a> &#8230; as our adage around here is &#8230;<\/p>\n<ul>\n<li>if it&#8217;s CSS try to involve HTML element property <i>class<\/i>Name &#8230; and &#8230;<\/li>\n<li>if it&#8217;s Javascript DOM try to involve HTML element property <i>id<\/i><\/li>\n<\/ul>\n<p> &#8230; bearing in mind, the first is just an aspirational objective.<\/p>\n<p>Okay, if you&#8217;re confused here because we&#8217;ve mentioned Javascript DOM and CSS, so why wouldn&#8217;t we pick only the second approach above?  Well, CSS always has (in Australian (driving)) &#8220;right of way&#8221; with these things, as it is an HTML <i>styling<\/i> job we are doing here.  As such, we&#8217;ll be involving both &#8230; and the roles the two concepts play with this job are &#8230;<\/p>\n<ol>\n<li>our Javascript DOM will be responsible for identifying said &#8220;special sections&#8221; and applying one generic and <a href='#sptoday' title='Stop Press'>one unique<\/a> HTML element property <i>class<\/i>Name to these elements, and will do its <i>thang<\/i> at the document.body&#8217;s <a target=_blank title='Javascript event onload information from w3schools' href='http:\/\/www.w3schools.com\/tags\/ev_onload.asp'><i>onload<\/i><\/a> event in a new Javascript function we&#8217;ll call <i>checkonl()<\/i><\/li>\n<li>our CSS that includes an &#8220;Adjacent Sibling&#8221; (+) Complex Selector uses that HTML element property <i>class<\/i>Name as the basis to style the &#8220;Did you know?&#8221; and\/or &#8220;Stop Press&#8221; &#8220;special section&#8221; headings with a yellow background and lead the reader&#8217;s eyes down to a subtly background coloured first adjacent HTML element &#8230; as with &#8230;<br \/>\n<code><br \/>\n&lt;style&gt;<br \/>\n.dyk { background-color: yellow; border-bottom: 7px solid #f7f7f7;  border-top: 7px solid #f7f7f7; }<br \/>\n.dyk + * { background-color: #f7f7f7; border-bottom: 7px solid #f7f7f7;  border-top: 7px solid #f7f7f7; }<br \/>\n&lt;\/style&gt;<br \/>\n<\/code>\n<\/li>\n<\/ol>\n<p>Hopefully this all coalesces well in your mind by you seeing how our good ol&#8217; WordPress theme TwentyTen&#8217;s  header.php <b>changes<\/b> to facilitate the sort of styling change you see with our <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/did_you_know.jpg\" title='Click picture'>tutorial picture<\/a> &#8230;<\/p>\n<p><code><br \/>\n<b><\/b><br \/>\n\/\/ ...<br \/>\n<b><\/b><br \/>\n&lt;style&gt;<br \/>\n<b><\/b><br \/>\n\/\/ ...<br \/>\n<b><\/b><br \/>\n<b><\/b><br \/>\n  $csarray = array(\"black\", \"red\", \"blue\", \"purple\", \"maroon\", \"teal\", \"brown\", \"orange\", \"olive\", \"lime\", \"green\");<br \/>\n<b><\/b><br \/>\n  if ($wsarray[$ws] != \"\") {<br \/>\n<b><\/b><br \/>\n  $wschild = rand(0, (sizeof($wsarray) - 1)); \/\/ page submenu spacing accentuation<br \/>\n  $cschild = rand(0, 10);<br \/>\necho \"<br \/>\n<b><br \/>\n.dyk { background-color: yellow; border-bottom: 7px solid #f7f7f7;  border-top: 7px solid #f7f7f7; }<br \/>\n.dyk + * { background-color: #f7f7f7; border-bottom: 7px solid #f7f7f7;  border-top: 7px solid #f7f7f7; }<br \/>\n<\/b><br \/>\nul.children li.page_item:before {<br \/>\n    color: \" .  $csarray[$cschild] . \";<br \/>\n    content: '\\\\\" . $wsarray[$wschild] . \" \\\\0000a0';<br \/>\n}<br \/>\n<b><\/b><br \/>\n\/\/ ...<br \/>\n<b><\/b><br \/>\n\";<br \/>\n<b><\/b><br \/>\n<b><\/b><br \/>\n\/\/ ... styling ends with &lt;\/style&gt; and Javascript starts with something like &lt;script type='text\/javascript'&gt; ...<br \/>\n<b><\/b><br \/>\n<b><\/b><br \/>\n<b><\/b><br \/>\n<b><br \/>\n function checkonl() {<br \/>\n   var bisi=[-1], iisi=[-1], pisi=[-1], jbisi=0, jiisi=0, jpisi=0, iourps;<br \/>\n   var ourps=document.<a target=_blank title='Javascript DOM getElementsByTagName method information from w3schools' href='http:\/\/www.w3schools.com\/jsref\/met_document_getelementsbytagname.asp'>getElementsByTagName<\/a>(\"b\");<br \/>\n   for (iourps=0; iourps&lt;ourps.length; iourps++) {<br \/>\n     if (ourps[iourps].innerHTML.replace(\/&lt;p&gt;\/g,\"\").replace(\/&lt;i&gt;\/g,\"\").replace(\/&lt;b&gt;\/g,\"\").replace(\/&lt;\\\/p&gt;\/g,\"\").replace(\/&lt;\\\/i&gt;\/g,\"\").replace(\/&lt;\\\/b&gt;\/g,\"\") == \"Did you know?\") {<br \/>\n       bisi[jbisi]=iourps;<br \/>\n       jbisi++;<br \/>\n       bisi[jbisi]=-1;<br \/>\n     } else if (ourps[iourps].innerHTML.replace(\/&lt;p&gt;\/g,\"\").replace(\/&lt;i&gt;\/g,\"\").replace(\/&lt;b&gt;\/g,\"\").replace(\/&lt;\\\/p&gt;\/g,\"\").replace(\/&lt;\\\/i&gt;\/g,\"\").replace(\/&lt;\\\/b&gt;\/g,\"\") == \"Stop Press\") {<br \/>\n       bisi[jbisi]=iourps;<br \/>\n       jbisi++;<br \/>\n       bisi[jbisi]=-1;<br \/>\n     }<br \/>\n   }<br \/>\n   ourps=document.getElementsByTagName(\"i\");<br \/>\n   for (iourps=0; iourps&lt;ourps.length; iourps++) {<br \/>\n     if (ourps[iourps].innerHTML.replace(\/&lt;p&gt;\/g,\"\").replace(\/&lt;i&gt;\/g,\"\").replace(\/&lt;b&gt;\/g,\"\").replace(\/&lt;\\\/p&gt;\/g,\"\").replace(\/&lt;\\\/i&gt;\/g,\"\").replace(\/&lt;\\\/b&gt;\/g,\"\") == \"Did you know?\") {<br \/>\n       iisi[jiisi]=iourps;<br \/>\n       jiisi++;<br \/>\n       iisi[jiisi]=-1;<br \/>\n     } else if (ourps[iourps].innerHTML.replace(\/&lt;p&gt;\/g,\"\").replace(\/&lt;i&gt;\/g,\"\").replace(\/&lt;b&gt;\/g,\"\").replace(\/&lt;\\\/p&gt;\/g,\"\").replace(\/&lt;\\\/i&gt;\/g,\"\").replace(\/&lt;\\\/b&gt;\/g,\"\") == \"Stop Press\") {<br \/>\n       iisi[jiisi]=iourps;<br \/>\n       jiisi++;<br \/>\n       iisi[jiisi]=-1;<br \/>\n     }<br \/>\n   }<br \/>\n   ourps=document.getElementsByTagName(\"p\");<br \/>\n   for (iourps=0; iourps&lt;ourps.length; iourps++) {<br \/>\n     if (ourps[iourps].innerHTML.replace(\/&lt;p&gt;\/g,\"\").replace(\/&lt;i&gt;\/g,\"\").replace(\/&lt;b&gt;\/g,\"\").replace(\/&lt;\\\/p&gt;\/g,\"\").replace(\/&lt;\\\/i&gt;\/g,\"\").replace(\/&lt;\\\/b&gt;\/g,\"\") == \"Did you know?\") {<br \/>\n       pisi[jpisi]=iourps;<br \/>\n       jpisi++;<br \/>\n       pisi[jpisi]=-1;<br \/>\n     } else if (ourps[iourps].innerHTML.replace(\/&lt;p&gt;\/g,\"\").replace(\/&lt;i&gt;\/g,\"\").replace(\/&lt;b&gt;\/g,\"\").replace(\/&lt;\\\/p&gt;\/g,\"\").replace(\/&lt;\\\/i&gt;\/g,\"\").replace(\/&lt;\\\/b&gt;\/g,\"\") == \"Stop Press\") {<br \/>\n       pisi[jpisi]=iourps;<br \/>\n       pisi[jpisi]=iourps;<br \/>\n       jpisi++;<br \/>\n       pisi[jpisi]=-1;<br \/>\n     }<br \/>\n   }<br \/>\n   jbisi=0;<br \/>\n   jiisi=0;<br \/>\n   jpisi=0;<br \/>\n   if (bisi[jbisi] != -1) {<br \/>\n   ourps=document.getElementsByTagName(\"b\");<br \/>\n   for (iourps=0; iourps&lt;ourps.length; iourps++) {<br \/>\n     if (iourps == bisi[jbisi]) {<br \/>\n       ourps[iourps].className = \"dyk dykb\";<br \/>\n       jbisi++;<br \/>\n     }<br \/>\n   }<br \/>\n   }<br \/>\n   if (iisi[jiisi] != -1) {<br \/>\n   ourps=document.getElementsByTagName(\"i\");<br \/>\n   for (iourps=0; iourps&lt;ourps.length; iourps++) {<br \/>\n     if (iourps == iisi[jiisi]) {<br \/>\n       ourps[iourps].className = \"dyk dyki\";<br \/>\n       jiisi++;<br \/>\n     }<br \/>\n   }<br \/>\n   }<br \/>\n   if (pisi[jpisi] != -1) {<br \/>\n   ourps=document.getElementsByTagName(\"p\");<br \/>\n   for (iourps=0; iourps&lt;ourps.length; iourps++) {<br \/>\n     if (iourps == pisi[jpisi]) {<br \/>\n       ourps[iourps].className = \"dyk dykp\";<br \/>\n       jpisi++;<br \/>\n     }<br \/>\n   }<br \/>\n   }<br \/>\n}<br \/>\n<\/b><br \/>\n&lt;\/script&gt;<br \/>\n<b><\/b><br \/>\n&lt;?php<br \/>\n  if (isset($_GET['showtags'])) {<br \/>\n    echo \"&lt;link href='\/\/www.rjmprogramming.com.au\/HTMLCSS\/showtags.css' rel='stylesheet' type='text\/css'&gt;\";<br \/>\n  }<br \/>\n?&gt;<br \/>\n&lt;\/head&gt;<br \/>\n<b><\/b><br \/>\n&lt;body onload=\" <b>checkonl();<\/b> setTimeout(initpostedoncc, 3000);  sdescih();  widgetcon(); precc(); courseCookies(); cookie_fonts(); \" &lt;?php body_class(); ?&gt;&gt;<br \/>\n<b><\/b><br \/>\n<b><\/b><br \/>\n\/\/ ...<br \/>\n<b><\/b><br \/>\n<\/code><\/p>\n<p id='sptoday'><b><i>Stop Press<\/i><\/b><\/p>\n<p>Where we say &#8220;one unique HTML element property <i>class<\/i>Name&#8221; above it pans out with our CSS that we don&#8217;t use this added HTML element property <i>class<\/i>Name intelligence, but sometimes it is good to help out with future CSS possibilities here.  In this same line of thinking you may notice that we did not &#8220;hang our hat&#8221; on &#8220;have followed the flagging of the special section of content by the next HTML element being an HTML <i>p<\/i> paragraph element&#8221; &#8230; by the looks &#8230; because the applicable CSS went <i>.dyk + * { &#8230; }<\/i> &#8230; where the <i>+<\/i> stands for &#8220;adjacent to&#8221; and the <i>*<\/i> stands for &#8220;any HTML element type&#8221; &#8230; and this is because we didn&#8217;t want to be inflexible with this, but more, just wanted the reader&#8217;s eyes to be lead down to the first of the content after the yellow background &#8220;special section&#8221; &#8220;Did you know?&#8221; or &#8220;Stop Press&#8221; grabbed their attention.<\/p>\n<hr>\n<p id='cahcast'>Previous relevant <a target=_blank title='CSS and HTML Complex Attribute Selectors Tutorial' href='https:\/\/www.rjmprogramming.com.au\/ITblog\/css-and-html-complex-attribute-selectors-tutorial\/'>CSS and HTML Complex Attribute Selectors Tutorial<\/a> is shown below.<\/p>\n<div style=\"width: 230px\" class=\"wp-caption alignnone\"><a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/complex_attribute_selectors.html\"><img decoding=\"async\" style=\"border: 15px solid pink;\" alt=\"CSS and HTML Complex Attribute Selectors Tutorial\" src=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/complex_attribute_selectors.jpg\"  \/><\/a><p class=\"wp-caption-text\">CSS and HTML Complex Attribute Selectors Tutorial<\/p><\/div>\n<p>In the spirit of CSS itself, as the study of <a target=_blank title='Cascading Style Sheet information from Wikipedia ... thanks' href='https:\/\/en.wikipedia.org\/wiki\/Cascading_Style_Sheets'>Cascading Style Sheets<\/a>, we want to add an &#8220;onion layer&#8221; on top of what we started doing back at <a title='CSS and HTML Complex Selectors Primer Tutorial' href='#cahcspt'>CSS and HTML Complex Selectors Primer Tutorial<\/a> as shown below, today.  That &#8220;onion layer&#8221;, in our <a target=_blank title='Onions' href='https:\/\/www.rjmprogramming.com.au\/ITblog\/?s=onions'>&#8220;onions of the 4th dimension&#8221;<\/a> feeling here, relates to HTML element <a target=_blank title='http:\/\/www.w3schools.com\/html\/html_attributes.asp' title='HTML element attribute information from w3schools'><i>attributes<\/i><\/a> &#8230;<\/p>\n<blockquote cite='http:\/\/www.w3schools.com\/html\/html_attributes.asp'><p>\nAttributes provide additional information about HTML elements.<br \/>\n<b><\/b><br \/>\n    All HTML elements can have attributes<br \/>\n    Attributes provide additional information about an element<br \/>\n    Attributes are always specified in the start tag<br \/>\n    Attributes usually come in name\/value pairs like: name=&#8221;value&#8221;\n<\/p><\/blockquote>\n<p>Now, as you can imagine, there is no end to the level of (fine) granularity of &#8220;selection&#8221; this gives you as a tool, in relation to picking out really specific subsets of HTML (elements) for your CSS styling attention.  Perhaps the most everyday HTML element with important &#8220;attributes&#8221; that we can think of, is the HTML <i>a<\/i> tag, as a link to &#8220;somewhere&#8221; &#8230; <font size=1>though &#8220;somewhere&#8221; can also be <a target=_blank title='HTML a Tag Navigation Primer Tutorial' href='https:\/\/www.rjmprogramming.com.au\/ITblog\/html-a-tag-navigation-primer-tutorial\/'>&#8220;nowhere&#8221;<\/a> &#8230; chortle, chortle<\/font> &#8230; and today&#8217;s work replaces the HTML <i>p<\/i> (child) element types of the previous tutorial and replaces them with HTML <a target=_blank title='HTML a tag information from w3schools' href='http:\/\/www.w3schools.com\/tags\/tag_a.asp'><i>a<\/i><\/a> (child) element types, for our purposes today.<\/p>\n<p>If you clicked that last link you&#8217;d have seen a myriad of HTML <i>a<\/i> tag &#8220;attribute&#8221; possibilities for you to think about &#8230; at the time of writing, namely &#8230;<\/p>\n<ul>\n<li>charset<\/li>\n<li>coords<\/li>\n<li>download<\/li>\n<li>href<\/li>\n<li>hreflang<\/li>\n<li>media<\/li>\n<li>name<\/li>\n<li>rel<\/li>\n<li>rev<\/li>\n<li>shape<\/li>\n<li>target<\/li>\n<li>type<\/li>\n<\/ul>\n<p> &#8230; which seems like a lot of scope for (fine granular selector) definition.  However, this &#8220;attribute&#8221; selection does not apply to inferred default values.  In other words, if the default <i>target=&#8221;_self&#8221;<\/i> is not actually written in your HTML for a given HTML <i>a<\/i> tag that you want to hone in on for particular styling, don&#8217;t expect CSS like <i>a[target=&#8221;_self&#8221;] { font-weight: bold; }<\/i> to catch these, as this &#8220;attribute&#8221; selector CSS only applies to specifically defined and &#8220;attributed&#8221; HTML.<\/p>\n<p>And so, today, we have links to &#8230;<\/p>\n<ul>\n<li><a target=_blank title='Tutorial picture' href='http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/complex_attribute_selectors.jpg'>Tutorial picture<\/a> today, again, curiously, may be more useful to you than &#8230;<\/li>\n<li><a target=_blank title='Click picture' href='http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/complex_attribute_selectors.html'>Live run<\/a> &#8230; made up of &#8230;<\/li>\n<li>HTML and CSS programming source code you could call <a target=_blank title='complex_attribute_selectors.html' href='http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/complex_attribute_selectors.html-GETME'>complex_attribute_selectors.html<\/a> (that got derived in <a target=_blank title='complex_attribute_selectors.html' href='http:\/\/www.rjmprogramming.com.au\/PHP\/Geographicals\/diff.php?one=http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/complex_attribute_selectors.html-GETME'>this way<\/a>)<\/li>\n<\/ul>\n<p> &#8230; for your perusal, and thought.  Once again, thanks to this <a target=_blank title='Great link' href='http:\/\/learn.shayhowe.com\/advanced-html-css\/complex-selectors\/'>wonderful inspiring link<\/a>.<\/p>\n<p><b><i>Did you know?<\/i><\/b><\/p>\n<p>As you might suspect there is a &#8220;contains&#8221; way to define &#8220;attribute&#8221; selectors.  Where we have, today &#8230;<\/p>\n<p><code><br \/>\na[href=\"http:\/\/www.rjmprogramming.com.au\"]<br \/>\n<\/code><\/p>\n<p> &#8230; we could widen its scope (of cover) via the &#8220;contains&#8221; version &#8230;<\/p>\n<p><code><br \/>\na[href*=\"rjmprogramming.com.au\"]<br \/>\n<\/code><\/p>\n<p> &#8230; to cover any URL from this domain.<\/p>\n<hr>\n<p id='cahcspt'>Previous relevant <a target=_blank title='CSS and HTML Complex Selectors Primer Tutorial' href='https:\/\/www.rjmprogramming.com.au\/ITblog\/css-and-html-complex-selectors-primer-tutorial\/'>CSS and HTML Complex Selectors Primer Tutorial<\/a> is shown below.<\/p>\n<div style=\"width: 230px\" class=\"wp-caption alignnone\"><a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/complex_selectors.html\"><img decoding=\"async\" style=\"border: 15px solid pink;\" alt=\"CSS and HTML Complex Selectors Primer Tutorial\" src=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/complex_selectors.jpg\"  \/><\/a><p class=\"wp-caption-text\">CSS and HTML Complex Selectors Primer Tutorial<\/p><\/div>\n<p>Today, as with WordPress 4.1.1&#8217;s <a target=_blank title='CSS and HTML Complex Selectors Primer Tutorial' href='https:\/\/www.rjmprogramming.com.au\/ITblog\/css-and-html-complex-selectors-primer-tutorial\/'>CSS and HTML Complex Selectors Primer Tutorial<\/a>, we want to delve deeper into the less obvious aspects of CSS, encouraged as we were to find this <a target=_blank title='Great link' href='http:\/\/learn.shayhowe.com\/advanced-html-css\/complex-selectors\/'>wonderful inspiring link<\/a> &#8230; thanks.  But hold off on the &#8220;bounce&#8221; now, because we are value adding the wonderful information from the link with practical and self explanatory HTML and CSS web applications that all show &#8230;<\/p>\n<ul>\n<li>CSS involved &#8230; is inline CSS shown and available in the HTML programming source you can optionally download &#8230; and &#8230;<\/li>\n<li>HTML subset of relevance that the CSS acts on &#8230; above &#8230;<\/li>\n<li>The resultant HTML webpage result<\/li>\n<\/ul>\n<p> &#8230; all these three components on the one webpage, to help with &#8220;cause and effect&#8221; regarding these more complex CSS concepts.  Perhaps, that way, they&#8217;ll &#8220;sink in&#8221; quite well?!<\/p>\n<p>So what &#8220;Complex Selector&#8221; types are we trying to highlight in today&#8217;s web application &#8230;<\/p>\n<ol>\n<li>Direct Child &#8230; child in parent\/child relationship &#8230; (Today&#8217;s) eg. <i>article &gt; p<\/i> { &#8230; }<\/li>\n<li>General Sibling &#8230; elements at the same hierarchical layer &#8230; (Today&#8217;s) eg. <i>h2 ~ p<\/i> { &#8230; }<\/li>\n<li>Adjacent Sibling &#8230; first elements at the same hierarchical layer &#8230; (Today&#8217;s) eg. <i>h2 + p<\/i> { &#8230; }<\/li>\n<\/ol>\n<p>Knowing about some of these more esoteric selectors could help you pinpoint specific elements within complex &#8220;container&#8221; elements, we hope you get out of today&#8217;s work.<\/p>\n<p>So this leaves us leaving you with links to &#8230;<\/p>\n<ul>\n<li><a target=_blank title='Tutorial picture' href='http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/complex_selectors.jpg'>Tutorial picture<\/a> today, curiously, may be more useful to you than &#8230;<\/li>\n<li><a target=_blank title='Click picture' href='http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/complex_selectors.html'>Live run<\/a> &#8230; made up of &#8230;<\/li>\n<li>HTML and CSS programming source code you could call <a target=_blank title='complex_selectors.html' href='http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/complex_selectors.html_GETME'>complex_selectors.html<\/a><\/li>\n<\/ul>\n<p> &#8230; and we&#8217;ll get back to you with more CSS of this ilk as time goes on.<\/p>\n<p>If this was interesting you may be interested in <a title='Click here to see topics in which you might be interested' href='#d19034' onclick='var dv=document.getElementById(\"d19034\"); dv.innerHTML = \"&lt;iframe width=670 height=600 src=\" + \"https:\/\/www.rjmprogramming.com.au\/ITblog\/tag\/css\" + \"&gt;&lt;\/iframe&gt;\"; dv.style.display = \"block\";'>this<\/a> too.<\/p>\n<div id='d19034' style='display: none; border-left: 2px solid green; border-top: 2px solid green;'><\/div>\n<hr>\n<p>If this was interesting you may be interested in <a title='Click here to see topics in which you might be interested' href='#d24020' onclick='var dv=document.getElementById(\"d24020\"); dv.innerHTML = \"&lt;iframe width=670 height=600 src=\" + \"https:\/\/www.rjmprogramming.com.au\/ITblog\/tag\/attribute\" + \"&gt;&lt;\/iframe&gt;\"; dv.style.display = \"block\";'>this<\/a> too.<\/p>\n<div id='d24020' style='display: none; border-left: 2px solid green; border-top: 2px solid green;'><\/div>\n<hr>\n<p>If this was interesting you may be interested in <a title='Click here to see topics in which you might be interested' href='#d24020' onclick='var dv=document.getElementById(\"d24020\"); dv.innerHTML = \"&lt;iframe width=670 height=600 src=\" + \"https:\/\/www.rjmprogramming.com.au\/ITblog\/tag\/wordpress\" + \"&gt;&lt;\/iframe&gt;\"; dv.style.display = \"block\";'>this<\/a> too.<\/p>\n<div id='d24020' style='display: none; border-left: 2px solid green; border-top: 2px solid green;'><\/div>\n<hr>\n<p>If this was interesting you may be interested in <a title='Click here to see topics in which you might be interested' href='#d19034' onclick='var dv=document.getElementById(\"d19034\"); dv.innerHTML = \"&lt;iframe width=670 height=600 src=\" + \"https:\/\/www.rjmprogramming.com.au\/ITblog\/tag\/css\" + \"&gt;&lt;\/iframe&gt;\"; dv.style.display = \"block\";'>this<\/a> too.<\/p>\n<div id='d19034' style='display: none; border-left: 2px solid green; border-top: 2px solid green;'><\/div>\n<hr>\n<p>If this was interesting you may be interested in <a title='Click here to see topics in which you might be interested' href='#d24020' onclick='var dv=document.getElementById(\"d24020\"); dv.innerHTML = \"&lt;iframe width=670 height=600 src=\" + \"https:\/\/www.rjmprogramming.com.au\/ITblog\/tag\/attribute\" + \"&gt;&lt;\/iframe&gt;\"; dv.style.display = \"block\";'>this<\/a> too.<\/p>\n<div id='d24020' style='display: none; border-left: 2px solid green; border-top: 2px solid green;'><\/div>\n<hr>\n<p>If this was interesting you may be interested in <a title='Click here to see topics in which you might be interested' href='#d24065' onclick='var dv=document.getElementById(\"d24065\"); dv.innerHTML = \"&lt;iframe width=670 height=600 src=\" + \"https:\/\/www.rjmprogramming.com.au\/ITblog\/tag\/wordpress\" + \"&gt;&lt;\/iframe&gt;\"; dv.style.display = \"block\";'>this<\/a> too.<\/p>\n<div id='d24065' style='display: none; border-left: 2px solid green; border-top: 2px solid green;'><\/div>\n<hr>\n<p>If this was interesting you may be interested in <a title='Click here to see topics in which you might be interested' href='#d36099' onclick='var dv=document.getElementById(\"d36099\"); dv.innerHTML = \"&lt;iframe width=670 height=600 src=\" + \"https:\/\/www.rjmprogramming.com.au\/ITblog\/tag\/javascript\" + \"&gt;&lt;\/iframe&gt;\"; dv.style.display = \"block\";'>this<\/a> too.<\/p>\n<div id='d36099' style='display: none; border-left: 2px solid green; border-top: 2px solid green;'><\/div>\n","protected":false},"excerpt":{"rendered":"<p>When you are tailoring a WordPress blog, using the &#8220;edit header.php&#8221; principles we use so much here, at this blog, different aims coalesce on shared Javascript function intervention points, just about all associated with document.body onload event intervention, we most &hellip; <a href=\"https:\/\/www.rjmprogramming.com.au\/ITblog\/wordpress-blog-isbn-links-primer-tutorial\/\">Continue reading <span class=\"meta-nav\">&rarr;<\/span><\/a><\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[12,14,37],"tags":[151,156,354,400,471,1525,2468,652,1807,870,1825,932,997,2470,1319,1324,1325,1456],"class_list":["post-36099","post","type-post","status-publish","format-standard","hentry","category-elearning","category-event-driven-programming","category-tutorials","tag-blog","tag-book","tag-dom","tag-event","tag-function","tag-innerhtml","tag-isbn","tag-javascript","tag-link","tag-onload","tag-paragraph","tag-php","tag-programming","tag-textcontent","tag-tutorial","tag-twentyten","tag-twentyten-theme","tag-wordpress"],"_links":{"self":[{"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/posts\/36099"}],"collection":[{"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/comments?post=36099"}],"version-history":[{"count":11,"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/posts\/36099\/revisions"}],"predecessor-version":[{"id":39532,"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/posts\/36099\/revisions\/39532"}],"wp:attachment":[{"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/media?parent=36099"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/categories?post=36099"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/tags?post=36099"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}