iBooks Author unterstützt HTML5-Widgets (mit der Endung ".wdgt").
Um ein HTML-Widget für iBooks Author zu erstellen, legen Sie mit einem Texteditor oder einer App zur Erstellung von Webinhalten folgende Dateien an:
- Haupt-HTML-Datei: Diese Datei bildet den Hauptteil des Widgets. Sie kann einen beliebigen Namen haben, muss aber auf ".html" enden. Sie können CSS und JavaScript in die Haupt-HTML-Datei einbinden oder dem Widget-Bündel .css- und .js-Dateien hinzufügen und die Haupt-HTML-Datei so einstellen, dass sie diese lädt. In diesen Dateien können Sie alle Techniken oder Tricks anwenden, die Sie auch bei der Gestaltung einer Webseite verwenden würden. Normalerweise verwenden Sie HTML, um die Struktur Ihres Widgets festzulegen, CSS, um das Layout zu gestalten, und JavaScript, um die Interaktivität zu unterstützen.
- Default.png: Dies ist das Bild, das auf der Seite angezeigt wird und auf das Benutzer tippen, um Ihr Widget zu öffnen. Der Name muss "Default.png" mit einem großen "D" lauten. Der einfachste Weg, eine Default.png zu erstellen, besteht darin, ein Bildschirmfoto Ihrer Haupt-HTML-Datei aufzunehmen, wenn sie in einer App zum Erstellen von Webinhalten oder in einem Webbrowser ausgeführt wird. Wenn Ihr Widget aktiv ist, ist es so groß wie Default.png, es sei denn, Sie geben in Info.plist eine andere Größe an.
- Info.plist: Diese Datei sendet an iBooks Author und iBooks die Informationen, die zur Ausführung Ihres Widgets benötigt werden. Der Name muss "Info.plist" lauten. Details und ein Beispiel sind unten aufgeführt.
Wenn Sie die drei erforderlichen Dateien erstellt haben (und möglicherweise einige optionale Dateien wie CSS oder JavaScript), fügen Sie diese in einem Widget-Bündel zusammen:
- Erstellen Sie mit dem Finder einen Ordner, und fügen Sie die Dateien hinzu.
- Benennen Sie den Ordner um, und fügen Sie die Endung ".wdgt" an den Ordnernamen an. Dadurch wird das Widget-Bündel erstellt, und das Ordnersymbol ändert sich in ein Widget-Symbol.
Sie können Ihr Widget nun zu iBooks Author hinzufügen.
Hinweise
- Wenn Ihr Buch HTML-Widgets beinhaltet, die Dateien mit Steuerzeichen im Dateinamen enthalten, kann es im iBooks Store nicht veröffentlicht werden. Bevor Sie Ihr Widget-Bündel erstellen, vergewissern Sie sich, dass keine der Dateien im Bündel diese Zeichen im Dateinamen enthält. Verwenden Sie keine eigenen Ordnersymbole.
- Vermeiden Sie Ordner mit diesen Namen innerhalb Ihres Widget-Bündels:
- Ressourcen/
- Support Files/Resources/
- Contents/Resources/
- Wenn Sie Inhalte für iPads oder Mac-Computer mit einem Retina-Display erstellen:
- Wenn Sie Ihre HTML-, CSS- und JavaScript-Dateien codieren, folgen Sie dem Standardprotokoll für die Erstellung von Websites mit Retina (2x)-Grafiken.
- Ihr Widget-Bündel sollte eine Datei namens "Default@2x.png" enthalten, die die doppelte Auflösung der Datei "Default.png" aufweisen sollte. Sie können diese Datei in iBooks Author nicht anzeigen, sie wird jedoch in iBooks auf iPads oder Mac-Computern mit einem Retina-Display angezeigt.
- Wenn Ihr Widget beim Hineinzoomen den ganzen Bildschirm einnehmen soll, stellen Sie die Datei Default.png auf 768 x 1024 Pixel und die Datei Default@2x.png auf 1536 x 2048 Pixel ein. Wenn Ihr Widget nicht den ganzen Bildschirm einnehmen soll, stellen Sie die Abmessungen von Default.png auf die jeweilige Größe ein (z. B. 600 x 900 Pixel). Bei Default@2x.png müssen die Abmessungen das Doppelte betragen.
- Erfahren Sie mehr über die Optimierung von in iBooks Author erstellten Büchern.
Die Info.plist
Eine Info.plist eines grundlegenden Widgets enthält einige notwendige Schlüssel und einige optionale Schlüssel. Diese Schlüssel sind unten nebst ihren Definitionen und einigen Beispielwerten für ein Widget namens "Hello World" aufgeführt.
| Schlüssel | Beispielwert | Definition |
| CFBundleDevelopmentRegion | Englisch | Optional. Ein String, der die Ursprungsregion des Bündels angibt. Diese entspricht normalerweise der Muttersprache der Person, die das Bündel erstellt hat. |
| CFBundleDisplayName | Hello World | Erforderlich. Ein String, der den tatsächlichen Namen des Widgets enthält und in iBooks Author und iBooks angezeigt wird. |
| CFBundleIdentifier | com.apple.widget.HelloWorld | Erforderlich. Ein String, der nur das Widget kennzeichnet, in umgekehrtem Domainformat. |
| CFBundleName | Hello World | Optional. Ein String, der den Namen Ihres Widgets enthält. Er muss dem Namen des Widget-Bündels im Finder ohne die Dateiendung ".wdgt" entsprechen. |
| CFBundleShortVersionString | 1.0 | Optional. Ein String, der die abgekürzte Versionsnummer des Widgets angibt. Er entspricht oft der CFBundleVersion. |
| CFBundleVersion | 1.0 | Optional. Ein String, der die Versionsnummer des Widgets angibt. |
| Höhe | 768 | Optional. Eine Zahl, die die Höhe Ihres Widgets in Pixeln angibt. Ist diese nicht angegeben, wird die Höhe von Default.png verwendet. |
| MainHTML | HelloWorld.html | Erforderlich. Ein String, der den Namen der HTML-Datei angibt, die Ihr Widget umsetzt. |
| Breite | 1024 | Optional. Eine Zahl, die die Breite Ihres Widgets in Pixeln angibt. Ist diese nicht angegeben, wird die Breite von Default.png verwendet. |
| IBNotifiesOnReady | <true/> | Optional. Ist hierfür "true" eingestellt, gibt das Widget iBooks einen Hinweis, wann von der Anzeige von Default.png zur Anzeige des ausgeführten HTML-Widgets gewechselt werden soll. |
Die komplette Info.plist für ein Widget sieht wie folgt aus:
<?xml version="1.0" encoding="UTF-8"?><!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN""http://www.apple.com/DTDs/PropertyList-1.0.dtd"><plist version="1.0"><dict> <key>CFBundleDevelopmentRegion</key> <string>Englisch</string> <key>CFBundleDisplayName</key> <string>Hello World</string> <key>CFBundleIdentifier</key> <string>com.apple.widget.HelloWorld</string> <key>CFBundleName</key> <string>Hello World</string> <key>CFBundleShortVersionString</key> <string>1.0</string> <key>CFBundleVersion</key> <string>1.0</string> <key>Height</key> <integer>768</integer> <key>MainHTML</key> <string>HelloWorld.html</string> <key>Width</key> <integer>1024</integer> <key>IBNotifiesOnReady</key> <true/></dict></plist>
Einschränkungen und Begrenzungen
Einige Funktionen sind nicht kompatibel. Folgende Schlüssel sollten nicht verwendet werden:
| Schlüssel | Beschreibung |
| AllowFileAccessOutsideOfWidget | Widgets in mit iBooks Author erstellten Büchern können nicht auf Dateien im allgemeinen Dateisystem zugreifen. |
| AllowFullAccess | Kurzversion für eine Liste anderer Zugriffsschlüssel, von denen einige nicht kompatibel sind. |
| AllowInternetPlugins | Internet-Plug-ins wie Flash sind in Büchern, die mit iBooks Author erstellt wurden, nicht verfügbar. Filme und Audiodateien können jeweils über die HTML5-Elemente <video> und <audio> eingebunden werden. Hinweis: Filme und Audiodateien innerhalb von HTML-Widgets werden nicht DRM-geschützt. |
| AllowJava | Widgets in Büchern, die mit iBooks Author erstellt wurden, können keine Java-Inhalte einbinden. |
| AllowSystem | Widgets in Büchern, die mit iBooks Author erstellt wurden, können nicht auf Systembefehle zugreifen. |
| Plugin | Widgets in Büchern, die mit iBooks Author erstellt wurden, können kein Cocoa-Plug-in einbinden. |
Folgende Schlüssel werden von iBooks Author ignoriert:
| Schlüssel | Beschreibung |
| CloseBoxInsetX | Widgets in iBooks Author und iBooks weisen keine Kennzeichnung zum Schließen auf. |
| CloseBoxInsetY |
|
| Schriften | iBooks Author kann keine gebündelten Schriften verwenden. |
Film- und Audiovoraussetzungen
Sie können keine Medien mit den Endungen ".m4v" oder ".m4p" verwenden.
Es wird empfohlen, H.264-Video in einem MPEG-4-Container mit der Dateiendung ".mp4" zu verwenden.
Für Audiodateien wird empfohlen, AAC Audio in einem MPEG-4-Container mit der Dateiendung ".m4a" zu verwenden.
Hinweis: Video- und Audio-Medien in HTML-Widget-Bündeln werden nicht DRM-geschützt.
Hinweis: In einigen Fällen werden Film- und Audiodateien in HTML-Widgets in iBooks Author nicht abgespielt, in iBooks jedoch wiedergegeben. Wenn Sie eine Film- oder Audiodatei in Ihrem Widget in iBooks Author nicht abspielen können, versuchen Sie es mit einer Vorschau auf einem iPad oder in OS X Mavericks. Diese sollte Ihnen zeigen, wie die Datei in Ihrem vollständigen Buch abgespielt wird.
Lokalisierung
Lokalisierte Strings und Medien werden in iBooks Author nicht unterstützt. Deshalb sollten für den Benutzer sichtbare Textstrings in der Zielsprache eingebunden werden.
Abgeschnittene Elemente
Wenn ein Element, wie zum Beispiel ein <video>-Element, auf einer Seite abgeschnitten erscheint, nimmt es möglicherweise mehr Platz ein, als erkennbar ist. Überprüfen Sie die CSS im #video-Selektor auf "width:auto", und ändern Sie sie auf die tatsächlichen Abmessungen. Wenn Ihr Widget zum Beispiel ein Video enthält, dessen Abmessungen 960 x 540 Pixel lauten, überprüfen Sie anschließend die CSS für den relevanten Selektor, und stellen Sie die Breite und Höhe ausdrücklich auf die richtigen Werte ein:
#video { width: 960; height: 540;}Entwicklung sowohl für iOS als auch für OS X Mavericks
iOS und OS X verwenden grundlegend verschiedene Eingabearten. Sie müssen bei der Erstellung Ihrer HTML-Widgets für iBooks Author darauf achten, dass sie für die Bedienung sowohl über Berührungen als auch über die Maus gestaltet sind, wenn Sie Steuerungsarten verwenden möchten, die keinen Standardgesten entsprechen.
- Erfahren Sie mehr über die Entwicklung von Berührungsaktionen in iOS.
- Erfahren Sie mehr über die Entwicklung von Mausaktionen in OS X.
Das HTML-Widget öffnen
Je nachdem, wie kompliziert Ihr HTML-Widget ist, müssen Ihre Leser während der HTML-Initialisierung einen Moment warten, wenn sie das Widget in iBooks öffnen. Um Wartezeiten zu vermeiden, ändern Sie Ihr Widget so, dass es iBooks mitteilt, wann die Anzeige der Datei "Default.png" zur Anzeige des ausgeführten HTML-Widgets wechseln soll.
Sie müssen drei Änderungen vornehmen, um diese optionale Funktionalität hinzuzufügen:
- Fügen Sie ein Objekt "IBNotifiesOnReady" hinzu, das in der Datei "info.plist" des Widgets auf "true" eingestellt ist, damit iBooks erkennt, dass dieses Widget angibt, wann das ausgeführte HTML-Widget angezeigt werden soll:
<key>IBNotifiesOnReady</key><true/>
- Stellen Sie Ihr Widget so ein, dass die Apple JavaScript-Bibliothek im HEAD-Teil der HTML-Datei geladen wird:
<script type="text/javascript" src="AppleClasses/AppleWidget.js"> </script>
Hinweis: AppleWidget.js ist beim iPad bereits vorhanden, Sie müssen es also nicht in Ihr Widget-Bündel einfügen. - Stellen Sie Ihr Widget so ein, dass iBooks erkennt, wann die HTML-Datei initialisiert wird und iBooks von der Anzeige der Datei "Default.png" zur Anzeige des ausgeführten HTML-Widgets wechseln kann, indem es Folgendes (in JavaScript im HEAD-Teil der HTML-Datei enthalten) aufruft:
widget.notifyContentIsReady()
Wichtig: Wenn Sie die Wartezeit bei Ihrem HTML-Widget vermeiden möchten, stellen Sie sicher, dass Sie alle drei der obigen Schritte ausführen. Sie müssen alle Schritte ausführen, damit es korrekt funktioniert.
Informationen zu Einträgen in externe Webdienste
HTML-Widgets können nur dann etwas bei externen Webdiensten eintragen, wenn diese Webdienste die passenden CORS (Cross-Origin Resource Sharing)-Headers umgesetzt haben.