Triple T

Membuat yahoo Emoticon New JS

Diposting oleh Unknown - 5 komentar

tutor ini saya daptkan dari blog.kangismet.net... tapi saya edit2 dikit lah(dikit banget :D)

1. Masuk ke Dasbor ---> Rancangan ---> Edit HTML
2. Backup template (menjaga kegagalan proses)
3. Tandai Expand Template Widget
4. Cari kode ]]></b:skin> dan tambahkan kode ini di atasnya

<!-- Yahoo Smileys by Kangismet.net Code Start-->
.ysmileykangismet {
    background: none repeat scroll 0 0 #EFF5FB !important;
    font-size: medium !important;
    padding: 10px !important;
    text-align: left !important;
    font-weight:bold !important;
    font-size:11px !important;
    margin-top:-35px;
}
img.bhacksmly {
    height: auto !important;
    vertical-align: middle !important;
    width: auto !important;
    border:0px !important;
}
<!-- Yahoo Smileys Code End-->

cari kode berikut

<div class='post-footer-line post-footer-line-3'/>
</div>
</div>

copy kan kode berikut stelah kode </div> ke 2 di atas

<b:if cond='data:blog.pageType == "item"'>
<div style='background-color:#F5F8FA; border:2px dashed #D7E8F0; width:auto; padding:10px; height:100px; overflow:auto;'>

<div class='ysmileykangismet'>
<img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/1.gif'/> :)
<img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/2.gif'/> :(
<img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/3.gif'/> ;)
<img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/4.gif'/> :D
<img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/5.gif'/> ;;-)
<img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/7.gif'/> :-/
<img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/8.gif'/> :x
<img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/10.gif'/> :P
<img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/11.gif'/> :-*
<img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/12.gif'/> =((
<img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/13.gif'/> :-O
<img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/14.gif'/> X(
<img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/15.gif'/> :7
<img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/16.gif'/> B-)
<img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/17.gif'/> :-S
<img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/18.gif'/> #:-S
<img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/19.gif'/> 7:)
<img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/20.gif'/> :((
<img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/21.gif'/> :))
<img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/22.gif'/> :|
<img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/23.gif'/> /:)
<img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/24.gif'/> =))
<img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/25.gif'/> O:-)
<img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/26.gif'/> :-B
<img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/27.gif'/> =;
<img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/101.gif'/> :-c
<img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/100.gif'/> :)]
<img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/102.gif'/> ~X(
<img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/103.gif'/> :-h
<img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/104.gif'/> :-t
<img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/105.gif'/> 8-7
<img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/28.gif'/> I-)
<img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/29.gif'/> 8-|
<img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/29.gif'/> L-)
<img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/31.gif'/> :-a
<img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/32.gif'/> :-$
<img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/33.gif'/> [-(
<img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/34.gif'/> :O)
<img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/35.gif'/> 8-}
<img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/36.gif'/> 2:-P
<img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/37.gif'/> (:|
<img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/38.gif'/> =P~
<img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/40.gif'/> #-o
<img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/41.gif'/> =D7
<img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/42.gif'/> :-SS
<img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/43.gif'/> @-)
<img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/44.gif'/> :^o
<img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/45.gif'/> :-w
<img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/47.gif'/> 7:P
<img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/48.gif'/> 2):)
<img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/109.gif'/> X_X
<img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/110.gif'/> :!!
<img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/111.gif'/> \m/
<img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/112.gif'/> :-q
<img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/113.gif'/> :-bd
<img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/114.gif'/> ^#(^
<img alt='' class='bhacksmly' src='http://l.yimg.com/a/i/us/msg/emoticons/pirate_2.gif'/> :ar!
</div>

</div></b:if>
</b:includable>

cari kode </body> dan letakkan kode berikut di atasnya

<script src='http://kangismet.googlecode.com/files/ysmiley_fixed.js' type='text/javascript'/>

