Sitesine lightbox ekleyenlerin ilk başta güzel olduğunu düşündüğü, ama iş resimlere tek tek kod ekleme işine gelince uff dediği eklenti, şimdi öncelikle sitenizde lightbox eklentisi varsa silin hepsini baştan yapacağız adam gibi yapacağız. Temamızda aşağıdaki kodu buluyoruz.
<head>
Bu koddan sonra aşağıdaki kodları olduğu gibi ekliyoruz.
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js' type='text/javascript'/>
<style type="text/css">
/* jQuery lightBox plugin - Gallery style */
#gallery {
background-color: #444;
padding: 10px;
width: 520px;
}
#gallery ul { list-style: none; }
#gallery ul li { display: inline; }
#gallery ul img {
border: 5px solid #3e3e3e;
border-width: 5px 5px 20px;
}
#gallery ul a:hover img {
border: 5px solid #fff;
border-width: 5px 5px 20px;
color: #fff;
}
#gallery ul a:hover { color: #fff; }
</style>
<script src="https://cdn.rawgit.com/furkanozden/bloggerlightbox/29e71c6f/jquery.lightbox-0.5.js" type="text/javascript"/>
<link href="https://cdn.rawgit.com/furkanozden/bloggerlightbox/29e71c6f/jquery.lightbox-0.5.css" media="screen" rel="stylesheet" type="text/css"/>
<script type="text/javascript">
$(function() {
$('a[href$=jpg], a[href$=JPG], a[href$=jpeg], a[href$=JPEG], a[href$=png], a[href$=gif], a[href$=bmp]:has(img)').lightBox();
});
</script>
Tamam bitti bu kadar 🙂 Bu kadar basitti yani 🙂 Şimdi geri kalan tek şey mavi ile belirttiğim .js, .css vs. ile biten linkleri bilgisayarınıza kaydedip kendi bildiğiniz sunucuya yüklemeniz. Dosyalar normalde github’a yüklü sorun çıkmaz ama yine de bir yere not alın. Son olarak da eğer ki kodda sıkıntı yaşarsanız kırmızı yeri aşağıdaki kodla değiştiriniz.
<script type="text/javascript">
$(function() {
$('a').each(function(){
this.href = this.href.replace('s1600-h', 's1600');
});
$('a[href$=jpg], a[href$=JPG], a[href$=jpeg], a[href$=JPEG], a[href$=png], a[href$=gif], a[href$=bmp]:has(img)').lightBox();
});
</script>
Sağlıcakla kalın 🙂
Canva, yeni başlayanlardan uzmanlara kadar uzanan dijital içerik oluşturucuların güzel tasarımlar oluşturabileceği bir platformdur. Bir…
Genel olarak, trafik seviyesinin aynı olduğu varsayıldığında, tek bir konu blogu çok nişli bir blogdan…
İster tek konulu bir blog, ister çok nişli bir blog yazmaya başlayacak olun, ele alacağınız…
Blog yazmanın tek gerçek maliyeti, bir alan adı kaydettirmek ve barındırma için ödeme yapmaktır. Maliyetler tek konu…
Pazarlama, hedef kitlenizi büyütmenize, trafiği artırmanıza ve içeriğinizi görmeyecek yeni okuyuculara ulaşmanıza yardımcı olur. Bir blog…
Artıları Bazı durumlarda içerik oluşturmak daha kolay ve daha hızlıdır - daha fazla içerik seçeneğiniz…
