This post was published long before the Mists of Pandara Expansion.
The tips and techniques explained here may be outdated.

Blogroll Modifications

I’m mucking around with my blogroll. I’m totally stealing the code from “They see me Trollin’” and reworking it to my own needs.

What this means to you. First of all.. I added a ton of blogs to my blogroll. I’ve changed some of the names to start with “X–” if the blog hasn’t been updated in a while. I was able to add all these additional blogs without having the list totally scroll off my screen. Secondly, I had to classify all of the blogs.. I -think- I got it right.. but if your blog is mis-classified (and you care) drop me a comment and I’ll move you around.

Specifically I read my blogs through Bloglines. That way I can easily see who’s updated without having to click through to every blog. Because of this I can’t individually tag each link with something like “blogrolljs-pal-hunt-pri”. Instead I have the blogs saved into different folders depending on their topic. I have a folder for each class.. and a “Wow” folder (for all you altoholics or those who are only vaguely wow related). I use special PHP code to pull the blogroll in from bloglines.

Code (for the curious):

<img src="img/pal.png" title="Paladin Blogs" onclick="changeDiv('pal','Paladin Reading')"/>
<img src="img/lock.png" title="Warlock Blogs" onclick="changeDiv('lock','Warlock Reading')"/>
...

        <div class="blogrolljs-wow"><?php
           $servername="rpc.bloglines.com";
           $path="/blogroll?html=1&id=Nibuca&folder=WoW";
           $fp = fsockopen($servername, 80, $errno, $errstr, 4);
           $bloglines="";
           if ($fp) {
              fputs($fp, "GET $path HTTP/1.0\r\n\r\n");
              fputs($fp, "User-Agent: " . $HTTP_USER_AGENT);

              while(!feof($fp))
              { $bloglines.=fgets($fp, 4096);
              }
              fclose($fp);
              $htmltext = preg_replace("/^HTTP.*\r\n\r\n\s*/s", "", $bloglines);
              echo ($htmltext);
           }
?></div>
</ul>
<ul><div class="blogrolljs-pal">
        <php
           $path="/blogroll?html=1&id=Nibuca&folder=Paladin";
           $fp = fsockopen($servername, 80, $errno, $errstr, 4);
           $bloglines="";
           if ($fp) {
              fputs($fp, "GET $path HTTP/1.0\r\n\r\n");
              fputs($fp, "User-Agent: " . $HTTP_USER_AGENT);

              while(!feof($fp))
              { $bloglines.=fgets($fp, 4096);
              }
              fclose($fp);
              $htmltext = preg_replace("/^HTTP.*\r\n\r\n\s*/s", "", $bloglines);
              echo ($htmltext);
           }
?>
<div></ul>
<ul><div class="blogrolljs-lock">
        <?php
           $path="/blogroll?html=1&id=Nibuca&folder=Warlock";
           $fp = fsockopen($servername, 80, $errno, $errstr, 4);
           $bloglines="";
           if ($fp) {
              fputs($fp, "GET $path HTTP/1.0\r\n\r\n");
              fputs($fp, "User-Agent: " . $HTTP_USER_AGENT);

              while(!feof($fp))
              { $bloglines.=fgets($fp, 4096);
              }
              fclose($fp);
              $htmltext = preg_replace("/^HTTP.*\r\n\r\n\s*/s", "", $bloglines);
              echo ($htmltext);
           }
?>
</div></ul>

etc..
...

<script type="text/javascript">
<!--
function changeDiv(name,title)
{
   var d = document.getElementsByTagName('DIV');
   for(var i=0;i<d.length;i++)
   {
      if(d[i].className.indexOf('blogrolljs') != -1)
      {
         if(d[i].className.indexOf(name) != -1)
         {  d[i].style.display = '';
         }else{
            d[i].style.display = 'none';
         }
      }
   }
}

changeDiv("none","None");

If I wasn’t lazy I’d turn the file-fetch into a function.. but meh, I can’t be bothered.

Similar Posts:

5 comments to Blogroll Modifications

  • Very cool. The only suggestion I’d make is you can somehow make it collapse again. But very cool.

  • Nibuca

    Good idea! And a quick update.

    I changed the function to the following:

    <script type="text/javascript">
    <!--
    function changeDiv(name,title)
    {
       var d = document.getElementsByTagName('DIV');
       for(var i=0;i<d.length;i++)
       {
          if(d[i].className.indexOf('blogrolljs') != -1)
          {
             if(d[i].className.indexOf(name) != -1)
             {  
                if(d[i].style.display=='') 
                { d[i].style.display = 'none';
                } else {
                   d[i].style.display = '';
                }
             }else{
                d[i].style.display = 'none';
             }
          }
    }
    //document.getElementById('blogroll-title').innerHTML=title;
    }
    changeDiv("none","None");
    -->
    </script>
    
  • Necrobutcher

    thats a great blog roll code! does this work for blogspot?

  • Nibuca

    The code for showing/hiding the divs will work on any platform. The code for pulling in the links from bloglines is PHP specific so probably won’t work on blogspot.

  • VERY cool, Nibuca! I may end up stealing/modding that code myself. :) Wonder if I can somehow do a mashup of your code and what I currently use…although I’m not sure at the moment what I think it should look like.

    But I definitely like the way you did it. :)