Cara Membuat Widget Subscribe Feedburner MELAYANG ( Pop-up ) di Blog

Cara Membuat Widget Subscribe Feedburner MELAYANG ( Pop-up ) di Blog

Salam Blogger, Kali ini bloggingpasuruan mau berbagi artikel tentang Cara Membuat Widget Subscribe Feedburner MELAYANG ( Pop-up ) di Blogger. Widget Subscribe Feedburner ini akan mempercantik tampilan Blog sobat sekaligus tampak lebih profesional ( lihat gambar di atas )

Apakah Sobat ingin memasangnya di Blog milik Sobat ???

Ikuti langkah langkah Cara Membuat Widget Feedburner MELAYANG ( Pop-up ) di Blogger :

1. Masuk ke Akun Blogger Sobat

2. Masuk Dashboard >> Layout ( tata letak ) >> Add a HTML/JavaScript Gadget

3. Pastekan KODE di bawah ini di dalamnya

<script type="text/javascript">
    /*** Widget oleh Bloggingpasuruan (http://bloggingpasuruan.blogspot.com)***/
    function wg_style_v4_popup(){document.getElementById('wg-style-v4-popup-main').style.display='block'}setTimeout('wg_style_v4_popup();',4000);
    </script>
    <style type="text/css">
    * html #wgstylepopupdiv {
    position:absolute;
    }
    #wgstylepopupdiv {
    z-index:999;
    display:block;
    top:0;
    left:0;
    width:100%;
    height:100%;
    position:fixed;
    background-image:url(http://3.bp.blogspot.com/--QwfQi4MAE4/U0a5LnWN_SI/AAAAAAAAHic/r48Jeq7Vlzc/s1600/wgspir.png);
    overflow-y:auto;
    margin:0;
    }
    .wgstylepopup {
    width:619px;
    height:475px;
    position:fixed;
    top:50%;
    left:50%;
    margin-top:-237.5px;
    margin-left:-309.5px;
    }
    #wgstylepopup {
    overflow:none;
    background-image:url(https://3.bp.blogspot.com/-x4Wu9FXAo9Q/VGLZl6HfnxI/AAAAAAAABeE/k_xL94-ZLWI/s1600/Feedburnerpasuruan.png);
    background-repeat:no-repeat;
    }
    form#wgstylepopup {
    display:block;
    margin:0;
    }

    form#wgstylepopup #wgfield {
    position:absolute;
    top:297px;
    left:352px;
    width:250px;
    font-size:16px;
    border:none;
    background:transparent;
    padding:10px;
    }

    form#wgstylepopup #wgbutton {
    position:absolute;
    left:352px;
    top:350px;
    width:249px;
    height:42px;
    border:none;
    background:transparent;
    }
    </style>
    <!--[if lte IE 6]>
    <style type="text/css">
    /*<![CDATA[*/
    html {overflow-x:auto; overflow-y:hidden;}
    /*]]>*/
    </style>
    <![endif]-->
    <div id="wg-style-v4-popup-main" style="display:none;">
    <div id="wgstylepopupdiv">
    <div id="wgstylepopup" class="wgstylepopup">
    <center style="color:#000;cursor:pointer;float:right;margin-right:10px;margin-top:-20px;" onmouseup="document.getElementById('wgstylepopupdiv').style.display='none'">
    <img src="http://1.bp.blogspot.com/-d793Rqqvmwk/U0a5tz4JtMI/AAAAAAAAHis/BWv62c3FA6M/s1600/closebtnwg.png"/>
    </center>
    <form id="wgstylepopup" action="http://feedburner.google.com/fb/a/mailverify" method="post" target="popupwindow" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=TutorialDanTipsBermanfaat', 'popupwindow', 'scrollbars=yes, width=600, height=550'); return true">
    <input type="hidden" value="TutorialDanTipsBermanfaat" name="uri"/>
    <input type="text" id="wgfield" name="email" value="Masukkan Email disini..." />
    <input type="hidden" name="loc" value="en_US" />
    <input type="image" src="http://3.bp.blogspot.com/-380kiAZ85g0/U0a58SZ7-0I/AAAAAAAAHi0/kusJh7kaSOg/s1600/wgtnn.gif" id="wgbutton" />
    </form>
    </div>
    </div>
    </div>


Catatan :

>>> Ganti TutorialDanTipsBermanfaat dengan ID Feedburner milik Sobat

>>> Tekan Save/Simpan

Selesai

Saya akan sangat berterima kasih jika sobat Blogger berkenan meninggalkan komentar, saran atau tambahan informasi serta pertanyaan seputar artikel Cara Membuat Widget Subscribe Feedburner MELAYANG ( Pop-up ) di Blogger. Semoga bermanfaat dan terima kasih..

Share this with short URL: Get Short URLloading short url

Nama saya Usman Kurniawan dari Pasuruan - jawa timur dan bukan seorang Blogger Pro, Namun saya akan serius belajar jika menyukai sesuatu hal, termasuk dunia blogging.

Previous
Next Post »

11 comments

Write comments
May 22, 2015 at 2:39 AM delete

Makasih bgt bro info nya, sangat bermanfaat. hehe
Jangan Lupa mampir ke blog Lowongan Kerja Terbaru ane ya Lowongan Kerja PT Astra Internasional Tbk

Reply
avatar
June 25, 2015 at 6:54 PM delete

Makasih gan
Keren gambarnya
tapi cucok banget gan...
ada pingky-pingkynya

Reply
avatar
June 27, 2015 at 8:51 PM delete

Soal tampilan backgrond bisa dimodifikasi sendiri Gan,.... buatnya pake coreldraw juga bisa .. asal ukurannya sesuai dengan gambar saya diblog tsb

Reply
avatar
DIstro Herbal
AUTHOR
August 2, 2015 at 7:55 AM delete

Maturnuwun infone Kang. Langsung action dulu

Reply
avatar
DIstro Herbal
AUTHOR
August 2, 2015 at 7:57 AM delete

Kalo untuk WP self hosting gmna Gan?

Reply
avatar
November 30, 2015 at 6:23 PM delete

sangat membantu.. maksih smga sukses ya

Reply
avatar
June 16, 2016 at 8:00 AM delete

Mantap masakasih gan, artikelnya buat saya puas dalam memecahkan solusi yang saya alami, maklum sya pemula dan mulai serius ngurus blogger...

kunjungi juga azaenihusna.blogspot.co.id sya minta sarannya gan

Reply
avatar
Achmad Naufal
AUTHOR
September 11, 2016 at 3:53 AM delete

maaf gan backgroundnya boleh saya modif/edit?

Reply
avatar
berita saya
AUTHOR
October 15, 2016 at 12:40 PM delete

maksih Mas atas tutor nya. beitakumpul.blogspot.com

Reply
avatar
Wawan Agusti
AUTHOR
January 3, 2017 at 9:24 AM delete

Ini yang terbaru.
http://riskiaktovan.blogspot.com/2016/12/update-membuat-artikel-terkait-blogger-terbaru-2017.html
Sudah saya terapkan si blog saya dan sukses

Reply
avatar