http://blog.kangismet.net/2012/01/menambahkan-yahoo-smiley-pada-threaded.html

Cara Pasang Facebook Like Otomatis di Postingan Blog

Diposting oleh Unknown - 3 komentar

lgi surfing di dunia blog cari2 tutorial, ekh nemu blog http://buka-rahasia.blogspot.com/, blog yg bagus bgt menurut saya...saya ingin berbagi tutorial yg saya dapatkan dari blog tadi..Cara Pasang Facebook Like Otomatis Di Postingan Blog

Ada beberapa jenis Facebook like button. Berikut preview plus script-scriptnya yang dibuat untuk Blogger/Blogspot:

Standard Facebook Like Button

<b:if cond='data:blog.pageType == "item"'>
<iframe allowTransparency='true' expr:src='"http://www.facebook.com/plugins/like.php?href=" + data:post.url + "&send=false&layout=standard&show_faces=false&width=450&action=like&font=arial&colorscheme=light&height=35"' frameborder='0' scrolling='no' style='border:none; overflow:hidden; width:450px; height:35px;'/>
</b:if>

Box Count Facebook Like Button

<b:if cond='data:blog.pageType == "item"'>
<iframe allowTransparency='true' expr:src='"http://www.facebook.com/plugins/like.php?href=" + data:post.url + "&send=false&layout=box_count&show_faces=false&width=55&action=like&font=arial&colorscheme=light&height=65"' frameborder='0' scrolling='no' style='border:none; overflow:hidden; width:55px; height:65px;'/>
</b:if>

Button Count Facebook Like Button

<b:if cond='data:blog.pageType == "item"'>
<iframe allowTransparency='true' expr:src='"http://www.facebook.com/plugins/like.php?href=" + data:post.url + "&send=false&layout=button_count&show_faces=false&width=90&action=like&font=arial&colorscheme=light&height=21"' frameborder='0' scrolling='no' style='border:none; overflow:hidden; width:90px; height:21px;'/>
</b:if>

Jika ingin mengubah tampilan Facebook like menjadi gelap (dark), ubah value pada colorscheme=light, ganti light dengan dark colorscheme=dark.

defaultnya tombol tersebut berada di sbelah kiri..jika ingin membuatnya di sbelah kanan...sisipkan kode berikut

<div style='padding:4px; float: right;'>
</div>

Contoh cranya

<b:if cond='data:blog.pageType == "item"'>
<div style='padding:4px; float: right;'>
<iframe allowTransparency='true' expr:src='"http://www.facebook.com/plugins/like.php?href=" + data:post.url + "&send=false&layout=button_count&show_faces=false&width=90&action=like&font=arial&colorscheme=light&height=21"' frameborder='0' scrolling='no' style='border:none; overflow:hidden; width:90px; height:21px;'/>
</div>

</b:if>

Cara memasang Facebook Like di Blogger:

1. Masuk ke dashboard > Design/Rancangan > Edit HTML.

2. Klik/check "Expand Widget Templates"

3. Pilih salah satu script/kode dari jenis Facebook Like di atas, lalu:

4. Jika ingin memasang button di atas posting, cari <div class='post-header-line-1'/> atau <div class='post-body'> (gunakan Ctrl+F) dan paste kode tersebut tepat di BAWAH-nya. Jika kedua kode tersebut tidak ketemu, letakkan kode di ATAS <data:post.body/>.

5. Jika ingin memasang button di bawah posting, cari <data:post.body/> (gunakan Ctrl+F) dan paste kode tersebut tepat di BAWAH-nya.

6. Save template.

7. Done and enjoy.

Cara Memasang Facebook Like Otomatis di Posting Blogger/Blogspot

Membuat Tombol Back To Top

Diposting oleh Unknown - 0 komentar

kali ini tentang tombol back to top dengan kode yang singkat dan tidak berat
langsung saja...

