Blogger'da Yazı İçerisinde Görsel Galerisi Oluşturma

Blogger'da yazı içerisinde göürünümü hoş ve düzenli görsel galerisinin nasıl yapıldığını hakkında bir yazı.

Blogger'da Yazı İçerisinde Görsel Galerisi Oluşturma

Blogger'ın temel problemlerinden birisi de görselleri galeri şeklinde yazı içerisinde gösterememektir. Bu durumda görseller alt alta sıralanarak çok yer kaplar ve göze hoş gelen bir görüntü olmaz. Ben de istediğiniz kadar görseli yan yana sıralı olarak galeri şeklinde gösterebileceğiniz bir eklenti buldum ve sizlerle paylaşıyorum. Hemen aşağıdan nasıl gözüktüğünü görebilirsiniz.

Nasıl Yapılır?


  • Blogger'ın sol kısmında yer alan Tema ve ardından HTML'yi Düzenle seçeneklerine tıklayın. 
  • Kodların bulunduğu alana bir kez tıklayıp Ctrl+F tuşlarına basın.
  • Çıkan arama kutusuna ]]></b:skin> yazıp Enter tuşuna basın.
  • ]]></b:skin> yazısının bir üst satırına aşağıdaki kodları kopyalayıp yapıştırın.
#tr-photogallery{line-height:0;-webkit-column-count:3;-webkit-column-gap:0;-moz-column-count:3;-moz-column-gap:0;column-count:3;column-gap:0}
#tr-photogallery img{width:100%!important;height:auto!important;padding:2px}
  • Her şey bitti sayılır. Blogger'ın yazı düzenleme yerinde bulunan HTML seçeneğine tıklayarak aşağıdaki kodları yapıştırın.
<section id="tr-photogallery">
Görsellerinizi bu kısma yükleyin
</section>
Böylelikle görsellerinizin göze daha hoş gelen ve daha az yer kaplayan bir şekilde gözükmesini sağlayabilirsiniz. Gezi fotoğrafları, oyun ve uygulamaların ekran görüntüleri, kişisel fotoğraflar gibi birçok görsel için kullanılabilir bir eklenti.

Yorumlar

