Unknown 16 Ekim 2012 Salı

Herkese selamlar.. Yine uzun araştırmalarından sonra hiç bir yerde sinema modu eklentisinin adam akıllı anlatılmadığını gördüm. Bir çoğu aynısını paylaşmış onlarda da link ölmüş. Bu wordpressnedenle bende WordPress Sinema Modu ( Işıkları Aç – Kapa ) başlığında sizlere bunu anlatmaya karar verdim. Eklenti gerçekten çok güzel. Bir çok film temasında bulunuyor ancak özelleştirilmiş kişisel tema yapan kişiler için mutlaka yararlı olduğunu düşünüyorum. Bu eklentiyi bilmeyen arkadaşlarımız için nasıl bir şey olduğunu anlatayım. WordPress film ya da dizi sitemizin içinde bunu eklediğimizde ve sinema modunu aktif ettiğimizde video dışında her yer yavaş bir şekilde kararıyor. Böylece ortaya hoş bir sinema havası geliyor. Ben klasik bir şekilde yaptım çünkü pek fazla zamanım yok ama eğer yardım isterseniz tasarımı konusunda yardımcı olabilirm. Eklentide css dosyasını ayırmadım tamamen hepsi tek bir yere atılarak yapılacak. Resim dosyalarını da konu altında paylaşacağım.  Her neyse lafı daha fazla uzatmadan hemen anlatıma geçeyim.
Öncelikle film ve dizi temamızın içinde  Single.php ( Tekil Yazı ) dosyasını açıyoruz.  Herhangi bir yerine ( en üste olabilir ) aşağıda ki kodları ekliyoruz.
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$(".resimerakli").click(function(){
$('<div id="meraklisinema"></div>').appendTo("body");
$('#meraklisinema').css({"opacity": '0.9'});
 
if ($("#meraklisinema").is(":visible")){
$(".resimerakli").attr("src", 'isik_ac.png resim yolu');
$("#meraklisinema").fadeOut(1200);
}else{
$(".resimerakli").attr("src", 'isik_kapa.png resim yolu');
$("#meraklisinema").fadeIn(1200);
}
});
});
</script>
 
<style>
body {margin: auto}
#meraklisinema {background-color: #000; width: 147%; height: 106%; position: fixed;top: -12px;left: -18px; z-index: 4; display: none}
.video {position: absolute; z-index: 10}
.resimerakli {position: absolute; z-index: 10; cursor: pointer; margin: -95px 0 0 393px;}
</style>

‘isik_ac.png resim yolu ve isik_kapa.png resim yolu yazan yerlere konu altında verdiğim resimleri ftp’nize atarak oradan çektirebilirsiniz.
Daha sonra sinema modunun nerede görünmesini istiyorsanız yine Single.php ( Tekil Yazı ) dosyası içine aşağıda kodları ekliyoruz.
1
<img src="isik_kapa.png resim yolu"  class="resimerakli" />

Umarım işinize yaramıştır. Kendinize iyi bakın saygılarımla..

0 yorum for " Wordpress Sinema Modu (ışıkları aç-kapa) "

Blogger tarafından desteklenmektedir.