Tässä vaiheessa kuvataan ja selitetään, miten komponentissa käytettyä sisältöä hallitaan.
Sisältöön kuuluu komponentteja ja mukautettuja komponentteja, jotka Oracle Content Management -palvelun on tunnettava voidakseen hallita sisällön elinkaarta.
Oracle Content Management -palvelun sisältökansio
Jokaiseen Oracle Content Management -palvelussa luotuun sivustoon liittyy content
-kansio. Se on piilotettu kansio, joka ei tavallisesti ole näkyvissä. Kun sivusto julkaistaan, myös kaikki content
-kansiossa olevat tiedostot julkaistaan tiedostojärjestelmässä.
Kun valitset esimerkiksi kuvan kuvakomponenttia käyttäen, Oracle Content Management tekee kopion valitsemastasi kuvasta ja sijoittaa sen sisältökansioon. URL osoittaa aina tähän kuvan kopioituun versioon, joten alkuperäisen kuvan poistaminen ei estä sivuston toimintaa. Tämä koskee myös muita Oracle Content Management -palveluun sisältyviä komponentteja, joita ovat Galleria, Galleriaruudukko, Asiakirja, Yhteisöpalvelupalkki ja Tiedoston nouto, sekä paikkojen taustakuvia ja componentGroup-kohteita.
Jotta mukautettu komponentti voisi osallistua sisällön elinkaareen, mukautetun komponentin on kerrottava Oracle Content Management -palvelulle kaikesta sisällöstä, jota se haluaa palvelun hallitsevan puolestaan. Koska tähän sisältyy sisällön kopiointi, mukautetun komponentin on myös käytettävä Oracle Content Management -palvelun API-rajapintoja sisällön valitsemiseen, jotta sitä osataan hallita.
URL-osoitteiden hallinta
Sisältöön osoittava URL-osoite vaihtelee usean eri ehdon perusteella.
Komponenttiin osoittava ajonaikainen URL-osoite poikkeaa komponenttiin osoittavasta sivustonluontiohjelman URL-osoitteesta.
Jos kopioit sivun, Oracle Content Management kopioi myös koko sisältökansion viitatun sisällön, joten sinulla ei ole koskaan kahta komponenttia, jotka osoittaisivat samaan sisältökansion sisältöön.
Kun componentGroup pudotetaan sivulle, samalla tehdään uusia kopioita koko siitä sisällöstä, johon komponentti viittaa componentGroup-kohteessa.
Vaikka suhteellinen URL-osoite saattaa kelvata paikalliselle komponentille, etäkomponentit vaativat täydellisen URL-osoitteen kaikkiin sisältöihin, joita haluat Oracle Content Management -palvelun hallitsevan puolestasi, jotta ne voivat muodostaa sisäisen kehyksen sisällön täydellistä URL-osoitetta käyttäen.
Koska et voi luottaa siihen, että URL-osoite pysyisi staattisena, säilytä koodissasi vain viittaukset sisällön tunnukseen ja hae sisällön URL-osoite, kun haluat muodostaa sisällön.
Sisällön hallinta
Sisällön hallintaa varten on käytettävissä nämä SDK:n API-rajapinnat:
SitesSDK.getProperty('componentAssets', callback);
Tällä haetaan nykyisen sisällön taulukko
Kukin sisältömerkintä koostuu seuraavista osista:
id: sisällön yksilöivä tunnus.
title: Oracle Content Management -otsikon metatiedot.
description: Oracle Content Management -kuvauksen metatiedot.
fileName: Valitun tiedoston alkuperäinen nimi. Nämä on kätevä näyttää mukautetun komponentin Asetukset-paneelissa, jotta käyttäjät tietävät, minkä tiedoston he ovat valinneet. Tämä ei ole sisältökansioon kopioidun tiedoston nimi.
source: Sisältöön osoittava URL-osoite, jossa on otettu makrot käyttöön. Tämä arvo muuttuu ajan mittaan, eikä komponenttisi tule viitata siihen, vaan se pitää tallentaa sisällön osana.
url: sisältöön osoittava täydellinen URL-osoite, joka perustuu siihen kontekstiin, jossa getPropert()
on kutsuttu.
SitesSDK.setProperty('componentAssets', [assets]);
Tämän kutsumalla voit tallentaa koko sen sisällön, jota haluat Oracle Content Management -palvelun hallitsevan puolestasi.
Jos et kutsu tätä, mitään sisältöä ei tallenneta.
Sisältö, jota ei ole tässä taulukossa, poistetaan sisällön julkaisun yhteydessä.
assets
-parametri on sisältötaulukko, joka on samanmuotoinen kuin getProperty
-parametrin palauttama taulukko. Se voidaan palauttaa myös filePicker
-parametrilla.
Huomautus::
url
-arvoa ei tallenneta. Kyseinen arvo luodaan dynaamisesti, kun pyydät sisältöä.SitesSDK.filePicker(options, callback);
API, jolla avataan tiedostonvalitsin sisältölistan valintaa varten.
Se kutsuu vastakutsun, kun sisällön valinta onnistuu, ja välittää valitun sisällön taulukon.
Mitään ei tallenneta tässä vaiheessa, ja komponentin on itse huolehdittava siitä, että se kutsuu setProperty('componentAssets', [assets]);
-parametrin, jolla tallennetaan tämän valinnan kohteet sekä muu tallennettava sisältö.
Esimerkki valitusta sisällöstä
Tässä osiossa näytetään, kuinka voit valita sisällön, tallentaa sen tunnuksen ja hakea todelliset arvot uudelleen tallennetusta sisällöstä.
Muokkaa settings.html
-tiedostoa.
Muuta mallipohjaobjektia, jos haluat lisätä Image selection
-kohteen.
<div> <!-- Image selection --> <label id="imageLabel" for="imageAsset" class="settings-heading" data-bind="text: 'Image'"></label> <input id="imageAsset" data-bind="value: imageName" readonly class="settings-text-box"> <button id="imageSelect" type="button" class="selectbutton" data-bind="click: showFilePicker">Select Image</button> </div>
Muuta viewModel-kohdetta, jos haluat lisätä havaittavan parametrin, jolla tallennetaan valitun sisällön tunnus.
self.imageID = ko.observable();
Muuta viewModel-kohdetta, jos haluat hallinta sisällön valintaa avaamalla tiedostonvalitsimen ja näyttämällä valitun sisällön nimen.
// // handle component assets // self.assets = [] // bring up a file picker to select the assets self.showFilePicker = function () { // select an image SitesSDK.filePicker({ 'multiSelect': false, 'supportedFileExtensions': ['jpg', 'png'] }, function (result) { if (result.length === 1) { // update the array of assets self.assets = result; // update the image in customSettingsData self.imageID(result[0].id); } }); }; // update the display name based on the assets self.imageName = ko.computed(function () { var imageName = '', imageID = self.imageID(); for (var i = 0; i < self.assets.length; i++) { if (self.assets[i].id === imageID) { imageName = self.assets[i].fileName; break; } } return imageName }, self);
Päivitä viewModel siten, että se hakee sisällön ennen customSettingsData
-kohteen hakemista. Tämä koodi aiheuttaa myös sen, että self.imageName
käynnistetään, kun havaittava parametri self.ImageID()
muuttuu.
SitesSDK.getProperty('componentAssets', function (assets) { self.assets = assets; SitesSDK.getProperty('customSettingsData', function (data) { //update observable self.imageWidth(data.imageWidth); self.imageID(data.imageID); self.titleText(data.titleText); self.userText(data.userText); // note that viewModel is initialized and can start saving data self.initialized(true); self.saveData = true; }); });
Päivitä lopuksi save
-funktio kohteen imageID
tallentamiseksi. Muista myös päivittää componentAssets
sekä viitatun sisällön lista.
self.save = ko.computed(function () { var saveconfig = { 'imageWidth': isNaN(self.imageWidth()) ? self.imageWidth() : self.imageWidth() + 'px', 'imageID': self.imageID(), 'titleText': self.titleText(), 'userText': self.userText() }; // store the selected asset and update custom settings if (self.saveData) { SitesSDK.setProperty('componentAssets', self.assets); SitesSDK.setProperty('customSettingsData', saveconfig); } }, self);
Tarkista sisällön valinnan tulokset
Päivitä sivustossasi oleva sivu, jotta sivustonluontiohjelma voi poimia komponenttiin tehdyt muutokset.
Aseta sivu muokkaustilaan.
Vedä ja pudota komponentti sivulle.
Avaa Asetukset-paneeli.
Napsauta Valitse kuva -painiketta.
Valitse kuva selaamalla (tai lataamalla).
Huomaa, että tallennettu kuva löytyy nimen perusteella.
Sulje Asetukset-paneeli.
Avaa Asetukset-paneeli uudelleen.
Huomaa, että kuvan nimi näkyy uudelleen.
Esimerkki sisällön muodostuksesta
Tässä osiossa näytetään, kuinka voit hakea sisältöä ja muodostaa sitä komponentissasi. Siinä kerrotaan myös, miten komponentti päivitetään dynaamisesti aina, kun Asetukset-paneelin arvoja muutetaan.
Huomautus::
Vaikka tässä esimerkissä näytetään paikallinen komponentti, joka sijaitsee sivulla sisäisessä kehyksessä, samanlainen koodi toimii myös komponenteissa, jotka on muodostettu sivulle rivinsisäisesti.Muokkaa render.html
-tiedostoa.
Päivitä mallipohja siten, että siihen otetaan mukaan sisältö:
<!-- ko if: imageURL --> <div style="flex-shrink:0;"> <img data-bind="attr: {style: imageStyle, id: 'imageId', src: imageURL, alt: '', title: ''}, click: imageClicked" /> </div> <!-- /ko -->
Luo viewModel-objektissa kaksi havaittavaa parametria, joilla haetaan imageID
customSetttingsData
-kohteesta ja tallennetaan imageURL
, joka on haettu tallennetusta sisältölistasta.
self.imageID = ko.observable(); self.imageURL = ko.observable();
Päivitä viewModel siten, että aina kun imageID
muuttuu, se hakee vastaavan kuvasisällön URL-osoitteen.
self.imageID.subscribe(function (imageID) { // whenever the image changes get the updated referenced asset SitesSDK.getProperty('componentAssets', function (assets) { for (var i = 0; i < assets.length; i++) { if (assets[i].id === imageID) { self.imageURL(assets[i].url); break; } } }); });
Päivitä viewModel siten, että se hakee tunnuksen customSettingsData
-kohteesta.
Tarkista sisällön muodostuksen asetukset.
Päivitä sivustossasi oleva sivu, jotta sivustonluontiohjelma voi poimia komponenttiin tehdyt muutokset.
Aseta sivu muokkaustilaan.
Vedä ja pudota komponentti sivulle.
Avaa Asetukset-paneeli.
Napsauta Valitse kuva -painiketta.
Valitse kuva selaamalla (tai lataamalla).
Huomaa, että tallennettu kuva löytyy nimen perusteella.
Sulje Asetukset-paneeli.
Sinun pitäisi nähdä valitsemasi kuva komponentissa muodostettuna.
Jatka kohtaan Opastuksen tarkastelu.