Google Blogoscoped

Forum

Finding Links in a Page?

Philipp Lenssen [PersonRank 10]

Thursday, September 23, 2004
19 years ago

When I check who commented on one of my blog posts, or who put up any other kind of backlink, I follow services like Bloglines, Technorati, and Feedster (usually in this order --; the Bloglines backlink checker [ http://archive/2004_07_27_index.html#109093715702397271] is my current favorite). I guess many of you do the same, as it helps to keep up the blogspace conversation.

Now here's a feature that would come in really handy: *directly highlight links within a page that link to a certain page.*

Currently after I follow the result from Bloglines or Technorati, I open the source code of the target page and search the HTML for the string "blog.outer" or similar... to then copy the text that appears in the link, close the source code view, and search for the copied text on the page. Of course this isn't really as fast as it could be.

I think it ought to be possible to just write a user stylesheet to include in Firefox which would always highlight a backlink. So that one would configure the URL-start-pattern (" blog.outer-court.com", for me). I am unsure if this is possible in CSS2 using the Mozilla engine, and also, how to include user stylesheets in Firefox to begin with. As alternative, I wonder how one could write a Firefox extension (or bookmarklet) to automate this process. *Your help is welcome!*

Jamie [PersonRank 0]

19 years ago #

The web developer extension has several style sheets for outlining various things. I opened up webdeveloper.jar and found this for outlining links without title attributes:

a:not([title])
{
   -moz-outline: 1px dotted #ff0000!important;
}

I don't know enough CSS to say href=something*... I think this is a good start though.

Jamie [PersonRank 0]

19 years ago #

Ahh... Found it in the CSS3 "selectors" specification. Look at section 2:
http://www.w3.org/TR/2001/CR-css3-selectors-20011113/

So... The selector and code might be:
a[href*="blog.outer-court.com"]
{
-moz-outline: 1px dotted #ff0000!important;
}

Jamie [PersonRank 0]

19 years ago #

OK – it worked. Here's what you need to do. Save the code in my last comment to a file – highlight.css for example. Then, install the web developer extension for firefox. Under the CSS menu of the web developer toolbar, select Add user stylesheet and browse to the stylesheet you created. All links to your blog will be highlighted.

Ivan [PersonRank 0]

19 years ago #

Or edit

userContent.css

and add the appropriate CSS rule.

PS: The chromEdit extension is very useful to edit that file easily http://cdn.mozdev.org/chromedit/

Philipp Lenssen [PersonRank 10]

19 years ago #

Ivan – somehow this extension gets blocked by my Firefox (pre-release 1).

... Jamie, works great!

Philipp Lenssen [PersonRank 10]

19 years ago #

Link to the Firefox "Web Developer" extension:

http://update.mozilla.org/extensions/moreinfo.php?id=60&vid=645

Ivan [PersonRank 0]

19 years ago #

You can edit userContent.css by hand, if needed. Search for userContent-example.css in your PC, edit and rename.

alek [PersonRank 10]

19 years ago #

VERY cool ... worked fine for me to edit the userContent.css by hand – I made it a solid box and the size a bit bigger (for those of us with old eyes), but very, very nice.

So ... would a similar trick work with images that hot-link to your site?

Philipp Lenssen [PersonRank 10]

19 years ago #

Where's the userContent.css file to be found? I was looking for it, but only found a file called "html.css" (which did work, however: it was also showing backlinks in my own blog).

Alek, for images I suppose the syntax is (untested):

a[href*="blog.outer-court.com"] img
{
   -moz-outline: 1px dotted #ff0000!important;
}

Jamie [PersonRank 0]

19 years ago #

Editing the usercontent file:
http://texturizer.net/firefox/edit.html
It doesn't exist by default. You have to find the Mozilla profile directory and create it in the Chrome subdirectory. I gave Chromeedit a try – it will create it for you and has some nice examples of things you might want to do with it, like disabling certain tags such as blink.

Images would probably be more like:
img[src*="blog.outer-court.com"]
{
-moz-outline: 1px dotted #ff0000!important;
}

Haven't tested it though

Philipp Lenssen [PersonRank 10]

19 years ago #

Jamie, above CSS would actually reveal images which are taken from your server, not those which link to you. An image link in HTML is like this: <a href="..."><img src="..."></a> so the according CSS must be something like "a img". But one should better try to make sure...

alek [PersonRank 10]

19 years ago #

Actually, I WAS interested in hot-linking of images, and Jamie's suggestion works just fine – here is what my userContent.css file looks like that is perhaps a bit too standout'ish, but my eyes aren't what they used to be.

a[href*="komar.org"]
{
-moz-outline: 3px solid #ff0000!important;
}

   img[src*="komar.org"]
{
-moz-outline: 6px dashed #ff0000!important
}

BTW, neither of these work if the links are relative – i.e. just path names from the actual www.komar.org home page ... but that is to be expected (although it clearly identified one case where I had left www.komar.org in the href – cool!)

And also BTW, at least for me using Firefox on Windoze, it looks like I have to restart Firefox for it to "take" ...

The userContent.css does NOT exist by default in the "chrome" directory so you have to create it – same place as the userChrome.css file – dig down under Document_and_Settings/ USERNAME/ Application_Data/ Mozilla/Firefox/ Profile/RANDOMDIRNAME/ chrome

P.S. Great "SEO 2004" article Phillipp – I especially like the business orientation of it, even though I just dabble in SEO as a hobby. If you happen to be into the Holidays, check out (and link! ;-) to my Halloween Decorations and/or Christmas Lights at:
   http://www.komar.org/halloween/
   http://www.komar.org/xmas/
I know you have HTML disabled, so I'm not trying to spam your forums and hope you don't mind the comment.

alek [PersonRank 10]

19 years ago #

Ooops ... you DO convert h-t-t-p-:-/-/'s into URL's (when I reviewed the post, guess what had a big red box around it! ;-) ... please remove above Phillipp if inappropriate.

And I forgot to say thanx a bunch Jamie and Ivan – very nice/cool feature – I'm liking Firefox more and more every day!

Jamie [PersonRank 0]

19 years ago #

What I love about Firefox is it's exactly the browser you need. Out of the box, it's lightweight and responsive. The featureset is analogous to Internet Explorer. Where it shines is when you customize it and make it yours, whether that's with extensions or a little deeper hacking like we see in this thread. You aren't adding bloat because that implies that you're adding a bunch of crap – the fact that you can pick and choose, add and remove extensions as you go makes the browser relevant to your needs.

I'd like to see them do something to help new users select extensions. Right now, unless a new user stumbles in to the Mozilla update link, they won't even know about the extensibility. This might make the browser seem weak, especially compared to something like MyIE2 (or whatever it's called now) or Opera. I don't think they should bundle some extensions... Maybe a druid or something that asks you about what you like in a browser and it suggests extensions for you after you get it installed. Then, it could point you to Mozilla update.

Incidentally, isn't it weird that you can't search for extensions? I either use the site: operator in google to limit to update.mozilla.org or browse the popular extensions list until I find what I'm looking for.

Krzychu. [PersonRank 1]

19 years ago #

Is it possible by firefox to change words into links?

[Signature removed. -Ed.]

Gosha [PersonRank 0]

18 years ago #

It is a site, it I understand, have tried.

Polina [PersonRank 0]

18 years ago #

WOW! very informative ...and i like those pics of ur nephew , so cute!! can see that u put a lot of effort in it so
KEEP IT UP!

Breza [PersonRank 0]

18 years ago #

If your site did not exist it would be necessary to invent it.

Dobrinya [PersonRank 0]

18 years ago #

hi
Why I can not insert the image into my message?

Forum home

Advertisement

 
Blog  |  Forum     more >> Archive | Feed | Google's blogs | About
Advertisement

 

This site unofficially covers Google™ and more with some rights reserved. Join our forum!