Önyüklemeden veya Web Sitesi Tasarım Şablonundan Site Şablonu Oluşturma

Oracle Content Management açık mimarisi Temel veya Önyükleme gibi diğer kodlama sistemlerinde tamamlanan işi kullanabileceğiniz anlamına gelir. Birkaç değişiklik ile, bir Önyükleme şablonunu bir temaya dönüştürebilir ve onu Oracle Content Management şablonunun parçası haline getirebilirsiniz.

Temel Süreç

Sıradaki bölümlerde detaylı olarak açıklanan adımların genel görünümü:

Ön Koşullar

Klasörlerin ve dosyaların yerel bilgisayarınızın kurulumu ve çalışması ile eşzamanlı kılınması için Oracle Content Management masaüstü uygulamasına sahip olun.
Önyükleme şablonu tema klasörlerini, dosyalarını ve içeriğini yerel bilgisayarınıza indirin ve kullanım için hazır olarak bulundurun.

Site Oluşturma

Oracle Content Management başlangıç şablonundan bir site oluşturma:

Yan gezinme menüsünde Siteler'e tıklayın.

Mevcut sitelerin listesi görüntülenir.
Oluştur'a tıklayın.
Site Oluşturma iletişim kutusunda sitenizin temeli olarak kullanmak için JET Başlangıç Şablonu'nu veya Başlangıç Şablonu'nu seçin.
İletişim kutusunda site için bir ad girin. Bu site URL'sinde kullanılan addır. Harf, sayı, alt çizgi (_) ve tire (-) kullanabilirsiniz. Boşluk girerseniz bu otomatik olarak tireyle değiştirilir.

Şu adları şablonlar, temalar, bileşenler, siteler veya site sayfaları için kullanmayın: authsite, content, pages, scstemplate_*, _comps, _components, _compsdelivery, _idcservice, _sitescloud, _sitesclouddelivery, _themes, _themesdelivery. Şu adları site sayfaları için kullanabilirsiniz ancak şablonlar, temalar, bileşenler veya siteler için kullanmayın: documents, sites.
Not:

Oracle Content Management sitesi URL'sinin dizin yolu büyük/küçük harfe duyarlıdır. Sorgu veya parça dizelerindeki harf büyüklüğü, geliştiriciler tarafından özel kodlarla yönetilir.
```
      https:[//host[:port]][/]path[?query][#fragment] 
     \____________________/\________________________/
        Location                     Data
```
İsteğe bağlı olarak site için bir açıklama girin.
Hazır olduğunuzda Oluştur'a tıklayın.

Bir ilerleme çubuğunda yeni sitenin adı ve oluşturma statüsü gösterilir. Site oluşturulduğunda adı site listesinde görünür. İlk statüsü çevrimdışıdır.

Yeni oluşturulan sitelerinizi listede hızlı bir şekilde bulmak için listeyi Son Güncellenen ölçütüne göre sıralayın. Oluşturduğunuz site listenin üstünde görüntülenir.

Tema Klasörünü Senkronize Etme

Siteyi bir başlangıç şablonundan oluşturduğunuzda başlangıç şablonu temasının bir kopyası oluşturulur ve tema adı izleyecek biçimde site adı ile adlandırılır. Örnek olarak, My_New_Site için tema My_New_SiteTheme şeklindedir.

Siteye yönelik tema klasörünü ve dosyalarını yerel bilgisayarınız ile senkronize etmek için masaüstü uygulamasını kullanın. Bkz. Oracle İçerik Yönetimi ile Dokümanlarda İşbirliği Yapma bölümünde Senkronizasyonu Kullanmaya Başlama.

Yerel masaüstünüzde şu anda şablon tema klasör hiyerarşisini ve dosyalarını görmeniz gerekir. Örnek:

    theme_name
        assets
            css
                main.css
            js
                topnav.js
        designs
            default
                design.css
                design.json
                facebook.png
                googleplus.png
                linkedin.png
                twitter.png
                youtube.pgn
        layouts
            index.html
        responsepages
            404.html
        _folder.json
        _folder_icon.png
        components.json
        viewport.json

Temel Temayı Kurma

Bu Önyükleme dosyalarını mevcut dosyalar ile yer paylaşmak üzere yerel masaüstünüzdeki senkronize edilen tema klasörlerine kopyalayın.
- html dosyaları theme_name/layouts klasörüne gider
- css dosyaları theme_name/assets/css klasörüne gider
- js dosyaları theme_name/assets/js klasörüne gider
- Arka plan, alt bilgi, kişiler ve vb. için resimler ile alt klasörlere gruplanabilecek biçimde image dosyaları theme_name/assets/images klasörüne yerleştirilir.
İlgili dizin yollarını güncellemek ve gerekli öğeleri eklemek için yerleşim klasöründeki html dosyalarını değiştirin. Tipik bir Önyükleme teması için /assets klasörüne bir çok ilgili dizin yolu olur, bu nedenle onları değiştirerek tema klasörünü işaret etmelerini sağlamalısınız.

