Calibre Website Icon

[davidosus]

I use Calibre's built-in server to access ebooks on my iPad and iPhone. It's amazing how quick and easy this is.

To more quickly access my Calibre library I've added a shortcut to my home screen.

The home screen icon, however, is difficult to distinguish. It's background is black instead of white.

This might be because iOS would like an icon to not have transparency. Transparent portions of an icon are rendered black.

How may I change this? Which graphic file inside of Calibre's OS X package may I modify and/or change?

[davidosus]

[theducks]

Originally Posted by davidosus

I use Calibre's built-in server to access ebooks on my iPad and iPhone. It's amazing how quick and easy this is.

To more quickly access my Calibre library I've added a shortcut to my home screen.

The home screen (website) icon, however, is difficult to distinguish. It's background is black instead of white.

How may I change this? Which graphic file inside of Calibre's OS X package may I modify and/or change?

go to the Calibre2/Resources (sub) folder
There are icons (PNG) in the content-server and Images folders to 'borrow'

FWIW all mine (default) have a transparent/white background

If you want to have custom icons on your PC, Create the same folder structure (as needed) in your Calibre configuration folder. if ANY NAMED icon exists there, calibre will use that version without the risk of it being replaced on the next upgrade. Ther is a Custom Icon section in the FAQ

[davidosus]

Thank-you for the reply!

I've tried replacing images in the images and content_server folders. It has no effect.

Some limited success has been achieved by editing the html files in the content_server folder and substituting a link...

http://calibre-ebook.com/favicon.ico

...in the index.html and browse.html files but I haven't quite got it to work. I'm not too familiar with html and creating a website icon.

I must be missing something else.

[davidosus]

Edit browse.html inside the content_server/browse folder...

Change...

<link rel="apple-touch-icon" href="{prefix}/static/calibre.png" />

to...

<link rel="apple-touch-icon" href="{prefix}/static/apple-touch-icon.png" />

...and add a apple-touch-icon.png image in the content_server directory.

Here is the iOS 7 themed icon I used...



iOS rounds the corners off itself.

For the mobile menu, in the content_server directory delete calibre.png. Replace it with...