<a style="display:scroll;position:fixed;bottom:5px;right:5px;" href="#" title="Back to Top"><img src="url gambar back to top blog" /></a>

Ganti url gambar back to top blog dengan gambar back to top anda..contoh gambar ada di bawah...

pilih salah satu aja..jgn smuanya...
Semoga Bermanfaat...

Mengubah Default Blockquote Menjadi Lebih Keren

Diposting oleh Unknown - 1 komentar

Sebuah kutipan blok atau banyak orang menyebut tanda petik dan dalam dunia blogging disebut Blockquote. Ini merupakan ekstrak dalam dokumen tertulis blogging. Pada kesempatan yang berbahagia ini, Saya akan membagikan cara membuat blockquote yang berbeda dengan default blockqoute blogger.

Hasil ini hampir sama dengan cara mengganti background postingan yang pernah saya tuliskan sebelumnya. blockquote ini akan memberi anda ide tentang bagaimana untuk membuat blockquote yang menarik untuk blog anda dan halaman web.

Pada gambar diatas merupakan hail dari costumasi blockquote. Berikut langkahnya,

Masuk ke akun Blogger Anda;
Klik tombol Rancangan dan pilih Edit HTML;
Backup Template dulu jika anda ketakutan salah memasang kodenya;
Cari kode :

.post-body blockquote { line-height:1.3em; }
Atau
.post blockquote{ ...............................}

Jika sudah ketemu hapus kode diatas dan ganti dengan salah satu kode - kode berikut :

Code 1 :

.post blockquote {
margin : 0 20px; padding: 60px 30px 40px 20px;
background : #F1F8FE url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhbtyP2fDqewZL1dCEd8a5O-0mIipbInlHLbDcjWHcFLNkkh1w4d9BvY45AafKRHFYi8V9F1GYkXjally0ghar0MsaPscTBh0yUfNO0LFUcHuOetI_cDTQYEtEgKugQDeTKMeCzr4F7cbU/s400/owl.png) no-repeat 350px 5px;
font: normal .9em "comic sans ms", Courier,"Times New Roman", Times, serif;
color : #000; border-left: 8px dotted #DAB547;
}

.blockquote p {
margin: 0; padding-top:10px;
}

Code 2 :

.post blockquote {
margin : 0 20px; padding: 70px 20px 20px 40px;
background : #E4EAFE url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh09x6XsdUvm7TvHV42mfdFKWsi5GbGkIRLDzGBUfRK1qQISr4hQnw_LWnIu07dymHGDjkGEzoxiJ7sNhnAz6CJUH75ruP9OG9_ERcSFlQSIX-9Be5DcVWjyiBS4edL1_8-2Vb6reC5Mbs/s400/angular-purple.gif) no-repeat top left;
font: bold 1em Helvetica, verdana, Georgia, "Times New Roman", Times, serif;
color : #000; border-bottom : 5px solid #435388;
}

.post blockquote p {
margin: 0; padding-top:10px;
}

Code 3:

.post blockquote {
margin : 0 20px; padding: 10px 20px 25px 20px;
background : #9FCFFF url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgtvQ-hY13EjRLUmKqQoGLpZUfaMfzdvexqdU9vC3QgT8KHbPDy24JoNqhHEqm4FU3U99TOifaUNDBOpCO5HaroFSdcjSWiIfV8bgtdaEfmvtmWyRqql5s-zpGS1zD2etaQLq9c3Y3XZCU/s1600/block22.gif) no-repeat right bottom;
font: bold .9em "comic sans ms", arial, Helvetica,verdana, Georgia;
color : #484848;
border: 5px dashed #fff;
}

.post blockquote p {
margin: 0; padding-top:10px;
}

Code 4:

.post blockquote {
background: #F3F3F1 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjMBwcqHdB4gUOCMzarzJhtj0RdT24xj7qrVNkgRWiy0ArttTh6AHyEtM-QxVgexd-5ibELi3AI4hLzaWA6Wr9RUgiiCfo8o7bKkwlkYOiZ0GLboZy1_cMnAZ_IgR28pr_fXKLX21s8cRE/s1600/comma-side-orange1.gif);
background-position:; background-repeat:repeat-y;
margin: 0 20px;
padding: 20px 20px 10px 45px; font-size: 0.9em;
font: italic 1.2em Georgia, "Times New Roman", Times, serif;
}

.post blockquote p {
margin: 0; padding-top: 10px;
}

Code 5:

.post blockquote {
background: #484B52 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhy3ZtqhTeGJAO1gYpfBe85MOeCm1zY_YJafFJUC-YXFJvXyguW_JEij8ZavIP7HrIgSPcppmPuXPpNIxv1dLwl8ZIlWxJ5XQFnGm6tPyiYYhRNBy5onaeOrEmszsJG2pLhSUm6OHhYeUg/s1600/green-black-side.gif) ;
background-position:;
background-repeat:repeat-y;
margin: 0 20px;
padding: 20px 20px 20px 50px; color:#C7CACF;
font: normal 0.9em Helvetica, verdana, serif, Georgia, "Times New Roman";
}

.post blockquote p {
margin: 0; padding-top: 10px;
}

Code 6:

.post blockquote {
margin : 0 20px; padding: 20px 60px 80px 20px;
background : #FEE4E3 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEibwFsCouwAp4UNOKW-0Yrx6q1qTY0JJS5_30paBJIFDFEmSfzDF8cNjuZTgutEnA7z0OahiEIkX48Zobcgsq_YeSs_f4GIBezBSFJ96j-hVEIsF2GrT8VV0BvryTlpCGDkePuO12LbHwM/s400/angular-right.gif) no-repeat bottom right;
font: bold italic 1em Georgia, verdana, Helvetica, "Times New Roman", Times, serif;
color : #000; border: 1px solid #DDD;
}

.post blockquote p {
margin: 0; padding-top:10px;
}

Code 7:

.post blockquote {
margin : 0 20px; padding: 70px 20px 30px 20px;
background : #E7E5DC url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhVUgrGUNN_AcLf-BgFsfGG7ASbc9Yc1nWyQ0o_yElBeCgUKE1ewqF9JOIN75fZeG7rk7UZENEHXtRL-QmoKzXaWLl8Q2eAoHe8zhLLUaLFPrDYDw4szTQW-8gFnxyXoCSWZIgQN1j-iZ0/s400/block3331.gif) no-repeat top;
font: bold .9em Helvetica, "comic sans ms",Courier,"Times New Roman", Times, serif;
color : #343434;
border-left : 7px solid #FF7802;
border-right : 7px solid #FF7802;
border-bottom : 7px solid #FF7802;
}

.post blockquote p {
margin: 0; padding-top:10px;
}

Code 8:

.post blockquote {
background-position:-10px -7px;
border: 1px dashed #FFC600;
margin: 20px 10; padding: 0 20px 0 50px;
background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiBiIB1v0OCNLlr9DkFzvNyK5BbWCBYjifmsO6cxQ0uApoJhq2LH1ZTfZJktkHxnJywGkqNQJI8E9ESAD-Mvr1mLi7wHkbavswMyD5nzHpyWVAYZ8l_rBvMOhWh-UEFuUPKLA97e_FC725O/s1600/quote.png") 5% no-repeat #FFF8DD;
}

Code 9:

.post blockquote {
padding-left:30px;
padding-right:5px;
background:url(http://www.darkfalltournament.com/images/blockquote.png) no-repeat 0 .0em;
color:#444;
font-style:italic;
text-align:left;
margin:1em 20px;

}

Code 10:

.post blockquote {
background-color: #666;
color: #fff;
font-weight: bold;
padding: 10px;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
}

Code 11:

blockquote{width: 90%;background:#FFF; padding:5px 15px; margin:5px; color:#555; border:1px solid #C1C1AE; line-height:150%; font-size:12px;border: 1px solid #eee;
-webkit-box-shadow: 8px 8px 16px 4px rgba(0,0,0, 0.4);
-moz-box-shadow: 8px 8px 16px 4px rgba(0,0,0, 0.4);
box-shadow: 8px 8px 16px 4px rgba(0,0,0, 0.4);
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;}

Jika Ingin Menambahkan Efek Scroll pada blockquote tambahkan code berikut

overflow:auto;
max-height:300px;

Sehingga menjadi seperti ini

    .post blockquote {
    overflow:auto;
    max-height:300px;
    background-color: #666;
    color: #fff;
    font-weight: bold;
    padding: 10px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    }

Warna Merah Kode Scroll

Jika sudah selesai Simpan Template
Lihat hasilnya . . . .

Memodif Berlangganan Via E-Mail Default Blogger

Diposting oleh Unknown - 0 komentar

bgi beberapa orang yg simple adalah yg bagus...nah,,,...itulah saya....
yah ...sprti yg saya pake di blog saya..yg sya pk itu adalah follow by email default dari blogger....
di situ saya menambahkan sedikit kata2 saya tepat di atas form submit email..
langsung saja..

buka edit html centang expand widget template
cari followbyemail1 gunakan ctrl+f
default code nya sperti di bawah ini(tanpa tulisan merah)

<b:widget id='FollowByEmail1' locked='false' title='' type='FollowByEmail'>
<b:includable id='main'>
<b:if cond='data:title != ""'><h2 class='title'><data:title/></h2></b:if>
<div class='widget-content'>
    <div class='follow-by-email-inner'>
<center><p>Berlangganan Artikel Dari <a expr:href='data:blog.homepageUrl'>Triple T</a> Dengan Cara Memasukan E-Mail Anda Pada Form Di Bawah Ini</p></center>
      <form action='http://feedburner.google.com/fb/a/mailverify' expr:onsubmit='"window.open(\"http://feedburner.google.com/fb/a/mailverify?uri=" + data:feedPath + "\", \"popupwindow\", \"scrollbars=yes,width=550,height=520\"); return true"' method='post' target='popupwindow'>
        <table width='100%'>
          <tr>
            <td>
              <input class='follow-by-email-address' name='email' placeholder='Your Email Address...' type='text'/>
            </td>
            <td width='64px'>
              <input class='follow-by-email-submit' type='submit' value='Submit'/>
            </td>
          </tr>
        </table>
        <input expr:value='data:feedPath' name='uri' type='hidden'/>
        <input name='loc' type='hidden' value='en_US'/>
      </form>
    </div>
</div> <center><p>Berlangganan Artikel Dari <a expr:href='data:blog.homepageUrl'>Triple T</a> Dengan Cara Memasukan E-Mail Anda Pada Form Di Bawah Ini</p></center> <span class='item-control blog-admin'>
    <b:include name='quickedit'/>
</span>
</b:includable>
</b:widget>

jika anda ingin menambah tulisan di atas form simpan kode/tulisan anda sperti tulisan merah di atas
jika anda ingin menambah tulisan di bawah form simpan kode/tulisan anda sperti tulisan merah di atas

jadinya sperti ini

Berlangganan Artikel Dari Triple T Dengan Cara Memasukan E-Mail Anda Pada Form Di Bawah Ini

smoga bermanfaat...

Cara Membuat Contact Form Di Blog

Diposting oleh Unknown - 0 komentar

Nah, biasanya pemilik blog/website menaruh contact formnya di suatu halaman yang biasanya dinamai dengan "Contact Me / Kontak Saya". Sayangnya blogger/blogspot belum menyediakan halaman contact me secara default. Berbeda dengan blogger, Wordpress sudah menyediakan halaman contact me secara default. Tapi sobat blogger jangan khawatir, kita dapat membuat halaman contact me sendiri dan menggunakan contact form dari layanan external suatu situs. Oke, langsung saja kita ke Cara membuat Contact form di blog:

Langkah pertama, membuat contact form di blog

Pilih salah satu website penyedia contact form di bawah ini
- Email me form : http://emailmeform.com/
- Jotform : http://jotform.me/
- 123 Contact form : http://www.123contactform.com/
- Kontactr : http://kontactr.com/
Buatlah akun di website yang telah sobat pilih diatas. Lalu ikuti langkah - langkah untuk membuat contact form. Langkah-langkah yang diterangkan di website di atas sudah jelas sob, jadi saya tidak perlu menjelaskan lagi disini. Di website diatas, sobat dapat melakukan kostumisasi untuk contact form. Seperti menambah form, merubah tulisan form, merubah panjang dan lebar, merubah warna dan masih banyak lagi
Lalu, copy kode contact form yang telah sobat buat tadi. Disana terdapat beberapa opsi kode yang bisa sobat pilih. Untuk blog berplatform blogger/blogspot, sobat bisa memilih opsi kode html/javascript

Langkah kedua, membuat halaman contact me di blog

Masuk ke blogger menggunakan email dan password sobat. Jika sudah, lanjut ke langkah ke-2
Buatlah sebuah halaman posting baru dengan judul "Contact Me / Kontak Saya / Contact Us / lainnya yang sobat inginkan" lalu pilih Setelan entri > Pilihan > Beri tanda pada Jangan bolehkan mode tulis pada bagian Komentar pembaca. Namun, saya menyarankan agar sobat menggunakan halaman statis / pages (Untuk membuatnya masuk ke halaman Dasboard > Laman > Laman Baru > Laman Kosong). Karena, sobat tidak perlu lagi untuk menyeting lagi seperti halaman posting.
Klik kotak HTML pada pojok kiri atas
Masukan kode contact form yang sudah sobat buat tadi ke dalam kotak posting
Untuk melihat hasilnya, klik pada kotak Compose
Jika menurut sobat sudah beres bisa langsung klik Publikasikan
Copy linknya dan pasang di menubar / di bagian blog lain yang sobat suka
Selesai

Nah, cara membuat contact form di blog sangatlah mudah kan ? ok sob, kang reggy sudahi sampai disini dulu ok. Sampai Jumpa ;)

