Here’s a short trick you can start using today for Google Sites. When you need to quickly access a websites Favicon or Logo, you have various options.
You can do a Google image search for the icon or logo. Now you will need to make sure the logo is the correct file type, updated, etc. In addition to all of this you will have to download and re-upload the image to use it.
This is a great method if you want large images or need a very detailed version and aren’t worried about file size. Other times you simply want the logo in your Google Sites or spreadsheet as an icon. A Favicon. Super small in file size and always updated to the latest logo.
Using a hidden API from Google we automate all of this and pull the favicon from any website to use on Sites and in Sheets. I first spotted this when James Irvings shared it on Twitter and wondered if it could be uses for more than AppScript and websites.
The first place I wanted to test this was of course Sites as I’m a huge fan of Google Sites and it has so many features teachers love! Embedding Html is one of these that some teachers can utilize to do things, previously not available on Sites.
Here’s how you can use the API.
Use the following Html Code:
<img src="https://s2.googleusercontent.com/s2/favicons?domain=domain.com&sz=32" alt="Name Icon"/>To explain the above code, the line will insert an image using the Google API link. Where it says domain=domain.com you have to replace the domain.com part with any website you’d like to use.
The &sz=32 code sets the favicon to 32pixels as its size.
Lastly you’ll notice the alt tag, this simply give your image a name in case a search engine look sat it or it can’t load.
Here’s my Twitter post with the attached Gif of this entire process:
Just remember; Copy the code, Embed the Code, Change the code, and you’re done!