Son Haberler Bölümü

Merhaba,

Bunu birden farklı yol ile yapabilirsiniz. Sizin yaptıklarınızdan yola çıkacak olursak belki ufak bir fikir verebilirim. Siz üzerinde çalışarak içeriği değiştirebilirsiniz,

• CCK ile yeni bir içerik türü oluşturun. Örneğin, Son Haberler (son_haberler). Bu yeni alanı oluştururken Başlık alanına Son Haberler yazın, Gövde etiketini silin, istiyorsanız yorum alanını devre dışı bırakın ve Anasayfa'ya yükseltilmesin.
• Bu içerik türüne CCK yardımıyla, Haberin Özeti (haberin_ozeti) isminde yeni Text field ekleyin. Max. uzunluk verin (ne de olsa özet).

Bu içerik türüne Haberin İçeriği (haberin_icerigi) isminde yeni bir Text Field daha ekleyin. Bu alan haberin tamamını yazacağınız alan olacağı için Max uzunluk vs vermeyin.

• Bu içerik türüne Image eklentisi yardımıyla Haberin_Resmi (haberin_resmi) isminde yeni bir alan ekleyin ve Özet alanındaki yerin büyüklüğüne göre max boyutu verin (Örneğin 100x100).

Artık elinizde Haber yazabileceğiniz bir içerik türü mevcut. Bu içeriğe her seferinde elle resim küçültmek yerine Imagecache eklentisini kullanarak işinizi kolaylaştırmanızı tavsiye ederim. Böylece her eklenen resim otomatik olarak sizin belirlediğiniz boyuta göre yeniden boyutlandırılacaktır. Belki biliyorsunuzdur ancak ben yine de yazayım,

• Imagecache eklentisini kurun.
• admin/build/imagecache/ adresinden Add New Preset'i tıklayın.
• Preset Namespace alanına görünce ne olduğunu hatırlayacağınız bir isim verin. Örneğin, sonhaber_100x100.
• Action sayfasında, resim eklendiğinde gerçekleşmesi istenen işlemi seçiyoruz. Mesela, Add Scale And Crop, Width ve Height için de 100px ve 100px yazın. Kaydedin.

Bundan sonra yine sizin de yazdığınız gibi Views devreye girecek.

Yeni bir Views oluşturun.
Bu Görünümün Default sekmesinde Filtrelerden,

• Node Tür (Son Haberler),
• Node Yayında (Evet)

seçeneklerini seçin.

Daha sonra Fields sekmesinden, Node'u seçin ve Başlık alanını seçin. Daha sonra İçerik'i seçin ve az önce yarattığınız haberin_ozeti, haberin_icerigi ve haberin_resmi alanlarını seçin. Hepsi için Label değerlerini None (Hiçbiri) olarak seçin. haberin_ozeti ve haberin_icerigi alanları için Format alanı varsayılan olarak Varsayılan olarak kalsın, ancak haberin_resmi için, Format alanından az önce oluşturduğumuz Imagecache preset'ini bulun (sonhaber_100x100 image linked to node). Sayfaya linklenmiş olur ve resmi tıklayan kişi haberin sayfasına gider.

Bu yaptıklarımız işin geneliydi. Şimdi bunları sizin istediğiniz gibi block'lara böleceğiz. Views panelinin sol tarafında bulunan alandan (Page yazar) Blok'u seçin ve Add display'i tıklayın. Bu işlem sonucunda Views panelinde az önce oluşturduğumuz seçenekleri miras olarak alan yeni bir bölüm oluşacak. Burada yapacaklarımızı daha sonra admin/build/block sayfasında block olarak göreceğiz ve sayfanızın istediğiniz Block Region'ında görüntüleyebileceksiniz.

Bu block'a karıştırmamak için bir isim verin. Örneğin, Haber Baslik Block. Daha sonra bu block'da görüntülenmesini istediğiniz alanları seçin. Bu alanlar Defaults alanından miras geldiği için italic görünecektir. Siz burada (Sizin yolladığınız resme bakarak konuşuyorum) Fields alanının yanındaki + işaretini tıklamalı ve haberin_icerigi alanini kaldırmalısınız (Dikkat bu işlemi yeni oluşturduğumuz Block alanı içerisinde yapıyoruz, Defaults alanında değil). Bu işlemi yaptıktan sonra, Defaults alanındaki Fields sekmesinde 4 adet seçili alan varken, yeni oluşturduğumuz Block alanında 3 adet alan olmalı. Yani Başlık, haberin_ozeti ve haberin_resmi alanları olmalı. Basic Settings sekmesinden, Items to display: 3, Number of columns: 3 seçin (Sizin örneğinize göre). Style: Grid olmalı, ancak siz kullandığınız Tema'daki block alanına göre diğerlerinide deneyebilirisiniz.

Aynı şekilde yeni bir Blok alanı oluşturun. İsim olarak Haber Ozet Block verin. Bu sefer Fields alanında Başlık, haberin_ozeti ve haberin_resmi olacak şekilde düzenleyin. Basic Settings sekmesinden, Items to display: 10, Number of columns: 2 seçin (Sizin örneğinize göre). Style: Grid olmalı, ancak siz kullandığınız Tema'daki block alanına göre diğerlerinide deneyebilirisiniz.

Yaptıklarınızı kaydedin ve admin/build/block sayfasında gidin. Burada, yukarıda oluşturduğumuz, Haber Baslik Block ve Haber Ozet Block isimli blockları göreceksiniz. Şimdi bu block'ları sitenizin uygun yerlerinde görüntüleyebilirsiniz.

