Δημιουργία διάταξης περιεχομένου με Oracle Content Management

Δημιουργήστε μια διάταξη περιεχομένου για τη διάταξη πεδίων σε ένα στοιχείο περιεχομένου όταν εμφανίζεται σε μια σελίδα τοποθεσίας. Όταν ένα στοιχείο περιεχομένου προστίθεται σε μια σελίδα, θα χρησιμοποιήσει την επιλεγμένη διάταξη περιεχομένου.

1. Στην αρχική σελίδα του Oracle Oracle Content Management, πατήστε Προγραμματιστής στην πλαϊνή περιοχή πλοήγησης.
   Εμφανίζεται η σελίδα "Προγραμματιστής".
2. Κάντε κλικ στην επιλογή "Προβολή όλων των συστατικών στοιχείων".
3. Από το αναπτυσσόμενο μενού "Δημιουργία" στα δεξιά, επιλέξτε "Δημιουργία διάταξης περιεχομένου".
4. Στο πλαίσιο διαλόγου Δημιουργία διάταξης περιεχομένου, επιλέξτε τους τύπους περιεχομένου που θα χρησιμοποιούν τη διάταξη, επιλέξτε τα πεδία για εμφάνιση και ενεργοποιήστε την επιλογή Προσθέστε υποστήριξη για προσαρμοσμένες ρυθμίσεις όταν χρησιμοποιούνται σε Τοποθεσίες, εάν θέλετε οι δημιουργοί τοποθεσιών να μπορούν να προσθέσουν προσαρμοσμένες ρυθμίσεις και στυλ κατά την προσθήκη ενός στοιχείου περιεχομένου και συστατικών στοιχείων λίστας περιεχομένου σε μια σελίδα.

   

5. Καταχωρίστε ένα όνομα και μια περιγραφή για το συστατικό στοιχείο διάταξης περιεχομένου και κάντε κλικ στη Δημιουργία.

   Η διάταξη περιεχομένου προστίθεται στα συστατικά στοιχεία σας.

   Σημείωση:

   Μόνο οι αλφαριθμητικοί χαρακτήρες, οι παύλες και οι χαρακτήρες υπογράμμισης είναι έγκυροι στους τίτλους διάταξης περιεχομένου.
6. Για να εξαγάγετε τη διάταξη περιεχομένου για επεξεργασία, επιλέξτε την και κατόπιν επιλέξτε Εξαγωγή στο εμφανιζόμενο με δεξί κλικ μενού ή κάντε κλικ στο εικονίδιο στη γραμμή ενεργειών.
   1. Μεταβείτε σε έναν υπάρχοντα φάκελο ή επιλέξτε Δημιουργία, έπειτα Φάκελος για να δημιουργήσετε έναν νέο φάκελο, και καταχωρίστε ένα όνομα και προαιρετικά μια περιγραφή.
   2. Επιλέξτε το πλαίσιο επιλογής δίπλα στον φάκελο και έπειτα κάντε κλικ στο "OK".
   3. Κάντε κλικ στο εικονίδιο ή στο όνομα του φακέλου για να τον ανοίξετε.

   Θα δημιουργηθεί ένα αρχείο πακέτου διάταξης στον επιλεγμένο φάκελο με το όνομα διάταξης περιεχομένου και μια επέκταση .zip. Κάντε λήψη του αρχείου στο περιβάλλον ανάπτυξης για επεξεργασία των αρχείων.

   

   Αυτά τα αρχεία ελέγχουν τη διάταξη των πεδίων στα στοιχεία περιεχομένου που χρησιμοποιούν τη διάταξη περιεχομένου Κάρτα υπαλλήλου. Εάν ενεργοποιήσατε την επιλογή Προσθέστε υποστήριξη για προσαρμοσμένες ρυθμίσεις όταν χρησιμοποιούνται σε Τοποθεσίες, τότε επίσης δημιουργείται ένα πρόσθετο αρχείο με όνομα settings.html το οποίο παρέχει μια προεπιλεγμένη απόδοση ενός μεμονωμένου στοιχείου περιεχομένου, ώστε να μπορεί να εμφανιστεί.

   
   
   Περιγραφή της απεικόνισης ''GUID-1B7C7C81-7057-4E9C-B98C-C982CC483961-default.png''
   
