This page (set up just so I could see how Blogger works) is a portal
to our adventures in food and drink, recipes, disasters, triumphs...


Please use the links below or go directly to the real blog from OUR kitchen



` ` `


19 November 2007

The Foodie BlogRoll

 
The Foodie Blogroll Even though I still have a horror of the word "foodie" and visibly cringe even when I type it, I must accept the fact that language evolves... this particular "F" word should not to be considered a disparaging term. My reluctant acceptance (almost - I'm still shuddering every time I see it) of the word is partially due to The Foodie BlogRoll (TFB), started and maintained by Jenn (The Leftover Queen). It is a handy (and growing!) list of links to food related blogs. You may have seen the TFB image on the sidebars of various blogs.

It's easy to join The Foodie BlogRoll - just fill out the form at the bottom of the linked page.

Take a look at the list of all the blogs already on the list! This community is HUGE!

Here is the javascript I have used to contract/expand the BlogRoll. Copy and paste it into a text editor (notepad) and save the file as "showhideblogroll.js" :

// thanks to http://derya-webresource.blogspot.com

var showHeader=false;
function ShowHideNav()
{
showHeader=!showHeader;
var nav=document.getElementById("blogroll");
if (showHeader)
{
nav.style.visibility="visible";
nav.style.display="block";
nav.style.border="none !important";
nav.style.overflow="auto";
nav.style.height="100%";
}
else
{
//nav.style.visibility="hidden";
//nav.style.display="none";
nav.style.visibility="visible";
nav.style.display="block";
nav.style.overflow="auto";
nav.style.border="1px inset #def";
nav.style.height="100px";
}

var nav=document.getElementById("showit");
if (showHeader)
{
document.getElementById('showit').innerHTML="Contract";
}
else
{
document.getElementById('showit').innerHTML="Expand";
}

}


Here is the stylesheet for the BlogRoll. Copy and paste it into a text editor (notepad) and save the file as "blogrollstyle.css"

#blogroll {
border:1px inset #def;
padding-left:20px;
visibility:visible;
display:block;
overflow:auto;
height:100px;
}

#showhide {cursor:pointer;color:#006;}

#fblogroll {
background:transparent url(http://i9.tinypic.com/6hfdsa9.gif) no-repeat top left;
width:165px;
padding:23px 0 2px 4px;
display:block;
font-family:sans-serif;
color:#033;
text-decoration:none;
}


Upload the blogrollstyle.css and showhidefoodblogger.js to your directory. Copy and paste the following coding somewhere above </head>

<script src="http://yourblogURL/showhidefoodblogger.js" language="javascript" type="text/javascript">
</script>

<link rel="StyleSheet" href="http://yourblogURL/blogrollstyle.css" type="text/css" />


And finally here is the coding to place the BlogRoll on the page. Copy and paste the coding into your sidebar (or wherever it is you want TFB to be displayed - somewhere below <body>)

<p><small><a href="http://www.leftoverqueen.com/the-foodie-blogroll" title="Click to Join the Foodie Blogroll (offsite link)" id="fblogroll">click here to join</a></small><br />

<span id="showhide" onclick="ShowHideNav();" title="The Foodie BlogRoll"><small><i><u><span id="showit">Expand</span></u> "The Foodie BlogRoll"</i></small><br /><br />

<div id="blogroll">
<script language="javascript" type="text/javascript" src="http://rpc.blogrolling.com/display.php?r=d42e337f325aa021a80d72ed0e728169"></script></div></span></p>