Ok sobat berikut ini seocips akan membagikan tentang cara membuat popup di blog. Pada artikel terdahulu saya telah mambagikan bagaimana cara membuat popup auto display di blog dimana popupnya akan otomatis muncul ketika ada yang mengunjungi blog anda.

Cara Membuat Popup Tidak Otomatis Di Blog

Popup berikut ini berbeda dengan yang terdahulu, efek popup berikut ini harus di perintah/diklik baru muncul popupnya. Jadi bagaimana, apakah anda tertarik ingin membuatnya juga? ok berikut ini saya bagikan triknya. [seocips] Oh iya Popup ini juga yang saya pakai di Tombol download dengan efek popup untuk demonya mungkin sobat dapat mengeceknya disitu.

Letakan kode dibawah ini ke dalam template blog anda.

<style>
#backgroundPopup { z-index:1; position:fixed; display:none; height:100%; width:100%; background:#000000; top:0; left:0; }
#toPopup { font-family:&quot; lucida grande&quot; ,tahoma,verdana,arial,sans-serif; background:none repeat scroll 0 0 #FFFFFF; border:10px solid #ccc; border-radius:3px 3px 3px 3px; color:#333333; display:none; font-size:14px; left:50%; margin-left:-402px; position:fixed; top:20%; width:650px; z-index:2; }
div.loader { background:url(&quot; ../img/loading.gif&quot; ) no-repeat scroll 0 0 transparent; height:32px; width:32px; display:none; z-index:9999; top:40%; left:50%; position:absolute; margin-left:-10px; }
div.close { background:url(&quot; ../img/closebox.png&quot; ) no-repeat scroll 0 0 transparent; bottom:24px; cursor:pointer; float:right; height:30px; left:27px; position:relative; width:30px; }
span.ecs_tooltip { background:none repeat scroll 0 0 #000000; border-radius:2px 2px 2px 2px; color:#FFFFFF; display:none; font-size:11px; height:16px; opacity:0.7; padding:4px 3px 2px 5px; position:absolute; right:-62px; text-align:center; top:-51px; width:93px; }
span.arrow { border-left:5px solid transparent; border-right:5px solid transparent; border-top:7px solid #000000; display:block; height:1px; left:40px; position:relative; top:3px; width:1px; }
div#popup_content { margin:4px 7px; }
</style>
<script src='https://popupseocips.googlecode.com/svn/seocipspopup' type='text/javascript'/>
<script src='https://seocipsokbanget.googlecode.com/svn/popupwidget.js' type='text/javascript'/>
<center>
<a class='topopup' href='#'>VIEW</a> </center>
    <div id='toPopup'>
           <div class='close'/>
        <span class='ecs_tooltip'>Press Esc to close <span class='arrow'/></span>
<div id='popup_content'> <!--your content start-->
            <p>
Letakan Apasaja disini
    Widget by : <a class='widgetku' href='http://www.seocips.com' id='widgetku' target='blank'>seocips</a>
</div>
 </p>
 </div> <!--your content end-->
    </div> <!--toPopup end-->
    <div class="loader"></div>
       <div id="backgroundPopup"></div>

Ganti tulisan' Letakan Apasaja disini' dengan apa yang sobat inginkan.
Ok sobat sekian tutorial cara membuat efek Popup di blog blogspot blogger untuk saat ini semoga bermanfaat.
1 Komentar untuk "Cara Membuat Popup Tidak Otomatis Di Blog "

maaf.., itu cara pasang codenya taruh di mana Gan...., maksudnya taruh di templet setelah kode apa...