How to grab favicons and load them on my site from sites i am linking to? [duplicate]

StackOverflow https://stackoverflow.com/questions/20413922

  •  29-08-2022
  •  | 
  •  

Question

Lets say I have 5 links on my site. (these 5 links are not like normal links on my site.) These 5 links are in list format. 1 on top of the other like so:

Link 1
Link 2
Link 3
Link 4
Link 5

The goal here is when a visitor loads my page all the favicons for all the links on my site will appear to the left of their site. Not ALL the links. Not the nav, and other links, just the links I specify. I'll have each set of these links in a div with a specific class/id. (Not sure if that matters, just noting it.)

by visiting Googles S2 Converter you can obtain the favion of any site. That is done by visiting

http://www.google.com/s2/favicons?domain=www.fbi.gov

Maybe there is a way to write a javascript code or PHP code to take the img received from this request and place it in a certain div or data element?

Thanks!

Était-ce utile?

La solution

1) Add a special class to the links you want to modify. For example:

<a class="link-fav" href="www.mysite.com">Link A</a>

2) With JavaScript, select all elements with that class, extract the target url and insert a new image in the DOM with the favIcon url as source.

With jQuery would be something like (not tested):

$('.link-fav').each(function(link){
  var url = link.attr('href');
  var favIcon = 'http://www.google.com/s2/favicons?domain='+url;
  var img = $('<img/>').attr('src', favIcon);
  img.insertBefore(link);
});

Autres conseils

You just call it as you would any other html < img /> with the google link as src:

<img src="http://www.google.com/s2/favicons?domain=www.fbi.gov" />

See jsfiddle for live example: http://jsfiddle.net/n67N2/2/

Example uses unordered list format ( < ul> ) I assumed that's what you meant by links in list format.

<?php 

$url[] = 'http://www.facebook.com/';
$url[] = 'http://www.myspace.com/';
$url[] = 'http://www.apple.com/';
$url[] = 'http://google.com/';

foreach($url as $value)
    echo '<img src="http://www.google.com/s2/favicons?domain='.$value.'" /> <br>';

?>
Licencié sous: CC-BY-SA avec attribution
Non affilié à StackOverflow
scroll top