Kullanılacak css, js ve images klasörleri için dizin yollarını düzeltin:
```
_scs_theme_root_/assets/css/
_scs_theme_root_/assets/js/
_scs_theme_root_/assets/images/
```
Not:
Bu adım tamamlandıktan sonra _scs_theme_root kısmı, temanın kullanıldığı ortama göre otomatik olarak ayarlanır.
Her Oracle Content Management yerleşimi için gereksinimler mevcuttur:
1. Şu etiketleri html dosyasının <head> etiketine ekleyin:
  - 
  - 
  - 
2. Yerleşim dosyalarının sonuna, hemen <body> etiketinin içine görüntüleyici komut listesini ekleyin. Bu dizin yollarının her ikisi de otomatik olarak Site Oluşturucu ve çalıştırma zamanı ortamlarında ayarlanır.
```
<script data-main="/_sitescloud/renderer/renderer.js" src="/_sitescloud/renderer/require.js"></script>
```
3. renderer.js dosyasını dahil ettikten sonra şu etiketleri ekleyin:
  - 
  -

Değiştirilen şema dosyalarının Oracle Content Management uygulamasındaki site ile eşzamanlı kılındıklarını doğrulayın.

Site Sayfalarını Güncelleme

Siteyi, Site Oluşturucuda açtığınızda ilk olarak site öndeğerindeki sayfaları görürsünüz. İstemediğiniz sayfaları silebilir ve saklamak istediğiniz sayfalardaki yerleşimi yeni yerleşimlerden biri olarak değiştirebilirsiniz.

Yan gezinme menüsünde Siteler'e tıklayın.

Mevcut sitelerin listesi görüntülenir.
Siteyi seçip sağ tıklama menüsünde Aç'ı seçin veya eylemler çubuğunda simgesine tıklayın.
Güncelleme için bir ad ve isteğe bağlı bir tanım girin, ardından Oluştur'a tıklayın.

Güncelleme adı için harf, sayı, alt çizgi (_) ve tire (-) kullanabilirsiniz. Boşluk girerseniz bu otomatik olarak tireyle değiştirilir.

Sitede zaten güncellemeleriniz varsa listeden bir güncelleme seçin ve simgesine tıklayın.
Site Oluşturucu önizleme modunda açılıyor. Değişiklik yapmak veya kenar çubuğunda gezinme seçeneklerini kullanmak için Düzenle anahtarının Düzenle konumunda ayarlandığından emin olun.
Belirli bir sayfayı düzenlemek için kenar çubuğundaki site ağacını kullanan sayfayı veya sitenin kendi gezinmesini seçin.
İstemediğiniz bir sayfayı kaldırmak için sayfayı seçin ve bağlantısına tıklayın.
Yeni bir sayfa eklemek için Sayfa Ekle'ye tıklayın. Sayfayı sürükleyip bırakarak site ağacında yeniden konumlandırabilirsiniz.
Sayfa ile ilişkili yerleşimi değiştirmek için site ağacında sayfayı seçin ve sayfa ayarlarını görüntülemek üzere bağlantısına tıklayın.

Sayfa Yerleşimi alanına gidin ve menüden farklı bir yerleşim seçin. Sayfa düzenlerinin sayısı ve tipi sitenizle ilişkilendirilen temaya bağlıdır.
Değişikliklerinizi geçerli güncellemeye kaydetmek için Kaydet. Geçerli güncellemede çalışmaya devam edebilir veya gerekliyse yeni güncellemeler oluşturabilirsiniz.

Gezinmeyi Güncelleme

Site önizlemesinde menü seçimine baktığınızda Önyükleme temasındaki yerleşimde bulunan sabit kodlu menü seçimi nedeniyle bunun geçerli hiyerarşiyle eşleşmediğini görürsünüz.

Önyükleme temasındaki sabit kodu, site hiyerarşisinden dinamik olarak oluşturulan kod ile değiştirmek için menü seçimini güncelleyin.

Tema dosyalarının sizdeki yerel senkronize edilmiş kopyalarını düzenleyin.

Sabit kodlu menü seçimi kodunu yerleşimlerden kaldırın. Tipik bir Önyükleme temasından kaldırılması gereken sabit kodlu menü seçimi için aşağıda bir örnek verilmiştir. Bu logosuyla, "Hamburger" menüsü için sayfa çok dar olduğunda (uyumlu kısım) görüntülenen "Menü Seçimi Açma/Kapama" bölümleriyle ve diğer sayfalar için sabit kodlu sayfa menü seçimi ile tipik bir başlık bölümüdür.