7. Επεξεργαστείτε τα αρχεία design.css, layout.html και render.js για να λάβετε τη διάταξη περιεχομένου που θέλετε.

   Για παράδειγμα, τα ακόλουθα αρχεία καθορίζουν τη διάταξη περιεχομένου Κάρτα υπαλλήλου:

   1. Επεξεργαστείτε το αρχείο design.css:

      .scs-tile-layout {
          font-family: 'Helvetica Neue', 'Segoe UI', sans-serif-regular, Helvetica, Arial;
          font-size: 16px;
          margin: 0px;
          padding: 0px;
          font-style: normal;
          color: #333;
      }
      
      .scs-tile-layout li {
          list-style: none;
          font-size: 14px;
          font-style: normal;
          font-variant-caps: normal;
          font-weight: 200;
          margin: 0px;
      }
      
      .scs-tile-layout-img-container {
          height: 150px;
          width: 100px;
          float: left;
          margin: 0em 0.5em 0em 0em;
          padding: 0px;
          border-radius: 3px;
          overflow: hidden;
          position: relative;
      }
      
      .scs-tile-layout-img {
          position: absolute;
          left: -100%;
          right: -100%;
          top: -100%;
          bottom: -100%;
          margin: auto;
          height: 100%;
          min-width: 100%;
      }
      
      .scs-tile-layout p {
          margin: 0px;
      }
      

   2. Επεξεργαστείτε το αρχείο layout.html:

      {{#data.employee_profile_pictureURL}}
      <div class="scs-tile-layout-img-container">
          <img class="scs-tile-layout-img" src="{{data.employee_profile_pictureURL}}" />
      </div>
      {{/data.employee_profile_pictureURL}}
      <ul class="scs-tile-layout">
          <li>
              <p><b>{{name}}</b></p>
          </li>
          <li>&nbsp;</li>
          <li>
              <p>{{data.employee_job_title}}</p>
              <p>{{data.employee_location}}</p>
              <p><b>Phone: </b>{{data.employee_phone}}</p>
          </li>
          {{#scsData.detailPageLink}}
          <li>
              <a href="{{scsData.detailPageLink}}" title="Go to detail page"><span class="detail-page">Profile</span></a>
          </li>
          {{/scsData.detailPageLink}}
      </ul>

   3. Επεξεργαστείτε το αρχείο render.js:

      /* globals define */
      
      define([
          'jquery',
          'mustache',
          'text!./layout.html',
          'css!./design.css'
      ], function($, Mustache, templateHtml, css) {
          'use strict';
      
          function ContentLayout(params) {
              this.contentItemData = params.contentItemData || {};
              this.scsData = params.scsData;
              this.contentClient = params.contentClient || (params.scsData ? params.scsData.contentClient : null);
              // retrieve the custom settings
              this.customSettiings = this.scsData.customSettingsData
              || {};
          }
      
          ContentLayout.prototype = {
      
              render: function(parentObj) {
                  var template,
                      content = $.extend({}, this.contentItemData),
                      contentClient = this.contentClient,
                      contentType,
                      secureContent = false;
      
                  if (this.scsData) {
                      content = $.extend(content, { 'scsData': this.scsData });
                      contentType = content.scsData.showPublishedContent === true ? 'published' : 'draft';
                      secureContent = content.scsData.secureContent;
                  }
      
                  if (contentClient) {
                      var params = {
                          'itemGUID': typeof content.data.employee_profile_picture === 'string' ?
                              content.data.employee_profile_picture : content.data.employee_profile_picture.id,
                          'contentType': contentType,
                          'secureContent': secureContent
                      };
                      content.data.employee_profile_pictureURL = contentClient.getRenditionURL(params);
                  }
      
                  console.log(content);
      
                  try {
                      // Mustache
                      template = Mustache.render(templateHtml, content);
      
                      if (template) {
                          $(parentObj).append(template);
                      }
                  } catch (e) {
                      console.error(e.stack);
                  }
              }
          };
      
          return ContentLayout;
      });
      

      Για πληροφορίες σχετικά με την επεξεργασία του render.js και άλλων αρχείων, ανατρέξτε στην ενότητα Ανάπτυξη συστατικών στοιχείων.

8. Εισαγάγετε τα τροποποιημένα αρχεία σας για να αντικαταστήσετε την υπάρχουσα διάταξη περιεχομένου.
   1. Στην αρχική σελίδα, κάντε κλικ στο στοιχείο "Έγγραφα".
   2. Αποστείλετε την τροποποιημένη διάταξη περιεχομένου σε έναν φάκελο, σε ένα αρχείο με επέκταση .zip, το οποίο περιλαμβάνει τον ίδιο φάκελο και τα ονόματα αρχείων που εξαγάγατε.
      Αν θέλετε να την εισαγάγετε ως νέα διάταξη περιεχομένου, πρέπει να αλλάξετε το GUID της διάταξης περιεχομένου στο _folder.json.
   3. Στην αρχική σελίδα, κάντε κλικ στο στοιχείο "Προγραμματιστής".
      Εμφανίζεται η σελίδα "Προγραμματιστής".
   4. Κάντε κλικ στην επιλογή "Προβολή όλων των συστατικών στοιχείων".
   5. Από το μενού "Δημιουργία", επιλέξτε "Εισαγωγή συστατικού στοιχείου".
   6. Επιλέξτε το πλαίσιο ελέγχου δίπλα στο απεσταλμένο αρχείο zip που περιέχει το τροποποιημένο συστατικό στοιχείο και πατήστε "OK".

   Η τροποποιημένη διάταξη περιεχομένου σας εισαγάγεται στα Συστατικά στοιχεία.