Resimlere Lightbox Nasıl Yapılır?
Ne Yaptım?, Wordpress Türkçe Eklenti Nisan 10th, 2009
Bugün,bir site üzerinde çalışırken resim için en iyi gösterim şeklinin lightbox olduğuna karar verdim ve ufak bir araştırmadan sonra yapmay öğrendim aslında çok basit bir uygulama ama bir o kadarda şık duruyor ayrıca kullanıcılarınızda siteyi terketmeden resime bakmış oluyor. Lightbox’ı bileniniz var, bilmeyeniniz var. Peki nedir bu Lightbox?
Hemen açıklıyorum Lightbox, küçük resimlerin önizlemelerini sayfayı terketmeden görmenizi sağlayan basit bir JavaScript uygulamasıdır.( resime tıkladığınızda kenarları şeffaf olan ve resmin bütününü acan bir uygulama) Örnek için şurayı ziyaret ediniz. Peki nasıl yapılır bu Lightbox denen şey bilmeyenleriniz ve öğrenmek isteyenleriniz için hemen anlatıyorum.
1. Öncelikler Lightbox 2.0 için gerekli olan dosya buraya tıklayarak indiriyoruz.
1936 kez indirildi
2. İndirdikten sonra, zipli dosyayı bir yere çıkartıyoruz ve içinden çıkan dosyaları sitenizin ana host dizinine atıyorsunuz( yani index.php dosyasının olduğu yere)Not: Bu uygulamayı wordpress için kullanmak istiyorsanız kullandığınız tema klasörüne atıcaksınız
Örnek /wp-content/themes/default gibi
6. WordPress Admin Paneli>Görünüm>Editör ‘e tıkladıktan sopnra Üst kısım (header.php) e tıklıyoruz ve <head> </head> kodları arasına aşağıdaki kod kümesini ekliyoruz.
<script type="text/javascript" src="js/prototype.js"></script> <script type="text/javascript" src="js/scriptaculous.js?load=effects,builder"> </script> <script type="text/javascript" src="js/lightbox.js"></script> <link rel="stylesheet" href="css/lightbox.css" type="text/css" media="screen"/>
8. Temamızın kodlarıyla burada işimiz bitiyor. Kaydediyoruz. Yazı yazarken resmimize Lightbox’ı uygulamak için aşağıdaki kodu kendimize göre düzenliyoruz.
Hepsi Bu Tabi Her Zamanki Gibi Yapamazsanız Hata Alırsanız Ben Burdayım Sorun Yardım Ederim
<a href="Resim adresi" rel="lightbox" title="Resim açıklaması"><img src="Resim Adresi"/></a>