Memasang Related Post Linkwithin Dan Triknya

Diposting oleh Unknown - 2 komentar

Memasang Related post with thumbnail (Linkwithin) di blog

Nah, setelah sekian hari kang reggy istirahat tidak mengurus blog. Akhirnya, kang reggy kembali datang mengurus blog :D. Sekarang, kita akan mempelajari tentang bagaimana cara memasang related post with thumbnail dari Linkwithin. Linkwithin adalah situs penyedia widget related post bergambar untuk beberapa blog atau website. Pada posting sebelumnya juga, kang reggy pernah menjelaskan bagaimana cara memasang related post with scroll di bawah postingan. Fungsi dari related post with thumbnail ini sama dengan related post sebelumnya. Yaitu untuk mempermudah pengunjung blog sobat membaca postingan lainnya dan fungsi lainnya yaitu untuk meningkatkan pageview sobat. Nah, berikut penampakan dari related post with thumbnail (linkwithin)

Linkwithin akan membaca seluruh postingan sobat secara random. Bahkan, postingan yang belum pernah dilihat, akan ditampilkan oleh linkwithin. Jadi fiturnya bagus kan ;). Linkwithin biasanya dipasang di bawah postingan. Tampilan linkwithin, dapat menarik perhatian pengunjung untuk mengkliknya. Linkwithin melakukan generating gambar dari postingan yang dimuat, atau jika tidak ada gambar dalam suatu postingan, LinkWithin akan menampilkan gambar dasar berwarna abu-abu dan sedikit bertekstur. Nah, tertarik untuk memasangnya di blog sobat, so cek this out..

