Navigation Code for Furlife Ring

There are two different styles of navigation for the ring, the original style has a largish graphic on the left (which could be chosen from a selection of images) and text links for navigation on the right. The new style has a smaller graphic and is typically generated automatically be the WebRing servers. This is the Server Side Navigaiton Bar (SSNB). JavaScript is used to include the SSNB, and on the whole it is less hassle to use.

Do I need to change my existing navigation code?

If you are a current member, and your navigation code references servers at yahoo.com then you will need to change your navigation code. If your navigation code still has links to webring.org/cgi-bin then you should probably change your navigation code (although currently this seems to work).

If your navigation code links point to http://webring.com/ as opposed to http://F.webring.com/ then you should change your navigation code as your site will be automatically suspended by the "improved" navigation code checker.

Finally, if you are an HTML pedant, and are fed up with the W3C's HTML validator blowing chunks on the navigation code, then you may also want to update your navigaiton code. Using & instead of just & in the hyperlinks helps alot.

In each case just follow the instructions for getting new code and use this to replace what you have already.

New style navigation code

This is less cluttered if you belong to many WebRings, and has the advantage that you won't need to change it if you join more. Just cut and paste the HTML code generated for you by your site management page. This is explained in step 3 of the joining instructions.

Old style navigation code

The old style navigation code produces something looking like this:

Furlife


This Furry Lifestyle Webring site
is owned by YourName

[ Prev | Prev 5 | Random | All Sites | Next | Next 5 ]

Why not join the Furry Lifestyle Webring?

And the code that generates it is shown below. Just cut and past this into your own page and then customise it by changing the bits that appear here in green. Additional notes on these changes can be found after the code.

<center>
<table border="4" cellspacing="2" cellpadding="0">
    <tr>
        <td align="center">
            <a href="http://www.konig.demon.co.uk/fur/furlife/index.html"
                target="_top"
            ><img
                height="120" width="220" border="0" align="left" alt="Furlife"
                src="furlife2.jpg"
            /></a
        ></td>
        <td align="center">
            <p align="center">
                <br/>
                This
                <a href="http://www.konig.demon.co.uk/fur/furlife/index.html"
                    target="_top">Furry Lifestyle Webring</a> site
                <br/>
                is owned by
                <a href="mailto:you@isp.com">YourName</a>
                <br/>
                <br/>
                [
                <a href="http://F.webring.com/go?ring=furlife&amp;id=X&amp;prev"
                    target="_top">Prev</a>
                |
                <a href="http://F.webring.com/go?ring=furlife&amp;id=X&amp;prev5"
                    target="_top">Prev 5</a>
                |
                <a href="http://F.webring.com/go?ring=furlife&amp;id=X&amp;random"
                    target="_top">Random</a>
                |
                <a href="http://F.webring.com/hub?ring=furlife&amp;id=X&amp;hub"
                    target="_top">All Sites</a>
                |
                <a href="http://F.webring.com/go?ring=furlife&amp;id=X&amp;next"
                    target="_top">Next</a>
                |
                <a href="http://F.webring.com/go?ring=furlife&amp;id=X&amp;next5"
                    target="_top">Next 5</a>
                ]
                <br/>
                <br/>
                Why not join the
                <a href="http://www.konig.demon.co.uk/fur/furlife/index.html"
                    target="_top">Furry Lifestyle Webring</a>?
                <br/>
            </p>
        </td>
    </tr>
</table>
</center>

Customising Site Id

This is the most important change, and must be done in order for your navigation code to work. You need to find the id number of your site within the ring. This should be in the mail you are sent when your site is accepted. Use this number to replace the X in each of six places where the id=X sequence occurs. Don't introduce any spaces before or after the number.

Customising Images

Images can now be found in a neat little table for your browsing enjoyment. Copy the image file to your own pages and change the src filename as appropriate. For some of the images that differ from the default size you will have to change the width and height settings too.

Customising Ownership Link

You should definitely change the YourName part to give your furry or real name. Exactly what to do with the owner link needs a little more thought. The owner link above uses a mailto URI that will bring up a mail client if the user clicks on it. However there is some evidence that spammers harvest e-mail addresses from web pages with mailto links. You may want to give a URL for a contact page or your guestbook instead.

Roll your own navigation code

Locandez (clever fox that he is) has pointed out to me that nofur actually needs to follow the HTML guidelines. That is true. If you are not satisfied with the current HTML code, then you do not have to use it. Just keep in mind that the actual URLs need to be intact in order for the ring to work, and you can create your own stylized HTML. It can include your own GIFs, or no GIFs at all, only text. It is up to you.

Just remember to check that your site passes the navigation code test that you can invoke from the page for editing your site's information. It it fails this test your site will be automagically suspended from the ring.