Blogger: 35
  1. Peki eklenecek görsellerin url'lerini mi ekleyeceğiz yoksa normal görsel ekleme seçeneği ile mi ekleyeceğiz?

    YanıtlaSil
  2. Güzel eklentiye benziyor..Bu kodları sayfamda bende paylaşmak isterim. Bu hafta blog ajandasına bu yazınızı ekliyorum..Kolay gelsin.

    YanıtlaSil
    Yanıtlar
    1. Evet kesinlikle çok güzel eklenti ve böylesine güzel bir eklentiyi siz de paylaşarak eklentinin daha çok kişiye ulaşmasını sağlayabilirsiniz. Ajandaya eklediğiniz için teşekkürler.

      Sil
  3. Benim şablonda çalışmadı. Uzay kartlarım için galeri oluşturacaktım.:(

    YanıtlaSil
    Yanıtlar
    1. Çalışmaması ile ilgili hiçbir fikrim yok abi.

      Sil
    2. Kodun çalışması için öncelikle post içerisine bir mesaj yazmanız gerekmekte. Ör: dir="ltr" style="text-align: left;" trbidi="on">Benim galerim


      Mesaj olmayan (sadece resim olan) postlarda kod çalışmıyor. Kodun biraz daha gelişmiş hali şöyle:
      #tr-photogallery{line-height:0;-webkit-column-count:3;-webkit-column-gap:0;-moz-column-count:3;-moz-column-gap:0;column-count:3;column-gap:0}
      #tr-photogallery img{width:85%!important;height:auto!important;padding:10px;border:1px;border-style:ridge;border-width:5px;}

      Sil
  4. Mimlendiniz:) Cevabınızı bekliyorum https://gelbilgial.blogspot.com/2018/02/mim-1-benim-sinemam.html

    YanıtlaSil
    Yanıtlar
    1. Teşekkürler, kısa süre içerisinde yanıtlayacağım.

      Sil
  5. Çok faydalı bir bilgi oldu benim için. Hemen deneyeceğim. Teşekkürler :)

    YanıtlaSil
  6. Yıllarca blogger üzerinden blogumu yönettim. Güzel bir bilgi olmuş lakin WordPress'i öneririm. :)

    YanıtlaSil
    Yanıtlar
    1. Wordpress'i biliyorum fakat Blogger ile arasında aman aman bir fark yok. Uzunca bir süre Blogger'a alışmışken sistemi değiştirmeyi çok da düşünmüyorum.

      Sil
    2. Blogger o kadar emek istiyor ki... Word presste her şey hazır. 2008den beri blogger kullanıyorum. Aramızda bir bağ var ama wordpress bir sitede editörlük de yapıyorum şu an ve kıskanıyorum. Ama vefalıyımdır. vazgeçmem ben de bloggerdan

      Sil
  7. Her paylaşımda galeri oluşturmak istiyorsak nasıl yapacağız? Orayı pek anlayamadım

    YanıtlaSil
    Yanıtlar
    1. Galeri oluşturmak istediğiniz yazınıza sadece yukarıda bulunan HTML kodlarını ekleyeceksiniz.

      Sil
  8. 2 GÜNDÜR ARADIM EN İYİ KOD SİZİN Kİ ÇIKTI SAOLUN

    YanıtlaSil
    Yanıtlar
    1. Dilerim sorunsuz bir şekilde kullanırsınız. Ben de çok uzun araştırmalar yapmıştım ve şans eseri yabancı bir blogda görmüştüm. İnsanların arayabileceğini düşünerek paylaşmak istedim ben de.

      Sil
  9. Ben de blog yazmaya yeni başladım. bu yöntemi kullanacağım. Teşekkürler

    YanıtlaSil
    Yanıtlar
    1. Rica ederim. Gayet kolaylıkla kullanılabilir bir eklenti.

      Sil
  10. Resimler pop-up olarak açılmıyor. resme tıklanınca reism urlsine yönleniyor sayfa. popup olarak açmak için ne yapmak gerekir ?

    YanıtlaSil
    Yanıtlar
    1. Blogunuzda pop-up eklentisi mevcut değilse kurmayı deneyebilirsiniz.

      Sil
  11. Kodlar çalışıyor. Uyguladım. süper oldu. bu çalışmayı arıyordum. Bunu her yayında yapmak zorundayız. otomatik olarak tüm yayınlara yapma çalışmasıda inanılmaz güzel olurdu.

    YanıtlaSil
  12. Çalışma çok güzel. Yayın içindeki resim aralarındaki boşluklarda düzeliyor. teşekküerler.

    YanıtlaSil
    Yanıtlar
    1. Rica ederim. Otomatik olarak her yayında olması ile ilgili hiçbir bilgim yok maalesef. Yaptığınız galerinin bulunduğu yeri gönderebilir misiniz? Nasıl olduğunu merak ettim.

      Sil
    2. https://www.cigarfashionlifestyle.com/2016/10/enjoy-cigar_20.html

      Sil
  13. Denedim olmadı. tamda işime yarayacak bir eklenti aslında

    YanıtlaSil
    Yanıtlar
    1. Kontrol edip size geri dönüş sağlayacağım.

      Sil
    2. Kullandığınız temada test ettim, çalışıyor. Görselleri yazının HTML kısmından yükleyeceksiniz. Bunu denediniz mi?

      Sil
    3. bu sefer oldu . Teşekkür ederim

      Sil
    4. Rica ederim. Oluşturduğunuz harika görsellerden oluşan galerilerinizi bekliyor olacağım.

      Sil
  14. Tekrar teşekkür ediyorum. Benzer blogger eklentilerinin dışında güzel bir çalışma. İki bloğumdada uyguladım.

    YanıtlaSil
    Yanıtlar
    1. Rica ederim. Üzerine yaptığınız değişikliklerle çok daha iyi gözükmüş. Daha iyisi ile karşılaşırsam yine paylaşırım.

      Sil

Ad

