Berbagi Tutorial Bloggies: Twitter

Widget Timeline Twitter

<div dir="ltr" style="text-align: left;" trbidi="on">
<div style="text-align: justify;">
Cara memasang Widget Timeline Twitter di blog sangatlah mudah, karena Twitter sudah menyediakan fasilitas Widget. Jadi, kita tidak perlu menulis scriptnya sendiri. Kita hanya perlu mengisi Form dan mengikuti beberapa langkah sederhana dan Twitter akan secara otomatis mengenerate script widgetnya sehingga kita cukup perlu mencopy scriptnya di HTML/Javacript blog kita. Lihat juga: <a alt="Cara membuat widget burung twitter terbang berwarna-warni di blog" href="http://bertubies.blogspot.com/2015/03/widget-burung-twitter-terbang.html" target="_blank" title="Cara Memasang Widget Burung Twitter Terbang di Blog">Widget Burung Twitter Terbang di Blog</a>. Jangan lupa juga klik tombol follow di bawah ini :D<br />
<br /></div>
<div style="text-align: center;">
<span style="font-size: large;"><b>Preview
</b></span></div>
<div style="text-align: center;">
<a class="twitter-timeline" data-widget-id="417930142791368704" href="https://twitter.com/YuliaaargH">Tweets by @YuliaaargH</a>
<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+"://platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");</script></div>
<br />
<div style="text-align: justify;">
Berikut Langkah - langkahnya.</div>
<div style="text-align: justify;">
<br /></div>
<div style="text-align: justify;">
<span style="font-size: large;">Langkah Pertama, membuat Script Widget Timeline Twitter.</span></div>
<div style="text-align: justify;">
<br /></div>
<div style="text-align: justify;">
1. Login ke Akun Twitter Anda.</div>
<div style="text-align: justify;">
2. Klik "Setting".</div>
<div style="text-align: justify;">
3. Pilih "Widgets" (biasanya ada di tab paling bawah)</div>
<div style="text-align: justify;">
4. Selanjutnya klik tombol "Create New".</div>
<div style="text-align: justify;">
5. Pilih Source Widget Timelinenya, isi Formnya dan atur sesuai dengan keinginan Anda.</div>
<div style="text-align: justify;">
Penjelasan :</div>
<ul style="text-align: left;">
<li style="text-align: justify;">Pilih Apa yang akan Anda tampilkan di widgetnya nanti, apakah itu Timeline, Favorite, List atau Search.</li>
<li style="text-align: justify;">Pada form configuration Anda dapat mengatur Tinggi (Height), Tema (Theme), Warna Link (Link Color), dll.</li>
<li style="text-align: justify;">Kenapa cuma ada setting Height? karena Width (Lebar) widget Timeline Twitter ini akan secara otomatis menyesuaikan.</li>
</ul>
<div style="text-align: justify;">
6. Setelah Anda selesai mengatur konfigurasi widgetnya, Klik tombol "Create Widget" untuk membuat Script widgetnya. </div>
<div style="text-align: justify;">
7. Lalu Copy Scriptnya yang akan muncul di bawah "Preview".<br />
<br /></div>
<div style="text-align: justify;">
<br /></div>
<div style="text-align: justify;">
<span style="font-size: large;">Langkah Kedua, Memasang widget Timeline Twitter di Blog.</span></div>
<div style="text-align: justify;">
<br /></div>
<div style="text-align: justify;">
Login ke akun Blogger</div>
<div style="text-align: justify;">
<br /></div>
<div style="text-align: justify;">
1. Pilih Menu Tata Letak (Layout)</div>
<div style="text-align: justify;">
2. Selanjutnya Klik Tambah Gadget (Add a Gadget) di tempat dimana Anda ingin memasang widget Timeline Twitter.</div>
<div style="text-align: justify;">
3. Pilih Widget HTML/JavaScript.</div>
<div style="text-align: justify;">
4. Lalu Pastekan kode Script dari Twitter yang sudah dibuat tadi.</div>
<div style="text-align: justify;">
5. Klik tombol Simpan.</div>
<div style="text-align: justify;">
<br />
<br />
<div style="text-align: center;">
===</div>
<br />
<br /></div>
</div>

Widget Timeline Twitter

Cara memasang Widget Timeline Twitter di blog sangatlah mudah, karena Twitter sudah menyediakan fasilitas Widget. Jadi, kita tidak perlu m...

15:12

Widget Burung Twitter Terbang

