Puteţi să configuraţi un anumit conţinut de tip text sau imagine dintr-o machetă pentru a-l face editabil de către utilizatorii care lucrează cu pagini bazate pe machetă.
Această funcţionalitate poate fi utilizată în orice temă, inclusiv temele bootstrap. Modificările preiau automat stilul paginii originale.
Puteţi să adăugaţi un marcaj simplu la următoarele etichete HTML din machetă: <p>
, <h1>
prin <h6>
, <div>
şi <img>
.
Opţiunile de formatare pentru text şi imagine includ:
Text: permite utilizatorilor să specifice aldin, cursiv, subliniere şi link.
Imagine: permite utilizatorilor să specifice un link la un fişier imagine. Se pot modifica proprietăţile pentru titlu (ceea ce vede utilizatorul atunci când trece cursorul peste imagine) şi se poate adăuga text alternativ pentru accesibilitate.
Pentru modificarea unui element de text sau de imagine pentru a putea fi editat de utilizatori, sunt necesare două lucruri:
Adăugaţi scs-editable
la class
.
Adăugaţi un atribut id
unic.
După ce a fost modificată o machetă, funcţionalitatea va fi disponibilă pentru toate paginile bazate pe acea machetă (chiar şi paginile noi).
Dacă copiaţi şi lipiţi o pagină, modificările vor fi copiate în noua pagină.
Modificarea unei etichete de antet
Sincronizaţi fişierul machetei în desktopul dvs. local sau editaţi fişierul sursă HTML pentru antetul <h1>
.
Adăugaţi scs-editable
la class
şi adăugaţi atributul id="test-heading"
în linia de cod pentru antet, fiind astfel posibilă ataşarea unui editor la acesta. De exemplu:
<h1 class="brand-heading scs-editable" id="test-heading">Sample Heading Value</h1>
Salvaţi fişierul.
Sincronizaţi cu Oracle Content Management şi reîncărcaţi browserul.
Ar trebui să apară o margine neagră în jurul antetului atunci când utilizatorul trece cursorul peste acesta, indicând posibilitatea de editare a conţinutului. Atunci când un utilizator face clic pe antet, marginea devine verde, indicând faptul că utilizatorul poate edita acum conţinutul antetului.
Dacă tema nu a fost publicată, publicaţi-o. Dacă a fost publicată, modificarea va apărea atunci când veţi reîmprospăta browserul.
După publicarea temei, utilizatorii site-ului pot face clic pe antet şi îl pot edita în Generatorul de site-uri.
Este creată o pseudocomponentă pentru elementul scs-editable
, pentru a-l putea modifica în Generatorul de site-uri şi a-l stoca alături de datele paginii. În timpul rulării, înainte ca pagina să fie randată, controlorul înlocuieşte etichetele scs-editable cu valorile pe care le-aţi setat în Generatorul de site-uri.
Modificarea unei etichete de imagine
Procedura de modificare a etichetei de imagine într-o machetă pentru a putea fi editată de utilizatori este similară celei pentru text.
Adăugaţi scs-editable
la class
.
Adăugaţi un id
de imagine unic.
Utilizatorii pot face clic pe imagine, apoi pot modifica proprietăţile pentru a utiliza o imagine diferită.
Iată un exemplu de cod pentru o imagine care poate fi editată de utilizatori:
<img class="scs-editable" id="test-image" src="_scs_theme_root_/assets/img/downloads-bg-small.jpg"/>