Author Topic: Add a <link>bar to all pages  (Read 1511 times)

Jor

  • Sr. Member
  • ****
  • Posts: 421
    • ICQ Messenger - 10401286
    • AOL Instant Messenger - jor otf
    • Yahoo Instant Messenger - jor_otf
    • View Profile
    • http://members.outpost10f.com/~jor/
    • Email
Add a <link>bar to all pages
« on: June 07, 2002, 10:00:29 PM »
Mozilla is now out, and a little hack can get the link bar (or "site navigation" bar) working in there. So now browsers with support for <link> are Mozilla (all platforms), Opera for the Macintosh, iCab, Lynx, and a few obscure others, unfortunately this HTML2 tag is still not supported by other browsers (!), so for all other browsers, including Netscape 4, MSIE, Opera (not Mac), I have written this filter to add a link toolbar to the top of the page. It is still very much a test version, but it seems to work

It consists of two filtes, one to preserve stylesheets served by the <link> tag, and the other does the actual work. Styling is done by an entry in your Prox.css or Links.css, also given below.

The filters:
[Patterns]
Name = "Link toolbar: Preserve Stylesheets"
Active = TRUE
URL = "$TYPE(htm) &$OHDR(User-Agent:(^*Gecko*))"
Bounds = "<links*>"
Limit = 512
Match = "<link 1 rel=$AV(stylesheet) 2>"
Replace = "<link 1 rel="stylesheet" 2>"

Name = "Link toolbar"
Active = TRUE
URL = "$TYPE(htm) &$OHDR(User-Agent:(^*Gecko*))"
Bounds = "<links*>"
Limit = 512
Match = "<link (*rel=$AV(1) & *href=$AV(*2) & "
        "*title=$AV(*3))*>"
Replace = "<a href="2" title="3" class="linkbar">[Link: 1]</a> "


The CSS to add to your own CSS file:
/* The Link bar: */
.linkbar
{
  background-color : green !important;
  color : white !important;
  border : thin solid white !important;
  font-size : xx-small !important;
  text-align : center !important;
  margin : 1em -0.5em 1em 0em !important;
}
.linkbar:hover
{
  background-color : red !important;
  color : yellow !important;
}


As you can see I messed with the margins some, this is to make sure it will stay in the top left of the page, and have almost no space between two link items. The default style behaviour is to put the links inside a green block, which turns into red when the mouse is hovered over it. The title attribute is used to display additional information.

Obvious problem: this filter breaks a frameset which also uses <link> (I have never encountered both in the same site tho). If you have any suggestions on how I may fix this?

<link> test pages:
http://www.subotnik.net/html/link.html.en and
http://www.euronet.nl/~tekelenb/WWW/LINK/

[Edit: added  &$OHDR(User-Agent:(^*Gecko*)) to the URL match, so when using a browser based on Gecko (such as Mozilla 1.0 Gold) <link> tags are not filtered. Using the built-in link bar is always preferable.]

Edited by - Jor on 08 Jun 2002  00:01:57
 

Jor

  • Sr. Member
  • ****
  • Posts: 421
    • ICQ Messenger - 10401286
    • AOL Instant Messenger - jor otf
    • Yahoo Instant Messenger - jor_otf
    • View Profile
    • http://members.outpost10f.com/~jor/
    • Email
Add a <link>bar to all pages
« Reply #1 on: June 15, 2002, 08:54:53 PM »
I finally managed to combine the linktoolbar and the stylesheet preserver in one filter, new version follows:

Filter:
[Patterns]
Name = "Link toolbar"
Active = TRUE
URL = "$TYPE(htm) &$OHDR(User-Agent:(^*Gecko*))"
Bounds = "<links*>"
Limit = 512
Match = "<link (*rel=$AV(1) & *href=$AV(*2) & "
        "*title=$AV(*3) & (^*rel=$AV(stylesheet)))*>"
Replace = "<a href="2" title="3" class="linkbar">[Link: 1]</a>"


Css:
/* Styling for use with the Link bar: */
a.linkbar {
  background-color : green !important;
  color : white !important;
  border : thin solid white !important;
  font-size : xx-small !important;
  text-align : center !important;
  margin : 1em -0.5em 1em 0em !important;
}
a.linkbar:hover {
  background-color : red !important;
  color : yellow !important;
}




Edited by - Jor on 18 Jun 2002  15:32:41
 

Jor

  • Sr. Member
  • ****
  • Posts: 421
    • ICQ Messenger - 10401286
    • AOL Instant Messenger - jor otf
    • Yahoo Instant Messenger - jor_otf
    • View Profile
    • http://members.outpost10f.com/~jor/
    • Email
Add a <link>bar to all pages
« Reply #2 on: July 18, 2002, 11:44:53 AM »
These screenshots show what the link toolbar looks like in Opera and MSIE:





Edited by - Jor on 18 Jul 2002  12:46:18
 

Jor

  • Sr. Member
  • ****
  • Posts: 421
    • ICQ Messenger - 10401286
    • AOL Instant Messenger - jor otf
    • Yahoo Instant Messenger - jor_otf
    • View Profile
    • http://members.outpost10f.com/~jor/
    • Email
Add a <link>bar to all pages
« Reply #3 on: July 23, 2002, 11:32:40 AM »
Updated version:

Name = "Link toolbar"
Active = TRUE
URL = "$TYPE(htm) &$OHDR(User-Agent:(^*Gecko*))"
Bounds = "<links*>"
Limit = 512
Match = "<link (*re(l|v)=$AV(1) (& *title=$AV(*3)|) & "
        "*href=$AV(*2) & "
        "(^*re(l|v)=$AV(stylesheet|(shortcut |)icon)))*>"
Replace = "<a href="2" title="3" class="linkbar">[Link: 1]</a>"

This version will also target (spec-breaking!) <link> tags without a title, and still leave the shortcut-icon ("favicon") alone.

I noticed on PHP-based boards this plugin looks quite bad, because those boards create a LOT of <link>s, but alas I can't think of a good workaround.

(Edit: minor update, the previous version didn't catch rev)

(Edit: found a variation for shortcut icons, therefore changed shortcut icon to (shortcut |)icon.)

Edited by - Jor on 15 Aug 2002  20:07:47