<header id="header" class="header navbar-fixed-top">  
        <div class="container">       
            <h1 class="logo">
                <a href="index.html"><span class="text">Velocity</span></a>
            </h1><!--//logo-->
            <nav class="main-nav navbar-right" role="navigation">
                <div class="navbar-header">
                    <button class="navbar-toggle" type="button" data-toggle="collapse" data-target="#navbar-collapse">
                        <span class="sr-only">Toggle navigation</span>
                        <span class="icon-bar"></span>
                        <span class="icon-bar"></span>
                        <span class="icon-bar"></span>
                    </button><!--//nav-toggle-->
                </div><!--//navbar-header-->
                <div id="navbar-collapse" class="navbar-collapse collapse">
                    <ul class="nav navbar-nav">
                        <li class="active nav-item"><a href="index.html">Home</a></li>
                        <li class="nav-item"><a href="features.html">Features</a></li>
                        <li class="nav-item"><a href="pricing.html">Pricing</a></li>
                        <li class="nav-item dropdown">
                            <a class="dropdown-toggle" data-toggle="dropdown" data-hover="dropdown" data-delay="0" data-close-others="false" href="#">Pages <i class="fa fa-angle-down"></i></a>
                            <ul class="dropdown-menu">
                                <li><a href="download.html">Download Apps</a></li>
                                <li><a href="blog.html">Blog</a></li>
                                <li><a href="blog-single.html">Blog Single</a></li>
                                <li><a href="blog-category.html">Blog Category</a></li>
                                <li><a href="blog-archive.html">Blog Archive</a></li>
                                <li><a href="about.html">About Us</a></li>
                                <li><a href="contact.html">Contact</a></li>                    
                            </ul>                            
                        </li><!--//dropdown-->                         
                        <li class="nav-item"><a href="login.html">Log in</a></li>
                        <li class="nav-item nav-item-cta last"><a class="btn btn-cta btn-cta-secondary" href="signup.html">Sign Up Free</a></li>
                    </ul><!--//nav-->
                </div><!--//navabr-collapse-->
            </nav><!--//main-nav-->                     
        </div><!--//container-->
    </header><!--//header-->

Site yapısı bilgilerini dikkatle incelemek ve gezinme kodunu oluşturmak için JavaScript kodu yazın, ardından JavaScript kodunu yerleşimlere ekleyin, örneğin:
```
<script type="text/javascript" src="_scs_theme_root_/assets/js/navbar.js"></script>
```
Belirli Basamaklı Stil Sayfanızda beklenen biçimlendirme ile eşleştirmek için topnav.js dosyasının tam çıktısını değiştirin.

Site Yerleşimlerini Güncelleme

Bu noktada, site fonksiyonel ancak yerleşimlerde düzenlenebilir alanlar (yuvalar) yok.

Bir İçerik Bölümü öğesi bulun veya ekleyin ve bir yuva olarak belirleyin.

Yuvalar, yerleşimdeki sınıf özelliğinde "scs-slot" değerine sahip DIV öğeleridir. Her yuvanın benzersiz bir id özelliği olmalıdır. Örneğin:
```
<div id="slot-content1" class="scs-slot scs-responsive"></div>
```
Yuvanın gözatıcı görüntü kapısı boyutuna otomatik olarak ayarlanması için "scs-responsive" sınıf özelliğini dahil edin.
Yerleşimde veya diğer yerleşimlerde gerektiği gibi ek yuvalar oluşturmak üzere bu adımı tekrarlayın.

Siteyi Yayımlama

Tüm site değişikliklerinizi tamamladıktan ve kaydettikten sonra siteyi Yayımlamalısınız.

Sitenin yayımlanması geçerli güncellemedeki tüm değişiklikleri alır ve temele birleştirir, böylece güncellemede olan yeni temel siteye geçer.

Yeni Şablonu Oluşturma

Artık ilişkili bir teması olan işlevsel bir siteniz var, bu nedenle bu siteyi diğerleri ile paylaşmak üzere bir şablona alabilir ve siteler oluşturabilmelerini sağlamış olursunuz.

Oracle Content Management yan gezinme menüsünde Geliştirici'ye tıklayın.
Tüm şablonları görüntüle'ye tıklayın.
Oluştur'a tıklayın ve Mevcut siteden'i seçin.
Bir başlangıç şablonu veya Önyükleme şablonu kullanarak oluşturduğunuz yeni siteyi seçin.
Yeni şablon için bir ad girin ve Oluştur'a tıklayın.
Şablonu diğer Oracle Content Management anları ile kullanmak üzere paketlemek için şablonu seçin ve indirilebilen bir .zip dosyası oluşturmak için Export menü seçeneğini belirleyin.