(Eğer isterseniz Haberin İçeriği sayfasında da Haberin Resmini farlı bir Preset tanımlaması yaparak farklı bir boyutta görüntülenebilirsiniz.)

Uygulamadan yazdım, kısa zamanda ilk aklıma gelen bunlar. Umarım en azından fikir verebilmişimdir. Block alanlarını Css yardımıyla düzenleyerek daha güzel bir görünüme kavuşturabilirsiniz veya uğraşmak istemiyorum derseniz, Panels eklentisi ile bu blockları Panel içerisinde görüntülenmesini sağlayabilirsiniz. Css yerine Panels eklentisinin Rounded Corner ve Shadow özelliklerinden faydalanabilirsiniz. Olmadı, yine Panels eklentisinin güzel bir nimeti olan Custom Style ile Css ekleyebilirsiniz. Haberin sayfası için de Display Suite eklentisini kullanarak Haberin cinsine göre (farklı içerik türleri tanımlayarak Spor, Ekonomi Siyaset), farklı görünümler elde edebilirsiniz.

Umarım işinize yarar. İyi çalışmalar.
Serdar Tokcan
www.serdartokcan.com

Rica ederim dert değil,

Kolon görünümü için, Views panelinde Style sekmesinden Grid seçerek, bir sonraki ekranda da Number of columns seçeneğinden kolon sayısı belirleyerek yapabilirsiniz (Belki denemişsinizdir ama yine de hatırlatayım istedim).

Update Defaults ile Override arasındaki fark, Defaults sekmesinde ayarlamış olduğunuz seçeneklerden bağımsız olarak farklı bir page veya block eklemek istediğinizde, eklenen bu page veya block varsayılan olarak değerleri miras olarak Defaults sekmesinden alır ve bu değerler italic olarak gösterilir. Eğer siz yeni eklediğiniz Page veya Block'da, Defaults sekmesindeki genel ayarlardan farklı bir görünüm elde etmek istiyorsanız, ekleme veya değiştirme esnasında Override seçeneğini seçmelisiniz. Böylece yukarıdan (Yani Defaults sekmesinden) gelen değerlerin yeni eklenen Page veya Block'daki yeni değerleri etkilemesini engellemiş olursunuz. (Kısacası Defaults sekmesinden gelen değerlerin üzerine yaz demiş oluyoruz). Böylece yukarıdan gelen değeri değiştirme veya kaldırma şansınız olur.

Update Defaults Settings tıklandığında da, Override edilmiş değerlerin üzerine Defaults'daki değerlerleri yaz demiş oluyoruz (Yani Defaults sekmesinde belirlemiş olduğumuz değerleri yaz diyoruz).

Eğer siz Defaults görünümün altında yeni Page veya Block eklerseniz ve farklı değerleri belirlerken Override'ı tıklamazsanız bu durumda Page veya Block'da yaptığınız bu değişiklik Defaults sekmesindeki değeri de değiştirecektir. Böylece farkında olmadan, değerleri Defaults sekmesinden alan olası tüm Page veya Block'lar da bu değişikliğe uğrayacak ve sadece bir Page veya Block'u değiştirmek isterken ortak değerleri Defaults sekmesinden alan tüm Page veya Block'lar bu değişiklikten etkilenecektir.

Eğer için işinden çıkamazsanız Panels eklentisini kurun isterseniz. Böylece 2-3 kolonlu görünümleri rahatlıkla elde edebilirsiniz.

Serdar Tokcan
www.serdartokcan.com

Rica ederim :) İşinize yaramasına sevindim.

Serdar Tokcan
www.serdartokcan.com

Selam,

Tam olarak ne yapmak istediğinizi sayfa üzerinde görmediğim için anlayamadım. Ancak hizalama olayını rahatlıkla temanızın kullandığı css dosyasında yapabilirsiniz. Bunun için page.tpl.php veya yeni bir css dosyasına ihtiyacınız yok. Temanızın css dosyasında (Genellikle style.css dosyası olur. Bunu tema dosyalarınıza bakarak anlayabilirsiniz) tanımlayacağınız bir id veya class tanımlaması ile yapabilirsiniz.

Css dosyalarında hiyerarşik bir düzen vardır. Tanımlayacağınız alan bir views çıktısı ise, o views çıktısını FireBug ile bulduktan sonra, bulmuş olduğunuz bu views alanının (id veya class artık neyse) hiyerarşik olarak üzerindeki id ve class'larının altında bir css tanımlaması yapmalısınız. Örneğin, FireBug ile baktığınızda Views çıktısının class ismi field_resim olsun. Bu satırı bulduğunuz yerin üzerindeki id ve class'ları bulmalısınız. Mesela bu alanın üzerinde bir çok id ve class tanımlaması göreceksiniz ama üzerinde çalıştığınız alan ile alakalı css satırını bulursanız işiniz kolaylaşır. Tamamen atıyorum, bulduğunuz tanımlamanın üzerinde view-content isminde bir class ve onun da üzerinde content-area üzerinde bir id olduğunu varsayalım. Hizalama yapacağınız alanın durumunu bilmediğim için sol'dan bir padding tanımlaması yaparak örnekleyelim. Bu durumda css dosyasında sizin yapacağınız tanımlama,

#content-area .view-content .field_resim {
padding-left: 20px;
}

şeklinde olmalıdır.

Bu örnekten yola çıkarak değiştirmek istediğiniz alanı hiyerarşik olarak tanımlayarak istediğiniz görünümü elde edebilirsiniz.

Serdar Tokcan
www.serdartokcan.com

Gayet açık ve güzel bir anlatım olmuş. Elinize sağlık.

Konu hakkındaki video sayesinde güzel bir görsel anlatım olacaktır eminim.