Cara memasang Related post with thumnail (linkwithin) di blog

Langsung saja sobat kunjungi situsnya di www.linkwithin.com/learn
Di bagian kanan, terdapat kolom pengisian untuk mendapatkan widget linkwithin
Isi alamat e-mail sobat dengan benar
Di kolom selanjutnya, isi dengan url blog/website sobat
Kemudian pilih platform blog sobat. Nah, langkah ini dilakukan jika sobat ingin memasang widget linkwithin secara mudah dan cepat
Pilih jumlah postingan/stories yang ingin ditampilkan
Jika blog sobat menggunakan tampilan yang gelap, centang saja pada "My blog has light text on a dark background"
Lalu klik Get Widget!
Dihalaman selanjutnya sobat akan dibimbing untuk memasang widget linkwithin sesuai dengan platform blog
Setelah itu di halaman Tata Letak, drag widget link within ke bawah postingan

Cara menghilangkan widget linkwithin di homepage
Bila sobat memasang widget link within menggunakan langkah cepat dan mudah. Hasilnya widget akan muncul di homepage. Jadi aneh terlihatnya, Selain itu, loading di homepage akan menjadi lambat dan berat. Nah, untuk menghilangkan widget linkwithin di homepage silahkan ikuti langkah - langkah di bawah ini:

Ikuti langkah-langkah mendapatkan widget linkwithin seperti biasa, namun menggunakan Platform Other
Lalu copy kodenya
Masuk ke halaman Template
Edit HTML lalu Lanjutkan
Cari kode </body> gunakan ctrl+f
Copy kode di bawah ini dan pastekan di atask kode </body>

<b:if cond='data:blog.pageType == "item"'>

Paste kode linkwithin disini
</b:if>
Simpan Template

Mengganti title standar LinkWithin "You Might Also Like"

Caranya:

Tata Letak

Edit HTML, centang Expand Widget Templates

Cari kode ]]></b:skin> dan

Letakkan kode script di bawah ini tepat dibawah kode ]]></b:skin>

<script>linkwithin_text='You might also like:'</script>

Keterangan:
Text yang berwarna Merah bisa anda ganti sesuai selera, Contoh: Ceck This Out, Anda Mungkin Menyukai Ini, Related Post dan lain-lain..

simpan template.

Sedangkan untuk menghilangkan link "Linkwithin" yang berada disebelah kanan bawah widget, caranya hampir sama seperti mengganti title standar "You Might Also Like", dan yang membedakannya hanya penempatan dan kode scriptnya saja.

Menghilangkan Link "Linkwithin"

Caranya:

Tata Letak

Edit HTML, centang Expad Widget Templates

Cari kode ]]></b:skin> dan

Letakkan kode script di bawah ini tepat diatas kode ]]></b:skin>

a#linkwithin_logolink_0 b {display:none; visibility:hidden;
height:0; overflow:hidden;}

Lalu Simpan template.

Selesai, selamat mencoba...!!!

Membuat Related Posts Dengan Thumbnail

Diposting oleh Unknown - 1 komentar

Berikut cara memasang artikel terkait dengan thumbnail.

Masuk ke akun Blogger Anda.
Klik Rancangan.
Klik tab Edit HTML.
Klik Download Template Lengkap, untuk berjaga-jaga kalau nanti terjadi kesalahan dalam mengedit template.
Beri tanda centang pada Expand Template Widget kamu.
Cari kode </head> Bila Anda menggunakan browser Mozilla Firefox, tekan tombol Ctrl + F, lalu isikan kode yang dimaksud untuk memudahkan pencarian.
Copy kode berikut dan paste di atas kode </head>

<b:if cond='data:blog.pageType == "item"'>
<style type="text/css">
#related-posts {
float:center;
text-transform:none;
height:100%;
min-height:100%;
padding-top:5px;
padding-left:5px;
}

