iBooks Author tukee HTML5-widgettejä (joiden tiedostopääte on .wdgt).
Voit luoda HTML-widgetin iBooks Authoria varten luomalla seuraavat tiedostot tekstieditorilla tai verkkosisällön tuotantoon käytettävällä ohjelmalla:
- HTML-päätiedosto: Tämä tiedosto on widgetin pääosa. Nimi voi olla mikä tahansa, kunhan pääte on ".html". HTML-päätiedostossa voi käyttää CSS:ää ja JavaScriptiä, tai voit lisätä .css- ja .js-tiedostot widgettinippuun ja asettaa HTML-päätiedoston lataamaan ne. Näissä tiedostoissa voi käyttää samoja menetelmiä ja keinoja kuin verkkosivun suunnittelussa. Yleisesti ottaen HTML:llä määritetään widgetin rakenne, CSS:llä luodaan visuaalinen ilme ja JavaScriptillä tuetaan vuorovaikutteisuutta.
- Default.png: Tämä kuva näkyy sivulla, ja käyttäjät avaavat widgettisi napauttamalla sitä. Nimen täytyy olla Default.png isolla D-kirjaimella. Helpoin tapa luoda Default.png-tiedosto on ottaa näytönkaappaus HTML-päätiedostosta, joka on auki verkkosisällön tuotantoon käytettävässä ohjelmassa tai verkkoselaimessa. Kun widgetti on aktiivisena, se on Default.png-tiedoston kokoinen, ellet määritä toista kokoa Info.plist-tiedostossa.
- Info.plist: Tämä tiedosto antaa iBooks Authorille ja iBooksille tarvittavat tiedot widgetin suorittamiseen. Nimen täytyy olla Info.plist. Alla on tietoja ja näyte.
Kun olet luonut kolme pakollista tiedostoa (ja mahdolliset valinnaiset tiedostot, kuten CSS- tai JavaScript-tiedostot), kokoa ne widgettinippuun:
- Luo Finderissa kansio ja lisää tiedostot sinne.
- Nimeä kansio uudelleen ja lisää siihen .wdgt-pääte. Toimenpiteellä luodaan widgettinippu, ja kansiokuvake muuttuu widgettikuvakkeeksi.
Widgettisi voidaan nyt lisätä iBooks Authoriin.
Huomautukset
- Jos kirjasi sisältää HTML-widgettejä, joiden tiedostonimissä on ohjausmerkkejä, sitä ei voi julkaista iBooks Storessa. Varmista ennen widgettinipun luomista, ettei siinä ole tiedostoja, joiden nimissä on ohjausmerkkejä. Älä käytä omia kansiokuvakkeita.
- Älä sisällytä widgettinippuun kansioita, joilla on seuraavat nimet:
- Resources/
- Support Files/Resources/
- Contents/Resources/
- Jos luot sisältöä iPadille tai Macille, jossa on Retina-näyttö:
- Kun koodaat HTML-, CSS- ja JavaScript-tiedostoja, noudata standardinmukaista menettelytapaa koskien verkkosivustojen Retina (2x) -grafiikan luontia.
- Widgettinipussasi pitäisi olla Default@2x.png-tiedosto, jonka tarkkuuden pitäisi olla kaksinkertainen Default.png-tiedostoon nähden. Et voi tarkastella tiedostoa iBooks Authorissa, mutta se näkyy iBooksissa iPadissa tai Macissa, jossa on Retina-näyttö.
- Huomautus: Jos haluat widgetin ulottuvan koko näytölle, kun siihen on lähennetty, aseta Default.png-tiedoston kooksi 768 x 1024 pikseliä ja Default@2x.png-tiedoston kooksi 1536 x 2048 pikseliä. Jos haluat, että widgetti näytetään alle koko näytön kokoisena, luo Default.png-tiedosto sen kokoisena, jona haluat widgetin näkyvän (esimerkiksi 600 x 900). Tee Default@2x.png-tiedostosta kaksi kertaa suurempi.
- Lue lisää iBooks Authorilla tehtyjen kirjojen optimoinnista.
Info.plist-tiedosto
Peruswidgetin Info.plist-tiedostossa on pakollisia ja valinnaisia avaimia. Avaimet ja niiden määritelmät on lueteltu alla. Lisäksi mukana on esimerkkiarvot Hei maailma -nimiselle widgetille.
| Avain | Esimerkkiarvo | Määritelmä |
| CFBundleDevelopmentRegion | Finnish | Valinnainen. Merkkijono, joka määrittää nipun kielen. Yleensä sama kuin nipun luoneen henkilön äidinkieli. |
| CFBundleDisplayName | Hei maailma | Pakollinen. Merkkijonossa on widgetin varsinainen nimi, joka näytetään iBooks Authorissa ja iBooksissa. |
| CFBundleIdentifier | com.apple.widget.HeiMaailma | Pakollinen. Käänteisessä domain-muodossa oleva merkkijono, joka on widgetin yksilöllinen tunniste. |
| CFBundleName | Hei maailma | Valinnainen. Merkkijono, jossa on widgetin nimi. Sen täytyy olla sama kuin widgettinipun nimi Finderissa ilman .wdgt-tiedostopäätettä. |
| CFBundleShortVersionString | 1.0 | Valinnainen. Merkkijono, jossa on widgetin lyhyt versionumero. Se on usein sama kuin CFBundleVersion. |
| CFBundleVersion | 1.0 | Valinnainen. Merkkijono, jossa on widgetin versionumero. |
| Height | 768 | Valinnainen. Luku, joka kertoo widgetin korkeuden pikseleissä. Jos sitä ei ole määritetty, Default.png-tiedoston korkeutta käytetään. |
| MainHTML | HeiMaailma.html | Pakollinen. Merkkijono, jossa on widgetin toteutuksesta vastaavan HTML-tiedoston nimi. |
| Width | 1024 | Valinnainen. Luku, joka kertoo widgetin leveyden pikseleissä. Jos sitä ei ole määritetty, Default.png-tiedoston leveyttä käytetään. |
| IBNotifiesOnReady | <true/> | Valinnainen. Kun arvoksi on asetettu "true", widgetti kertoo iBooksille, milloin sen pitää siirtyä Default.png-tiedoston näyttämisestä käynnissä olevan HTML-widgetin näyttämiseen. |
Widgetin Info.plist-tiedosto näyttää kokonaisuudessaan tältä:
<?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>Finnish</string> <key>CFBundleDisplayName</key> <string>Hei maailma</string> <key>CFBundleIdentifier</key> <string>com.apple.widget.HeiMaailma</string> <key>CFBundleName</key> <string>Hei maailma</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>HeiMaailma.html</string> <key>Width</key> <integer>1024</integer> <key>IBNotifiesOnReady</key> <true/></dict></plist>
Rajoitukset
Joitakin ominaisuuksia ei tueta. Älä käytä seuraavia avaimia:
| Avain | Kuvaus |
| AllowFileAccessOutsideOfWidget | iBooks Authorissa luotujen kirjojen widgetit eivät voi käyttää yleisen tiedostojärjestelmän tiedostoja. |
| AllowFullAccess | Lyhennys muiden pääsyavainten luettelosta, joista kaikki eivät ole yhteensopivia. |
| AllowInternetPlugins | Internet-liitännäisiä, kuten Flashia, ei voi käyttää iBooks Authorissa luoduissa kirjoissa. Videokuvaa ja ääntä voidaan sisällyttää HTML5:n <video>- ja <ääni>-elementtien avulla. Huomautus: HTML-widgeteissä olevaa videokuvaa ja ääntä ei ole DRM-suojattu. |
| AllowJava | iBooks Authorilla luoduissa kirjoissa olevissa widgeteissä ei voi olla Java-sisältöä. |
| AllowSystem | iBooks Authorilla luotujen kirjojen widgetit eivät voi käyttää järjestelmäkomentoja. |
| Plugin | iBooks Authorilla luotujen kirjojen widgeteissä ei voi olla Cocoa-liitännäiskomponenttia. |
iBooks Author jättää huomioimatta seuraavat avaimet:
| Avain | Kuvaus |
| CloseBoxInsetX | iBooks Authorin ja iBooksin widgetit eivät näytä close-decoration-ominaisuutta. |
| CloseBoxInsetY |
|
| Fonts | iBooks Authorin widgetit eivät voi käyttää niputettuja fontteja. |
Videokuvan ja äänen vaatimukset
.m4v- ja .m4p-mediatiedostoja ei voi käyttää.
Suositus on käyttää H.264-videota, joka on MPEG-4-säiliössä (tiedostopäätteenä .mp4).
Äänen osalta suositus on käyttää AAC-ääntä, joka on MPEG-4-säiliössä (tiedostopäätteenä .m4a).
Huomautus: HTML-widgettinipuissa olevaa videokuvaa ja ääntä ei ole DRM-suojattu.
Huomautus: Joskus HTML-widgettien video- ja äänitiedostot eivät toistu iBooks Authorissa, mutta ne toimivat iBooksissa. Jos widgetin video- tai äänitiedoston toistaminen ei onnistu iBooks Authorissa, kokeile esikatselua iPadissa tai OS X Mavericksissa. Siten näet, miten tiedosto toistetaan valmiissa kirjassa.
Lokalisointi
Lokalisoituja merkkijonoja ja sisältöjä ei tueta iBooks Authorissa. Siksi käyttäjälle näkyvät tekstimerkkijonot tulee sitoa tekstiin kohdekielellä.
Leikkautuneet elementit
Jos <video>-elementin kaltaisen elementin toinen puoli näkyy leikkautuneena, syynä voi olla se, että elementti laajenee täyttämään suuremman tilan kuin mitä on näkyvissä. Etsi CSS:n #video-valitsimessa oleva "width:auto"-kohta ja muuta se vastaamaan todellisia mittoja. Esimerkiksi jos widgetissä on video, jonka mitat ovat 960 x 540, etsi CSS:stä oikea valitsin ja aseta leveys ja korkeus oikeisiin arvoihin:
#video { width: 960; height: 540;}Kehittäminen sekä iOS:ään että OS X Mavericksiin
iOS:ssä ja OS X:ssä käytetään perustavanlaatuisesti toisistaan poikkeavia syötetyyppejä. Kun luot HTML-widgettejä iBooks Authoria varten, varmista, että olet ottanut huomioon sekä kosketus- että hiirikäsittelyn, jos haluat käyttää muihin kuin vakioeleisiin perustuvaa ohjausta.
- Lue lisää kosketustapahtumien kehittämisestä iOS:ssä.
- Lue lisää hiiritapahtumien kehittämisestä OS X:ssä.
HTML-widgetin avaaminen
Riippuen siitä, miten monimutkainen HTML-widgettisi on, HTML:n alustuksen aikana voi näkyä välähdys, kun widgetti avataan iBooksissa. Välähdys voidaan välttää muokkaamalla widgettiä siten, että se kertoo iBooksille, milloin lopettaa Default.png-tiedoston näyttäminen ja aloittaa käynnissä olevan HTML-widgetin näyttäminen.
Tämän valinnaisen toiminnallisuuden lisäämiseksi on tehtävä kolme muutosta:
- Lisää widgetin info.plist-tiedostoon IBNotifiesOnReady-kohta, jonka arvona on "true". Näin iBooks tietää widgetin kertovan, milloin iBooksin tulee siirtyä käynnissä olevan HTML-widgetin näyttämiseen:
<key>IBNotifiesOnReady</key><true/>
- Aseta widgetti lataamaan Applen JavaScript-kirjasto HTML-tiedoston HEAD-osiossa:
<script type="text/javascript" src="AppleClasses/AppleWidget.js"> </script>
Huomautus: AppleWidget.js on jo iPadissa, eikä sitä tarvitse sisällyttää widgettinippuun. - Aseta widgetti kertomaan iBooksille, milloin HTML-tiedosto alustetaan. Näin iBooks voi siirtyä Default.png-tiedoston näyttämisestä käynnissä olevan HTML-widgetin näyttämiseen tekemällä seuraavan kutsun (HTML-tiedoston HEAD-osiossa olevassa JavaScriptissä):
widget.notifyContentIsReady()
Tärkeää: Jos muokkaat widgettiä välähdyksen välttämiseksi, suorita kaikki kolme yllä olevaa toimenpidettä. Kaikki toimenpiteet on suoritettava, jotta haluttu vaikutus saadaan aikaan.
Tietoja julkaisemisesta ulkoisiin verkkopalveluihin
HTML-widgeteistä voidaan julkaista vain sellaisiin ulkoisiin verkkopalveluihin, joissa käytetään asianmukaisia CORS (Cross-Origin Resource Sharing) -otsakkeita.