İçeriğe Eklenen Görselleri Views Slideshow ile Gösterme | Drupal Dersleri

Gönderi Bilgileri
Mediasaur
15.09.2013 - 00:47

Bu Drupal dersinde amaçlanan, herhangi bir düğüme(içeriğe) image alanı kullanılarak eklenmiş görsellerin Views(Views Slideshow) kullanılarak yine aynı düğümde slideshow biçiminde gösterilmesi. Ancak Views kullanılacağından, yalnızca slideshow değil, başka gösterim biçimleri de kullanılabilir, ayarları da istek ve gereksinimlere göre değiştirilebilir.

Bu Drupal derslerinde anlatılanları test edebilmek için lütfen en az 2 düğüm oluşturun ve her düğüme yeterli sayıda görsel ekleyin. Ekli görsellerin sayfada Views slideshow dışında görünmesini istemiyorsanız, ilgili içerik türünün Manage Display ayar bölümünden image alanını gizleyin.

Açıklama: Bu örnekte ilgili içerik türüne "İçerik Görsel" adlı bir image alanı eklediğiniz, bu alanı Manage Display bölümünden gizlediğiniz ve görselleri bu alanı kullanarak yüklediğiniz varsayılmıştır. Dilerseniz özel bir içerik türü de oluşturabilirsiniz. Özel bir görsel alanı eklemeden, Article içerik türü için zaten ekli olan Content: Image alanı kullanılarak da bir view oluşturulabilir ya da bu alan diğer içerik türlerine de eklenebilir. Hangi alanı kullandıysanız, ilgili adımda(7/d) o alanı view'a ekleyin.

Tüm hazırlıklar tamamsa, view'u oluşturmaya başlayalım:

  1. Admin > Structure > Views bölümünden "Add new view" bağlantısına tıklayarak bir view(görünüm) oluşturmaya başlayın.
    1. "View name" kutucuğuna "İçerik Görselleri Slideshow" (ya da uygun gördüğünüz başka bir ad) yazın. ("Machine-readable name" alanında Türkçe karakterler alt çizgi biçiminde çıkacaktır; bunları "Edit" bağlantısına tıklayarak uygun İngilizce karakterlerle değiştirin. Örneğin "i_erik_g_rselleri_slideshow"u "icerik_gorselleri_slideshow" yapın.)
    2. [Tercihe bağlı adım.] "Description" bölümünü işaretleyip view için bir açıklama girebilirsiniz. İşaretleyip açılan kutucuğa "İçeriğe eklenen görselleri gösteren Views slideshow." yazın.
  2. "Show" açılan menüsünden(drop-down) "Content" seçeneğini seçin(Zaten ön tanımlı olarak seçilidir.).
  3. Create a page seçeneğinden işareti kaldırın.
  4. "Create a block" seçeneğini işaretleyin. Blok adı otomatik olarak gelecektir; isterseniz değiştirebilirsiniz. "Items per page" alanına, göstermek istediğiniz görsel sayısını girin(Sonradan değiştirebilirsiniz. Bu örnekte bu alanı daha sonra ayarlayacağız.).
  5. "Continue & edit"e tıklayın. Bu aşamada emek kaybı olmaması için, view'u kaydetmek üzere "Save" düğmesine tıklayın.
  6. Eğer yalnızca görseli göstermek istiyorsanız, Fields bölümünde ön tanımlı olarak bulunan Content: Title alanını kaldırın. Dilerseniz bu alanı tutabilir hatta başka alanlar da ekleyerek slideshow'u zenginleştirebilirsiniz; ancak bu dersi karmaşıklaştırmamak için yalnızca image alanını kullanacağız.
    1. Fields bölümünde önce "Content: Title" bağlantısına tıklayın.
    2. Açılan pencerede, en tepedeki "For" bölümünden "this block(override)" seçeneğini seçin.
    3. "Remove" düğmesine tıklayın. Böylece bu alanı kaldırmış olduk.
    4. Fields bölümünde "Add" düğmesine tıklayın. Açılan pencereden bu view'da kullanmak istediğiniz image alanını işaretleyin. Örneğin "Content: İçerik Gorsel".
    5. "Apply" düğmesine tıklayın.
    6. Açılan pencerede, "Create a label" seçeneğinden işareti kaldırın.
    7. "Multiple field settings" bölümünde "Display all values in the same row" seçeneğinden işareti kaldırın.
    8. "Apply" düğmesine tıklayın. ("Formatter" bölümünden "Image" dışında "Colorbox" vb.ni, "Image style" bölümünden istediğiniz görsel stilini seçebilir, "Link image to" bölümünden bağlantı ekleyebilirsiniz.)
    9. Bu aşamada, emek kaybı olmaması için, view'u kaydetmek üzere bir kez daha "Save" düğmesine tıklamanızı öneririm.
  7. Gösterim biçimini Slideshow olarak ayarlayalım:
    1. "Format" bölümünden "Format: Unformatted list" bağlantısına tıklayın.
    2. Açılan pencerede "Slideshow" seçeneğini işaretleyin.
    3. "Apply" düğmesine tıklayın.
    4. Açılan pencerede birçok ayar ve seçenek var ancak biz belirtilen konuda talep edilen "İleri - Geri(Önceki - Sonraki)" bağlantılarını slideshow'un altına eklemekle yetinelim: "Bottom Widgets" bölümünden "Controls" seçeneğini işaretleyin.
    5. "Apply" düğmesine tıklayın.
  8. Gösterilecek görsel sayısı ön tanımlı olarak 5'tir; biz yine konuya uygun olarak, bunu sınırsız yapalım(Bunu block görünümü oluşturmaya başlarken 0 girerek de yapabilirdik.).
    1. "Pager" bölümünden, "Use pager: Display a specified number of items" bağlantısına tıklayın.
    2. Açılan pencerede "Display all items" seçeneğini işaretleyin.
    3. "Apply" düğmesine tıklayın.
    4. Offset ayarını değiştirmeden, yeniden "Apply" düğmesine tıklayın.
    5. Bu aşamada, emek kaybı olmaması için, view'u kaydetmek üzere bir kez daha "Save" düğmesine tıklamanızı öneririm.
  9. Bu aşama view'un en önemli ve anahtar aşaması. Şu an view yukarıda eklediğimiz image alanı ile eklenmiş tüm görselleri listeliyor. Oysa biz yalnızca ilgili içeriğe eklenmiş görselleri göstermek istiyoruz. Bunu şu adımları uygulayarak başarabiliriz:
    1. Sağdaki "Advanced" kısmına tıklayın.
    2. CONTEXTUAL FILTERS bölümündeki "add" bağlantısına tıklayın.
    3. Açılan "Add contextual filters" penceresinden "Content: Nid" seçeneğini işaretleyin.
    4. "Apply" düğmesine tıklayın.
    5. WHEN THE FILTER VALUE IS NOT AVAILABLE bölümünde "Provide default value" seçeneğini işaretleyin.
    6. "Type" açılan menüsünden "Content ID from URL" seçeneğini seçin.
    7. "Apply" düğmesine tıklayın.
    8. "Save" düğmesine tıklayıp view'u son kez kaydedin.

Böylece yalnızca ilgili düğüme eklenmiş görselleri gösteren bir Views Slideshow bloku oluşturmuş olduk. Bu bloku sitenizin istediğiniz bölümünde(region) gösterebilirsiniz.

Temel Bilgiler
İlgili Eklenti(ler): 
Drupal Sürümleri: