Blogger Videolar İçin Işıkları Aç-Kapat Eklentisi

Blogger Videolar İçin Işıkları Aç-Kapat Eklentisi

 

Blogger için uygulanacak bu uygulamanın benim tarafından çok harika olduğunu düşünüyorum.Blogunda bir film veya dizi veya izletmek istediğiniz herhangi bir videoyu arkadaşlarınıza veya ziyaretçilerinize kapalı ışıklar içinde izletebilirsiniz sinema tarzı misali.Eklenti çok harika ve özel bir eklenti olduğunu düşünüyorum eklemek isteyen arkadaşlar aşağıdaki videodan DEMO'suna ve nasıl yapılacağına bakabilirler.

Blogger Paneline Girin. .

Şablon Tıklıyoruz > HTML Düzenle > CTRL+F yardımı ile </head> kodunu buluyoruz ve aşağıdaki kodları hemen üstüne yerleştiriyoruz

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js' type='text/javascript'/> <script type='text/javascript'> //<![CDATA[ $(document).ready(function(){ $("#darkness").css("height", $(document).height()).hide(); $(".lightSwitcher").click(function(){ $("#darkness").toggle(); if ($("#darkness").is(":hidden")) $(this).html("Işıkları Kapat").removeClass("turnedOff"); else $(this).html("Işıkları Aç").addClass("turnedOff"); }); }); //]]> </script>

CTRL+F yardımı ile ]]></b:skin> kodunu buluyoruz ve aşağıdaki kodları hemen üstüne yerleştiriyoruz

/* Bloggererdal Videolar İçin Işık Aç-Kapat Eklentisi ----------------------------------------------- */ #lightsVideo { position:relative; z-index:102; } #switch { max-width:640px; text-align:left; position:relative; height:25px; display:block; margin: 25px 0 0 60px; } .lightSwitcher { position:absolute; z-index:101; background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjCnBZetizDpptzd2V2HyQ6p4h_3-p6CcC7XRjx1wz0DueuNFZDItlCKrxoE4Hb4Xz1tIjZA_qiDASbVWnkeXNIMfsEgOPbmCwpwxaWVxZpE4ppRO2nJbjBJSIl7I11p8hkqlD5JDYf9EZO/s1600/lights-on.png); background-repeat:no-repeat; background-position:left; padding: 0 0 0 20px; outline:none; text-decoration:none; } .lightSwitcher:hover {text-decoration:underline;} .turnedOff { color:#ffff00 !important; background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgeGR-oi0RJ047Co2PpT7n5IUYKbM8jy3YgNu8xruVpEcECDu6JI4DVPyPz7C4tFINypdeDIqL3rh6vCa-YvD49Xo_JwWiWJAVZh6aIIiD6WWUGlbqo1EsVo0eNmQL57Ip81shw5XkuCZR4/s1600/lights-off.png); } #darkness { background:#000; opacity:0.8; filter:alpha(opacity=80); position:absolute; left:0; top:0; width:100%; z-index:100; }
CTRL+F yardımı ile </body> kodunu buluyoruz ve aşağıdaki kodları hemen üstüne yerleştiriyoruz

<center> <div id="switch"> <a class="lightSwitcher" href="javascript:void(0);">Turn off the lights</a></div> <div id="lightsVideo"> ...Buraya video'nun kodunu ekliyoruz... </div> </center>

Kaynak: BloggerTurkey