<div dir="ltr" style="text-align: left;" trbidi="on">
<div style="text-align: justify;">
Cara memasang Widget Burung Twitter Terbang atau Flying Twitter Bird di blogger, mungkin tutorial ini sudah tidak asing lagi karena sudah banyak yang mengulas tentang pemasangan widget ini. Namun, tidak ada salahnya jika saya mencoba mengulas kembali cara membuat widget burung twitter ini dengan berbagai style dan warna yang berbeda-beda. Lihat juga: <a alt="Cara membuat widget timeline twitter di blog" href="http://bertubies.blogspot.com/2015/03/widget-timeline-twitter.html" target="_blank" title="Cara Memasang Widget Timeline Twitter di Blog">Cara Memasang Widget Timeline Twitter di Blog</a>. Dan jangan lupa follownya ya :D</div>
<br />
Pertama-tama Anda harus memiliki akun Twitter. Jika sudah punya, silakan ikuti tutorial di bawah ini.<br />
<br />
1. Login ke akun blog Anda.<br />
2. Klik Layout > Add A Gadget > HTML/ JavaScript<br />
3. Copy/ Paste kode berikut.<br />
<pre>
<script type="text/javascript" src="https://googledrive.com/host/0B7X69YyzZu-IZjFKQ19VVi10RlE/tripleflap.js"></script>
<script type="text/javascript">
var birdSprite="<span style="color: blue;">https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhAABpOi_Y5lmfLxoIa3Hwc0_HgdiPceznWfzXXbptHBfhbuwEjmY2cUtu5FCPvNffvSDcMA9Yr2XImTMD0V3SWk_rEFBwl0XOtVTb8tdwu6W0Zm12ANmsiy8RtLiDxeJI62k4YbTd97lI/s1600/burung+twitter+terbang.png</span>";
var targetElems=new Array("img","hr","table","td","div","input","textarea","button","select","ul","ol","li","h1","h2","h3","h4","p","code","object","a","b","strong","span");
var twitterAccount = "http://twitter.com/<span style="color: magenta;">YuliaaargH</span>";
var tweetThisText = "Twitter - UserID <span style="color: magenta;">http://bertubies.blogspot.com/</span>";
tripleflapInit();
</script></pre>
<br />
<div style="text-align: justify;">
4. Ganti tulisan berwarna<span style="color: magenta;"> pink </span>dengan <u>Username Twitter</u> dan <u>Link Blog</u> Anda.</div>
<div style="text-align: justify;">
5. Anda dapat mengganti warna burung twitter ini. Silakan ganti kode berwarna<span style="color: blue;"> biru</span> dengan kode di bawah ini sesuai dengan warna pilihan Anda.</div>
<br />
Warna <span style="color: red;"><b>Merah</b></span><br />
<pre>https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEipDNSSy9GFXAezg-30cvsTxA-xOOwBefbf1O14sE1YaInOODDOzzZQDPxXKeBNGFrwwu6NGHTWIKMD0qCElrxjLEvJlQ9dje3qRgRk8tCa3L2p9i9cU3HS18TM0A3lRN4QKhKZRhHpfQ0/s1600/red+bird.png</pre>
<br />
Warna <b style="background-color: black;"><span style="color: white;">Putih</span></b><br />
<pre>https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgMXSDrCKXFpFACZMd8F5eLCpGnaWoKIYX1LgpdVYUgJBCnlKuikHe7x9ZHFOWLu25zp6NKuleUo217_3Vm0xOJGlV3wp84njO3x84v5CuV4jKqr-3rak_fxE3wrA81tOQ_6AzV3anU1ec/s1600/white+bird.png</pre>
<br />
Warna <b><span style="color: #674ea7;">Ungu</span></b><br />
<pre>https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjzojuHRqzBguFZYqska1kHM6waOtHuI4S4uAclEwjTNNjamD3XC9Au8QB04kfksiioA5GSDMIzZlyg9NoVKfdqLKu9WE6szO2Yzagzc9VxSBinFc5_UUi0jDc5YB9t6Txt1DFvf7OCvM0/s1600/purple+bird.png</pre>
<br />
Warna <b><span style="color: lime;">Hijau</span></b><br />
<pre>https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhWb0fF84EiHvXATIPtFtHsm8Jkt5_x6ZNPMC6U5mJRz1divD1ID_2togJ4yBJ3gqCPRIyhZBthyphenhyphen7hmrPuIwwPGmuArwEN2d9jut8mHqwPemF0bCFmKy2EIMkaix2nw98z08lBEG5JuDUk/s1600/Green+bird.png</pre>
<br />
Warna <b><span style="color: #783f04;">Coklat</span></b><br />
<pre>https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhhtQgDdDk4dHoteVHMcFlrp96kXIQUP_-OY3Qy6IEC3Gazjph6hyphenhyphenfVbLGCm78gMZkm0SsZGraNJtLqFQCYFV89oGX-EiZOfidqWSUfvxJaRxtqKCG1yOIKNBZRKG7n4w6olci1tkRGQTg/s1600/brown+bird.png</pre>
<br />
Warna <b><span style="color: blue;">Biru</span></b><br />
<pre>https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiAFVNpRFE3SV0s3EFmPj0bevgXE7IlDFW-wNmK-Bd-icgoDAhmSvfzTy1JnTFj-ipmoADJXTVrNmd64DLmHKeBXDgDMp-puzJGm22OhE0vqc1CnAm1OvjXZ-1JJt8CYCVzU7Gpyc7S2fs/s1600/Blue+bird.png</pre>
<br />
Warna<b> Hitam</b><br />
<pre>https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjOXcYypx8GnFV2Hvq6HmTmA7D8fGimXBI4CiDiWaHgwKTuBkJvP71CkU7dz1_UI3OtXdKILNiOn7kpj3un_Rq9rikSr39mZbvKA67hEub6UMAdHjlY7Sy0gnyY8xs6cJ6PsDvJiBOXIBw/s1600/black+bird.png</pre>
<br />
Warna <b><span style="color: #f1c232;">Kuning</span></b><br />
<pre>https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgwxukY1ATiG5jAvytxY_J6OcHcPR712DCRfhGSMKOXqby7y0J4kaXCMLqVV6L_9b7ltoeHgsAY2xgQ4xesbAd6BTFMWcHcArkrUphY7VYvwA6jREosWcibNaI_bBesAEKiW7dBH6fgxcM/s1600/yellow+bird.png</pre>
<br />
<br />
6. Save dan lihat hasilnya.<br />
<br />
<br />
<div style="text-align: center;">
===</div>
<br />
<br /></div>

Widget Burung Twitter Terbang

Cara memasang Widget Burung Twitter Terbang atau Flying Twitter Bird di blogger, mungkin tutorial ini sudah tidak asing lagi karena sudah ...

14:28

Berbagi Tutorial Bloggies

Widget Timeline Twitter

Widget Burung Twitter Terbang

Popular Posts

Blog Archive