1. Cilt,1,100,1,1080P,1,11.22.63,1,12 Kızgın Adam,1,2018,1,4. Sezon,1,44. Çocuk,1,A Thousand Kisses Deep,1,Aksiyon Filmleri,3,Alcatraz'dan Kaçış,1,Alexa,2,Amelie,1,Analiz,1,Android,14,Android Haberleri,1,Android İpuçları,2,Android Uygulamaları,10,Animasyonlu İndirme Butonu,1,Anket,1,Antonio Banderas,1,Antremanlarla Matematik,1,Apk,2,Apk İndir,2,Arama Açıklaması,1,Arama Motorları,1,Araştırma,1,Arı,1,Ayrton Senna,1,Bana Dair,76,Base,1,Başarı,1,Başlık Efekt,1,Blog,2,Blog Keşif Etkinliği,1,Blog Nasıl Açılır?,1,Blogger,58,Blogger Eklentileri,18,Blogger Eklentisi,1,blogger haberleri,1,Blogger İpuçları,18,Blogger İstatistikler Widget'ı,1,Blogger Nedir,1,Blogger Sayfa Kaydırma Efekti,1,Blogger Sorunları,1,Blogger Tavsiyeleri,1,Blogger Temaları,6,Blogger Widget'ları,7,Blogger Yedekleme,1,Boks,1,Buton,2,camera,1,Can Dostum,1,Checker Gmail,1,Child 44,1,Chroma Keyboard,1,Cillian Murphy,1,Clev Note,1,CSS,2,Deadpool,1,Deadpool İndir,1,Diğer Kategoriler,10,Dinlediklerim,5,Dives İkon,1,Dizi,1,Dizi Replikleri,1,Drama Filmleri,3,Drop Caps,1,Duvar Kağıtları,1,Düşünce,1,Editörün Seçtikleri,4,Eklenti,2,Elementary,1,Etkileşim,1,Etkinlik,1,exi2.net,1,Fabrizio De André,1,Facebook,1,Film,6,Film İncelemesi,1,Film Puanlama,1,Film Replikleri,2,Filmler,6,First Character,1,First Letter,1,Flat İcon,1,Font,1,Forever,1,Formula 1,1,Forrest Gump,2,Frank Sinatra,1,Fringe,3,Galeri,5,Gary Oldman,1,Geçmişin Gölgesinde,2,Gerilim Filmleri,2,GetSiteControl,2,Google,2,Google Chrome,2,Google Fonts,1,Google Friend Connect,1,Google Plus,1,Google+,1,Google+ Toplulukları,1,Görsel,2,Guadalupe Pineda,1,Hayal Gücü Yüksek Sorular,1,Hayat ve Düşünce,1,Historia De Un Amor,1,HTML,2,Hugh Jackman,1,Instagram,1,Intoucheables,1,İcon,1,İkon Paketleri,1,İndex,1,İndir,4,İndirme Butonu,1,İnfografik,1,İstatistikler,1,İzlediklerim,20,Kalıcı Bağlantı,1,Kaliteli Blogger Eklentileri,1,Kaptan Amerika Kahramanların Savaşı,1,Kim Bu Semih,1,Kimdir,1,Kingsman: Gizli Servis,1,Kişisel Blog,9,Kişisel Yazılar,43,Kitap,1,Kullandıklarım,5,Launcher,1,Leonard Cohen,1,Logan,1,Logo Efekt,1,Lost in Translation,1,Material,2,Material Design,3,MeloCloud+ Music Player,1,Meta Açıklaması,1,Mijia Quartz Watch,1,Mim,10,Minimal Design,1,Mobil,2,Mobil Uyumlu Blogger Temaları,1,Muhammad Ali,1,Muhammad Ali Sözleri,1,Muhammad Ali'nin Hayatı,1,Müzik,7,Müzisyen,1,Nah Neh Nah,1,Nasıl Yapılır,5,Nasıl Yapılır?,3,Nedir,3,OGInstagram,1,Okuduklarım,2,Osmia Avosetta,1,Önemi,1,Öp Evlen Uçurumdan At,1,Özel Başlık Etiketleri,1,Paris'te Gece Yarısı,1,Paylaşım,1,PC,2,PC Uygulamaları,1,Peaky Blinders,2,Peppino Gagliardi,1,Pocket,1,Popüler Yayınlar,1,Radiogram,1,Radyo,1,Renato Carosone,1,Replikler,2,Repo Men,1,Resim ve Video,1,Resimli İndirme Butonu,1,Responsive,2,Robots txt,1,Rodrigo Amarante,1,Romantik Filmler,1,Root,2,Satın Aldıklarım,1,Schindler'in Listesi,2,Scroll Smooth,1,SEO,3,SEO Ayarları,1,Shareaholic,1,Shareit,2,Sherlock,3,Sherlock Holmes,1,Sıralama,1,Sinema,1,Site Haritası,1,Social Meter,1,Sosyal Medya,2,Soundcloud,1,Sözler,1,Spor,1,Sting,1,Tasarım,1,Tavsiyelerim,1,Teknoloji,1,Tema,1,Template Clue,1,The Blacklist,1,The Mentalist,2,The Mentalist Replikleri,1,The Pianist,1,Tom Hardy,2,Tozlu ve Yıkık Blog,1,True Detective,2,Tuyo,1,TVShow Time,2,Uygulama,1,Ücretsiz İkon,1,Üst Sıralara Çıkmak,1,Vaya Con Dios,1,Video,2,Videolar,1,Website,1,WhatFont,1,Woorank,1,Word Count,1,Wordpress,1,Xiaomi,1,Yabancı Diziler,9,Yabancı Radyo,1,Yardımlaşma,1,Yayın Ayarları,1,Yaz Tatili,1,Yazar Olmak,1,Yazı,2,Yazı Kutusu,1,Yazı Yazmak,1,Yıl Dönümü,1,Yıldız Sıralamalı,1,Yıldızlararası,1,Youtube,1,Ziyaretçi Trafiği,1,
ltr
item
Semih Keçecioğlu - Kişisel Blog: Blogger'da Yazı İçerisinde Görsel Galerisi Oluşturma
Blogger'da Yazı İçerisinde Görsel Galerisi Oluşturma
Blogger'da yazı içerisinde göürünümü hoş ve düzenli görsel galerisinin nasıl yapıldığını hakkında bir yazı.
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj6GYCMw2rQEceZzjNpKwYN-pXZ_nzhprGqkMzVPWSDqTZJyMVOBUY5bqylBb6cwtY1M8MxGxCuSuqDufuAWkEgdkgHrOYqQSUvJRVV7TASbM_mNZ_6BH6aRh7_sVw_QFnhf_cMsgjB2WE/s640/Blogger%2527da+Yaz%25C4%25B1+%25C4%25B0%25C3%25A7erisinde+G%25C3%25B6rsel+Galerisi+Olu%25C5%259Fturma.png
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj6GYCMw2rQEceZzjNpKwYN-pXZ_nzhprGqkMzVPWSDqTZJyMVOBUY5bqylBb6cwtY1M8MxGxCuSuqDufuAWkEgdkgHrOYqQSUvJRVV7TASbM_mNZ_6BH6aRh7_sVw_QFnhf_cMsgjB2WE/s72-c/Blogger%2527da+Yaz%25C4%25B1+%25C4%25B0%25C3%25A7erisinde+G%25C3%25B6rsel+Galerisi+Olu%25C5%259Fturma.png
Semih Keçecioğlu - Kişisel Blog
https://semihkececioglu.blogspot.com/2018/01/bloggerda-yazi-icerisinde-gorsel-galerisi-olusturma.html
https://semihkececioglu.blogspot.com/
https://semihkececioglu.blogspot.com/
https://semihkececioglu.blogspot.com/2018/01/bloggerda-yazi-icerisinde-gorsel-galerisi-olusturma.html
true
3247702708061337910
UTF-8
Tüm yazılar yüklendi. Hiçbir yazı bulunamadı. Tümünü Gör Devamını Oku Yanıtla Yanıtlamaktan Vazgeç Sil Yazan: Ana Sayfa Sayfalar Yazılar Tümünü Gör BENZER YAZILAR Etiket Arşiv Ara Tüm Yazılar Bulunamadı Geri Ana Sayfa Pazar Pazartesi Salı Çarşamba Perşembe Cuma Cumartesi Paz Pzt Sal Çar Per Cum Cmt Ocak Şubat Mart Nisas Mayıs Haziran Temmuz Ağustos Eylül Ekim Kasım Aralık Oca Şub Mar Nis Mayıs Haz Tem Ağu Eyl Eki Kas Ara şimdi 1 dakika önce $$1$$ minutes ago 1 saat önce $$1$$ hours ago Dün $$1$$ days ago $$1$$ weeks ago 5 haftadan uzun bir süre önce Takipçiler Takip Et Premium STEP 1: Share to a social network STEP 2: Click the link on your social network Tüm kodları kopyala Tüm kodları seç Tüm kodlar kopyalandı Çalışmazsa CTRL+C kombinasyonunu kullan Table of Content