#related-posts h2{
font-size: 1.6em;
font-weight: bold;
color: black;
font-family: Georgia, Times New Roman , Times, serif;
margin-bottom: 0.75em;
margin-top: 0em;
padding-top: 0em;
}
#related-posts a{
color:black;
}
#related-posts a:hover{
color:black;
}

#related-posts a:hover {
background-color:#d4eaf2;
}
</style>
<script type='text/javascript'>
var defaultnoimage="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhblBtTk3Y4yj964PQsM0xhPwUkWNw2xbBBdgRYJx3UhHDvj1exMMG3Scx88anD-UwJCBIGVgE-69UZ4F3nuVwz9PxGbhOK2pCj7V2aUoIwqav9EB3seqLk-_ASSdBBNiX_kqNW5x2HYs4/s400/noimage.png";
var maxresults=5;
var splittercolor="#d4eaf2";
var relatedpoststitle="Related Posts";
</script>
<script src='http://infonetmu.googlecode.com/files/related-posts-with-thumbnails-for-blogger-pro.js' type='text/javascript'/>
</b:if>
Cari kode <div class='post-footer-line post-footer-line-1'> atau <p class='post-footer-line post-footer-line-1'>
Copy kode berikut dan paste diatas kode <div class='post-footer-line post-footer-line-1'> atau <p class='post-footer-line post-footer-line-1'>

<b:if cond='data:blog.pageType == "item"'>
<div id='related-posts'>
<b:loop values='data:post.labels' var='label'>
<b:if cond='data:label.isLast != "true"'>
</b:if>
<script expr:src='"/feeds/posts/default/-/" + data:label.name + "?alt=json-in-script&callback=related_results_labels_thumbs&max-results=6"' type='text/javascript'/></b:loop>
<script type='text/javascript'>
removeRelatedDuplicates_thumbs();
printRelatedLabels_thumbs("<data:post.url/>");
</script>
</div><div style='clear:both'/>
</b:if>
<b:if cond='data:blog.url == data:blog.homepageUrl'><b:if cond='data:post.isFirstPost'>
<a href='http://infonetmu.blogspot.com/2011/12/cara-membuat-artikel-terkait-dengan.html'><img style="border: 0" alt="Cara membuat Artikel terkait dengan Thumbnail" src="http://image.bloggerplugins.org/blogger-widgets.png" /></a>
</b:if></b:if>
Klik tombol SIMPAN TEMPLATE.

Keterangan:

Anda dapat mengubah jumlah artikel terkait yang ingin ditampilkan dengan mengubah kode var maxresults=5;
Untuk mengubah judul widget, Anda dapat mengedit kode berikut var relatedpoststitle="Related Posts";
Bila ingin mengganti default thumbnail, edit kode berikut var defaultnoimage="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhblBtTk3Y4yj964PQsM0xhPwUkWNw2xbBBdgRYJx3UhHDvj1exMMG3Scx88anD-UwJCBIGVgE-69UZ4F3nuVwz9PxGbhOK2pCj7V2aUoIwqav9EB3seqLk-_ASSdBBNiX_kqNW5x2HYs4/s400/noimage.png";
Untuk mengubah warna dari Splitter Line, silakan edit kode var splittercolor="#d4eaf2";

Selamat mencoba..>->>
Sumber:( INFONETMU )

Membuat yahoo Emoticon New JS

Cara Pasang Facebook Like Otomatis di Postingan Blog

Membuat Tombol Back To Top

Mengubah Default Blockquote Menjadi Lebih Keren

Memodif Berlangganan Via E-Mail Default Blogger

Cara Membuat Contact Form Di Blog

Memasang Related Post Linkwithin Dan Triknya

Membuat Related Posts Dengan Thumbnail

Blog Tips

Stats And Rank

Followers

Recent Comments

Link Exchange

Random Post

Backlink Support