Efek bayangan seperti cermin pada sebuah gambar atau teks
sudah bisa dibuat dengan menggunakan css, lebih tepatnya css3 reflect,
bagi kalian yang tidak begitu mahir dalam penggunaan software gambar
seperti Adobe Photoshop, css3 reflect bisa menjadi solusi untuk membuat
efek cermin untuk gambar, untuk menghasilkan efek cermin atau bayangan
tidak membutuhkan kode css yang panjang, tidak seperti membuat efek-efek
css3 pada umumnya.
-----------------------------------------------------------------------------------------------
Sabtu, 10 Januari 2015
Header menjadi dua bagian menyamping
Cara Membuat Header Menjadi 2 Kolom. pastinya
menarik bukan ? dengan ini kita jadi bisa membuat header blog kita
menjadi lebih ramai dan menarik. apasih membuat header menjadi dua kolom
? yaitu kita membuat yang tadinya header hanya 1 kolom, dan sekarang
menjadi 2 kolom seperti gambar di samping ini. di blog-blog/web-web
biasanya elemen yang kanan digunakan memasang Iklan atau gambar. nanti
hasil-nya seperti tampilan header kiri di blog saya ini. langsung aja
ini dia langkah-langkahnya :
memberi keterangan gambar bila disoot mouse
Memberi keterangan gambar pada post image akan membantu pembaca
untuk mengetahui penjelasan dari gambar yang dimaksud, efek hover yang
ditampilkan pada keterangan gambar berbentuk slide dari arah kiri ke
arah kanan dan sebagai alternatif pilihan, efek hover ini bisa dari
bawah ke atas, dan script yang digunakan menggunakan css level 3.
Menambahkan keterangan gambar pada post, tentu saja akan mempercantik tampilan blog, terutama untuk tampilan post. Script ini sangat cocok digunakan bagi mereka yang mempunyai blog dengan banyak penggunaan gambar sebagai penambah keterangan suatu posting (artikel). Kelebihan script ini karena menggunakan css, tentu saja penggunaannya mudah dan untuk hover keterangan gambar pun akan menyesuaikan ukuran dari gambar yang ditampilkan.
Menambahkan keterangan gambar pada post, tentu saja akan mempercantik tampilan blog, terutama untuk tampilan post. Script ini sangat cocok digunakan bagi mereka yang mempunyai blog dengan banyak penggunaan gambar sebagai penambah keterangan suatu posting (artikel). Kelebihan script ini karena menggunakan css, tentu saja penggunaannya mudah dan untuk hover keterangan gambar pun akan menyesuaikan ukuran dari gambar yang ditampilkan.
Jumat, 09 Januari 2015
kode membuat Teks area pada postingan
ingin tampilan seperti ini, silakan kembangkan dan modifikasi sendiri hehe
berikut kodenya, (gunakan entri html)pd blog entri baru..
<form name="Dalang Error"> <div align="center"> <input onclick="javascript:this.form.txt.focus();this.form.txt.select();" type="button" value="Select All" /> </div> <div align="center"> <textarea name="txt" style="height: 50px; width: 300px;">isi text area</textarea></div> </form>
semoga bemanfaat...
Contoh Kode sudut lengkung border
Contoh Border 1
.border-1 {
-webkit-border-radius: 7px;
-moz-border-radius: 7px;
border-radius: 7px;
border: 2px solid #A89D61;
}
Contoh Border 2
.border-2 {
-moz-border-radius-topleft: 30px;
-moz-border-radius-bottomright: 30px;
-webkit-border-top-left-radius: 30px;
-webkit-border-bottom-right-radius: 30px;
border: 2px solid #A89D61;
}
Contoh Border 3
.circle {
-moz-border-radius: 80px;
-webkit-border-radius: 80px;
border-radius: 80px;
border: 2px solid #A89D61;
background:#D2CCAD;
width: 150px;
height: 150px;
}
Gantilah bagian warna bagian border sesuai dengan keinginan, untuk mempermudah pencarian warna yang sesuai, kalian bisa pergunakan tools warna pada bagian menu diatas.
BORDER-1
.border-1 {
-webkit-border-radius: 7px;
-moz-border-radius: 7px;
border-radius: 7px;
border: 2px solid #A89D61;
}
Contoh Border 2
BORDER-2
.border-2 {
-moz-border-radius-topleft: 30px;
-moz-border-radius-bottomright: 30px;
-webkit-border-top-left-radius: 30px;
-webkit-border-bottom-right-radius: 30px;
border: 2px solid #A89D61;
}
Contoh Border 3
CIRCLE
.circle {
-moz-border-radius: 80px;
-webkit-border-radius: 80px;
border-radius: 80px;
border: 2px solid #A89D61;
background:#D2CCAD;
width: 150px;
height: 150px;
}
Gantilah bagian warna bagian border sesuai dengan keinginan, untuk mempermudah pencarian warna yang sesuai, kalian bisa pergunakan tools warna pada bagian menu diatas.
Membuat garis lengkung pada sudut garis tepi atau border
Dengan hadirnya css3 untuk membuat sudut garis border lengkung atau tumpul
sudah bisa dilakukan, dengan design tampilan garis lengkung pada border
bisa menghasilkan tampilan blog yang elegant, manis dan menarik.
Penggunaan kode css garis border lengkung adalah dengan menggunakan kode border-radius, penggunaan dalam template saya ilustrasikan sebagai berikut :
Penggunaan kode css garis border lengkung adalah dengan menggunakan kode border-radius, penggunaan dalam template saya ilustrasikan sebagai berikut :
Membuat Header 3 elemen
Membagi header menjadi 3 elemen langsung saja pesiapkan kode css berikut untuk dicopy pastekan:
Kode CSS-1:
.GRnewHeader .widget h2.title, .GRnewHeader .widget h2{ font-size:14px; text-transform:uppercase; font-weight:600; margin:10px; } .GRnewHeader .widget{ padding:10px; font-size:12px; background: -moz-linear-gradient(top, rgba(255,255,255,0.1) 0%, rgba(255,255,255,0.1) 1%, rgba(153,151,151,0.1) 100%); background: -webkit-linear-gradient(top, rgba(255,255,255,0.1) 0%,rgba(255,255,255,0.1) 1%,rgba(153,151,151,0.1) 100%); background: -o-linear-gradient(top, rgba(255,255,255,0.1) 0%,rgba(255,255,255,0.1) 1%,rgba(153,151,151,0.1) 100%); background: -ms-linear-gradient(top, rgba(255,255,255,0.1) 0%,rgba(255,255,255,0.1) 1%,rgba(153,151,151,0.1) 100%); background: linear-gradient(top, rgba(255,255,255,0.1) 0%,rgba(255,255,255,0.1) 1%,rgba(153,151,151,0.1) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#1affffff', endColorstr='#1a999797',GradientType=0 ); margin:5px; }
Menambahkan elemen diatas header blog
langsung aje: copas juga hehe
- Login ke Blogger
- Halaman Dasbor (Dasboard).
- Klik Rancangan (Design).
- Klik Edit HTML.
- Backup template. Buka panduan backup template di sini !.
- Cari kode <header>. Panuduan cara mencari kode html di template dapat anda buka di sini !.
- Copy dan paste-kan kode HTML berikut tepat di atas kode <header>. Kode HTML dan tag <header> akan berbentuk seperti ini:
Membagi kolom header menjadi 2 kolom
Oke langsung aja, caranya seperti berikut:
- Login pada pada Blogger menggunakan id blog sobat
- Template
- Edit HTML lalu Lanjutkan
- pertama - tama cari kode #header-wrapper { atau lebih lengkapnya mirip seperti di bawah ini
Rabu, 07 Januari 2015
Membuat Headline Post pada blog dengan Feedburner
Menambahkan headline news ke blog dan mywapblog, membuat
headline news di blog dan mywapblog, memasang headline news blog dan
mywapblog, headline news feed untuk blog dan mywapblog
Untuk membuat headline news atau juga di sebut random post yang akan menampilkan judul postingan secara random atau acak di blog kita. Widget yang akan di buat ini kita menggunakan animator headline dari feedburner.com aplikasi dari google.
Untuk membuat headline news atau juga di sebut random post yang akan menampilkan judul postingan secara random atau acak di blog kita. Widget yang akan di buat ini kita menggunakan animator headline dari feedburner.com aplikasi dari google.
TIPS LOADING BLOG AGAR TIDAK BERAT/LAMA
Pengunjung blog akan
malas mengunnjungi blog kita lagi jika loading blog kita manjadi berat.
Nahh , berikut Tipsnya:
Kurangi Widget yang tidak pentingSumber : BLOG KANG MOEZHA
Menurut saya pakailah widget yang menurut anda penting , seperti Alexa, G+1 dan yang lainnya. Nahh , apa saja widget yang tidak penting tersebut ? Widget tersebut seperti peta pengunjung, jumlah pengunjug dan lagu atau video.
Template
Gunakanlah template yang simple, padat dan tidak berat . Karena , kebanyak template sekarang sudah banyak yang ditambah-tambahkan kode tertentu dan itu juga dapat membuat loading blog menjadi berat
Cek kembali Link keluar dan Masuk yang terdapat di Artikel dan Blogroll
Ceklah kembali link keluar dan masuk , siapa tau link tersebut sudah tidak berfungsi . Karena , jika link yang tidak berfungsi tersebut tidak dihapus , itu dapat memperberat loading blog kita.
Perkecil format gambar Blog
Gambar yang terdapat di blog saran saya menggunakan format jpg, png, dan gif saja. Karena , ketiga format tersebut tidak berat.
MENGETAHUI KECEPATAN Loading BLOG
Kunjungi Google Developer Page Speed Insight
https://developers.google.com/
Tulis URL Blog kalian di kotak bawah ini :
Lalu Klik ANALYZE
Tunggu beberapa detik...
Dan akan muncul seperti ini
Angka 95 adalah kecepatan loading Blog kita. kecepatan loading ini maksimal sampai angka 100
Jadi , usahakan agar loading Blog anda Normal yaitu mencapai angka 90 keatas
NB : Saya memberitau bahwa kecepatan loading Blog saya adalah 85 dari 100
SUMBER "Kopi Manis" : Blog Kang MOZHA hehe..
https://developers.google.com/
Tulis URL Blog kalian di kotak bawah ini :
Lalu Klik ANALYZE
Tunggu beberapa detik...
Dan akan muncul seperti ini
Angka 95 adalah kecepatan loading Blog kita. kecepatan loading ini maksimal sampai angka 100
Jadi , usahakan agar loading Blog anda Normal yaitu mencapai angka 90 keatas
NB : Saya memberitau bahwa kecepatan loading Blog saya adalah 85 dari 100
SUMBER "Kopi Manis" : Blog Kang MOZHA hehe..
Cara daftar WEBSITE/BLOG di mesin telusur google, yahoo,bing, Ask,Baidu
Sebelum kita menerapkan teknik seo model
apapun, misal seo onpage dan seo offpage, sebaiknya kita harus
menerapkan teknik seo dasar yang disediakan oleh mesin pencari atau
mesin telusur. Tujuannya adalah agar mesin pencari tahu bahwa anda
mempunyai blog/website. Sehingga mesin pencari akan mudah menampilkan
artikel postingan blog kita di halaman pertama hasil pencarian atau
penelusuran.
Apabila kita keburu menerapkan teknik seo yang lain tanpa memberitahukan terlebih dahulu ke mesin pencari, maka hasil penelusuran tidak akan sempurna karena mesin pencari tidak diberitahu kalau anda punya blog, sehingga artikel postingan anda tetap akan jauh dari halaman pertama. Mengapa? Karena blog anda tidak mau berkenalan dengan mesin telusur.
Apabila kita keburu menerapkan teknik seo yang lain tanpa memberitahukan terlebih dahulu ke mesin pencari, maka hasil penelusuran tidak akan sempurna karena mesin pencari tidak diberitahu kalau anda punya blog, sehingga artikel postingan anda tetap akan jauh dari halaman pertama. Mengapa? Karena blog anda tidak mau berkenalan dengan mesin telusur.
Senin, 05 Januari 2015
Memasang tombol FOLLOW dan DASHBOARD di blog
Cara Memasang / Membuat Tombol Follow dan Dashboard di Blog - Bila sobat melihat pada bagian atas sebelah kanan blog ini, maka sobat akan melihat tampilan 2 tombol
dengan fungsinya masing masing. Tombol dashboard yang sebenarnya sudah
ada pada navbar blogger berfungsi sebagai jalan pintas bagi sang admin
untuk menuju dashboard nya dan tombol follow yang berfungsi memudahkan
orang / blogger untuk men - follow blog kita.
Bagi sobat yang tertarik untuk memasang tombol follow dan dashboard di blog silahkan ikuti tutorial berikut:
Bagi sobat yang tertarik untuk memasang tombol follow dan dashboard di blog silahkan ikuti tutorial berikut:
Pasang TV Online pada Blog
Cara Memasang Tv Online Streaming di Blog
- Selalu ada yang baru di dunia blog, setelah bisa memasang animasi di
blog, memasang lagu di blog, kini dengan kecanggihan teknologi sobat
bisa memasang TV online di blog ( nonton
sambil ngeblog ) entah itu RCTI, SCTV, TRANS TV, TRANS 7, GLOBAL TV, MNC
TV, KOMPAS TV, INDOSIAR, ANTV, TV ONE, dan lain - lain. Tutorial yang
seperti ini bisa dengan mudah sobat temukan di google dengan kata kunci "cara pasang tv ( televisi ) di blogspot". Berikut tutorial cara pasang TV di blog bagi sobat yang berminat.
Membuat Menu Herisontal
Silahkan ikuti tutorial singkat berikut untuk membuat menu animasi mendatar dengan CSS3.
berikut
DEMO
dari sumber artikel yang saya dapat
1. Login ke akun blogger sobat
2. Klik Rancangan --> Edit HTML
3. Letakkan kode berikut di atas kode ]]></b:skin>
berikut
DEMO
dari sumber artikel yang saya dapat
1. Login ke akun blogger sobat
2. Klik Rancangan --> Edit HTML
3. Letakkan kode berikut di atas kode ]]></b:skin>
Mempercepat Loading Blog
Loading blog yang lemot memang kadang kala sering membuat kita kesal,
bayangkan saja jika kita harus menunggu bermenit - menit untuk membuka 1
halaman saja.. huh pasti membosankan tu... Sekedar info, sebenarnya
selain faktor perangkat, faktor utama mengapa loading blog kita itu bisa
sampai lambat yaitu karna jumlah widget yang terlalu banyak. Untuk
memperindah tampilan blog, biasanya kita memasang jam, kalender, dan
berbagai macam animasi yang sebenarnya tidak terlalu berguna bahkan
hanya akan membuat pengunjung blog bosan dengan tampilan blog yang
terlalu norak plus loading blog yang lemot.
Setelah sebelumnya memposting artikel tentang cara memasang emoticon onion di kotak komentar blog, kali ini saya akan kasih beberapa tips singkat untuk mempercepat loading blog. Simak tutorialnya berikut.
Setelah sebelumnya memposting artikel tentang cara memasang emoticon onion di kotak komentar blog, kali ini saya akan kasih beberapa tips singkat untuk mempercepat loading blog. Simak tutorialnya berikut.
Cara pasang fibox untuk chat pada blog
Bagi sobat yang tertarik memasangnya, ikuti langkah - langkah berikut :
Membuat ChatBox Buku Tamu auto hide
Auto hide Shuotbox adalah efek yang akan membuat buku tamu muncul tanpa di klik
dan tersembunyi tanpa di klik pula ( di lewati pointer mouse ), hanya
beda sedikit dengan buku tamu show / hide. Sobat yang tertarik memasang
widget ini, silahkan masukkan kode berikut di HTML/Javascript blog sobat.
<style type="text/css">
#gb{
position:fixed;
top:20px;
z-index:+1000;
}* html #gb{position:relative;}
.gbtab{
height:150px;
width:50px;
float:left;
background:url('http://i1108.photobucket.com/albums/h405/christian410/ghtrf.png') no-repeat;
}
.gbcontent {
float:left;
border:1px solid #000000;
-moz-border-radius-bottomleft:5px;
-webkit-border-radius-bottomleft:5px;
-o-border-radius-bottomleft:5px;
-khtml-border-radius-bottomleft:5px;
-moz-border-radius-topright: 5px;
-moz-border-radius-topleft: 5px;
background: #F2F2F2; url() no-repeat bottom;
padding:10px;
}
</style>
<script type="text/javascript">
function showHideGB(){
var gb = document.getElementById("gb");
var w = gb.offsetWidth;
gb.opened ? moveGB(0, 51-w) : moveGB(30-w, 0);
gb.opened = !gb.opened;
}function moveGB(x0, xf){
var gb = document.getElementById("gb");
var dx = Math.abs(x0-xf) > 25 ? 25 : 1;
var dir = xf>x0 ? 1 : -1;
var x = x0 + dx * dir;
gb.style.right = x.toString() + "px";
if(x0!=xf){setTimeout("moveGB("+x+", "+xf+")", 5);}
}</script>
<div id="gb">
<div class="gbtab" onmouseover="showHideGB()"> </div>
<div class="gbcontent">
<center>
<div style="text-align:center">
<span style="float:right; color:#000000;">Get this <a target="_blank" href="http://christiantatelu.blogspot.com/2012/03/cara-membuat-buku-tamu-auto-hide-di.html"> widget! </a></span>
</div>
</center></div>
<script type="text/javascript">
var gb = document.getElementById("gb");
gb.style.right = (50-gb.offsetWidth).toString() + "px";
</script>
</div>
#gb{
position:fixed;
top:20px;
z-index:+1000;
}* html #gb{position:relative;}
.gbtab{
height:150px;
width:50px;
float:left;
background:url('http://i1108.photobucket.com/albums/h405/christian410/ghtrf.png') no-repeat;
}
.gbcontent {
float:left;
border:1px solid #000000;
-moz-border-radius-bottomleft:5px;
-webkit-border-radius-bottomleft:5px;
-o-border-radius-bottomleft:5px;
-khtml-border-radius-bottomleft:5px;
-moz-border-radius-topright: 5px;
-moz-border-radius-topleft: 5px;
background: #F2F2F2; url() no-repeat bottom;
padding:10px;
}
</style>
<script type="text/javascript">
function showHideGB(){
var gb = document.getElementById("gb");
var w = gb.offsetWidth;
gb.opened ? moveGB(0, 51-w) : moveGB(30-w, 0);
gb.opened = !gb.opened;
}function moveGB(x0, xf){
var gb = document.getElementById("gb");
var dx = Math.abs(x0-xf) > 25 ? 25 : 1;
var dir = xf>x0 ? 1 : -1;
var x = x0 + dx * dir;
gb.style.right = x.toString() + "px";
if(x0!=xf){setTimeout("moveGB("+x+", "+xf+")", 5);}
}</script>
<div id="gb">
<div class="gbtab" onmouseover="showHideGB()"> </div>
<div class="gbcontent">
<center>
<!-- BEGIN CBOX - www.cbox.ws - v001 -->
<div id="cboxdiv" style="text-align: center; line-height: 0">
<div><iframe
frameborder="0" width="300" height="275"
src="http://www4.cbox.ws/box/?boxid=4100717&boxtag=ebc39c&sec=main"
marginheight="2" marginwidth="2" scrolling="auto"
allowtransparency="yes" name="cboxmain4-4100717" style="border:#FFFFFF
1px solid;" id="cboxmain4-4100717"></iframe></div>
<div><iframe
frameborder="0" width="300" height="75"
src="http://www4.cbox.ws/box/?boxid=4100717&boxtag=ebc39c&sec=form"
marginheight="2" marginwidth="2" scrolling="no" allowtransparency="yes"
name="cboxform4-4100717" style="border:#FFFFFF 1px
solid;border-top:0px"
id="cboxform4-4100717"></iframe></div>
</div>
<!-- END CBOX -->
<br /><div style="text-align:center">
<span style="float:right; color:#000000;">Get this <a target="_blank" href="http://christiantatelu.blogspot.com/2012/03/cara-membuat-buku-tamu-auto-hide-di.html"> widget! </a></span>
</div>
</center></div>
<script type="text/javascript">
var gb = document.getElementById("gb");
gb.style.right = (50-gb.offsetWidth).toString() + "px";
</script>
</div>
Memasang menu Accordion Vertikal pada blog
Cara Memasang Menu Accordion di Blog
- Cara Memasang, Membuat atau Membikin Menu Accordion di Blogspot ini
adalah re-post dari posting lawas saya yang berjudul cara membuat menu
accordion blogger yang nggak masuk ke hatinya om gugel. Karna itu
diharapkan mudah - mudahan dengan Re-post ( posting ulang ) ini, artikel
saya yang telah saya hapus tersebut bisa terindeks lagi meskipun dengan
URL yang berbeda.
Menu Accordion adalah berupa susunan menu yang di susun secara vertikal, tentulah berbeda sekali dengan menu horisontal ( baca : cara membuat menu horisontal di blog )yang biasa sobat jumpai, mungkin ini adalah salah satu solusi menyembunyikan widget yang terlalu banyak di halaman blog sobat. Sobat yang tertarik pasang menu accordion di blogger, silahkan ikuti tutorial berikut.
Menu Accordion adalah berupa susunan menu yang di susun secara vertikal, tentulah berbeda sekali dengan menu horisontal ( baca : cara membuat menu horisontal di blog )yang biasa sobat jumpai, mungkin ini adalah salah satu solusi menyembunyikan widget yang terlalu banyak di halaman blog sobat. Sobat yang tertarik pasang menu accordion di blogger, silahkan ikuti tutorial berikut.
Bikin Blog Jadi Dofollow
Cara Bikin Blog Menjadi Dofollow
Cara Bikin Blog Menjadi Dofollow - Inilah postingan yang sudah lama ingin ane pos namun selalu saja kelupaan. kali ini saya akan kasih tutorial bagaimana cara bikin blog nofollow menjadi dofollow,
cukup dengan merubah beberapa kode maka blog sobat akan langsung beruba
menjadi dofollow, namun sebelumnya silahkan cek dulu apakah blog sobat
dofollow atau nofollow ( baca : cara mengetahui blog dofollow atau nofollow ). Sobat yang tertarik mengubah blognya dari nofollow menjadi dofollow silahkan ikuti tutorial tips dan trik berikut.
Cara Menampilkan Judul Postingan saja pada blog homepage
Menampilkan Judul Artikel / Posting Saja di Homepage - Apa kabar sobat blogger? pada kesempatan kali ini kita akan coba membahas tentang bagaimana cara membuat judul artikel saja yang tampil di halaman depan blog. Tutorial kali ini sebenarnya berfungsi hampir sama dengan readmore ( baca : cara memasang readmore di blog
) namun jika readmore menampilkan judul artikel berserta ringkasan
artikel, maka yang ini hanya akan menampilkan judul artikel ( posting )
saja. Bagi sobat yang tertarik, silahkan ikuti tutorial berikut.
Mendaftarkan Blog Ke Search Engine Google:
Cara nya:
1. Pertama login dahulu ke akun Google Sobat
2. Kemudian unjungi link ini https://www.google.com/webmasters/tools/submit-url
3. Masukkan url blog sobat dan tuliskan kode captha yang terlihat di layar
![]() |
Cara Mendaftarkan Blog ke Google |
4. Kemudian klik kirim permintaan
5. Selesai deh cara mendaftarkan blog ke google tersebut
Blog sobat kemudian akan di proses dan di indeks dalam waktu kurang lebih 48 jam. Nah saat ini yang perlu sobat lakukan ialah posting artikel minimal seminggu 2 sampai 3 postingan cukup yang penting tetap upto date. Buatlah postingan yang cukup berkualitas dan bukan hanya hasil copy paste dari blog milik orang lain. Semoga tips cara mendaftarkan blog ke search engine google ini bisa bermanfaat yah, jangan lupa untuk berkomantar.
Recent box berjalan otomatis
Cara Membuat Recent Post Berjalan di Blog - Recent post atau dalam bahasa indonesianya posting terakhir atau artikel terkini adalah widget yang bisa sobat pasang di blog dengan tujuan memberikan informasi tentang postingan atau artikel terkini.
Recent post biasanya menampilkan sejumlah judul artikel yang belum lama sobat posting dalam deretan ke bawah dan tak jarang juga ada yang bergerak ( animasi ) ke bawah. Contohnya sobat bisa lihat di sidebar blog ini.
Kali ini saya akan kasih tahu bagaimana cara memasang recent post di blog. Sobat yang berminat silahkan ikuti tutorial berikut.
1. Log in ke akun blog sobat.
2. Klik rancangan --> Elemen laman --> Tambah gadget --> HTML/Javascript
3. Masukkan kode berikut ke dalam konten.
4. Klik save dan lihat hasilnya.
Recent post biasanya menampilkan sejumlah judul artikel yang belum lama sobat posting dalam deretan ke bawah dan tak jarang juga ada yang bergerak ( animasi ) ke bawah. Contohnya sobat bisa lihat di sidebar blog ini.
Kali ini saya akan kasih tahu bagaimana cara memasang recent post di blog. Sobat yang berminat silahkan ikuti tutorial berikut.
1. Log in ke akun blog sobat.
2. Klik rancangan --> Elemen laman --> Tambah gadget --> HTML/Javascript
3. Masukkan kode berikut ke dalam konten.
<style type="text/css">
#rp_plus_img{height:377px;}
#rp_plus_img li {height:60px;padding:5px;list-style:none;
background-color:#ffffff;
border:solid 1px #000000;}
#rp_plus_img a{color:#00000;}
#rp_plus_img .news-title{display:block;font-weight:bold ;margin-bottom:4px;font-size:11px;
text-align:justify;
-moz-border-radius: 5px;}
#rp_plus_img img{float:left;margin-right:14px;padding:4px;border:solid 1px #00000;width:55px;height:55px;}
</style>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js" type="text/javascript">
</script>
<script src="https://sites.google.com/site/unwanted86/javascript/recentpost.js" type="text/javascript">
</script>
<script type="text/javascript">
var speed = 1500;
var pause = 3500;
$(document).ready(function(){
rpnewsticker();
interval = setInterval(rpnewsticker, pause);
});
</script>
<ul id="rp_plus_img"><script>
var numposts = 5;
var numchars = 0;
</script> <script src="/feeds/posts/default?orderby=published&alt=json-in-script&callback=rpthumbnt">
</script> </ul>
<small><a href="http://christiantatelu.blogspot.com/2012/03/cara-membuat-recent-post-berjalan-di.html" target="_blank">get this widget here</a></small>
#rp_plus_img{height:377px;}
#rp_plus_img li {height:60px;padding:5px;list-style:none;
background-color:#ffffff;
border:solid 1px #000000;}
#rp_plus_img a{color:#00000;}
#rp_plus_img .news-title{display:block;font-weight:bold ;margin-bottom:4px;font-size:11px;
text-align:justify;
-moz-border-radius: 5px;}
#rp_plus_img img{float:left;margin-right:14px;padding:4px;border:solid 1px #00000;width:55px;height:55px;}
</style>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js" type="text/javascript">
</script>
<script src="https://sites.google.com/site/unwanted86/javascript/recentpost.js" type="text/javascript">
</script>
<script type="text/javascript">
var speed = 1500;
var pause = 3500;
$(document).ready(function(){
rpnewsticker();
interval = setInterval(rpnewsticker, pause);
});
</script>
<ul id="rp_plus_img"><script>
var numposts = 5;
var numchars = 0;
</script> <script src="/feeds/posts/default?orderby=published&alt=json-in-script&callback=rpthumbnt">
</script> </ul>
<small><a href="http://christiantatelu.blogspot.com/2012/03/cara-membuat-recent-post-berjalan-di.html" target="_blank">get this widget here</a></small>
4. Klik save dan lihat hasilnya.
sumber
Cara Membuat Recent Post Berjalan di Blog
Belajar Pemograman Delphi dengan Delphi 7
Buku ni ditulis oleh bapak Edi Nugroho M.Kom. berisi seperti tersebut dalam daftar isi dibawah ini. Ane juga dapat download, tapi udah lupa sumbernya dari mane, ni ane sekalian ajar, ane bagi bagi lagi ane upload siapa tau bermanfaat, sekalian simpen arsip sendiri..hehe..sebelumnya trimakasih buat penulis buku ini pak Edi Nugroho M kom,maaf ane sharing gak ijin2.
DAFTAR ISI
KATA
PENGANTAR
DAFTAR ISI
BAB 2 DELPHI
Apa itu
Delphi ? 1
Lingkungan
Delphi. 1
Code Editor 2
Form 3
Component
Pallete 4
Object
Inspector 5
Watch List 6
Tombol-tombol
ShortCut 6
Bekerja
dengan Delphi 6
Membuat
proyek aplikasi baru 6
Menyimpan
proyek aplikasi 7
Memasukkan
komponen ke dalam form 8
Mengubah isi
properti komponen di Form 8
Mengubah
lokasi komponen di Form 11
Mengubah
ukuran komponen di Form 11
Membuat
event handler 12
MEMBUAT
APLIKASI KASIR TOKO BUAH 14
BAB 3
ARSITEKTUR APLIKASI DATABASE 18
Database 19
Database
local versus database remote 21
Transactions 21
Arsitektur
Aplikasi Pengolah Database 22
Koneksi
database 22
BDE (Borland
Database Engine) 22
dbExpress 23
ADO 23
Dataset 23
Data Source 25
User
Interface 25
BAB 4
MEMBUAT APLIKASI DATABASE MENGGUNAKAN BDE 27
MENGGUNAKAN
BDE 28
Membuat
AplikasiBDE1 28
Membuat
AplikasiBDE2. 33
BAB 5
MEMBUAT ALIAS DAN MENGATUR KONFIGURASI BDE 37
Alias 38
Membuat
Alias 38
BAB 6 STUDI
KASUS : SISTEM INFORMASI PERSONALIA SEDERHANA 42
Diagram
UseCase 42
Dokumen
Skenario 42
Diagram
Kelas 44
Pembahasan 44
BAB 7
MEMBUAT TABEL DAN MENGISI TABEL. 46
Membuat
tabel (Create) 47
Membuat
tabel secara programming 48
Mengisi
Tabel (Insert) 56
Menambahkan
sub menu berkas. 56
Mengolah
Tabel Golongan 57
Menguji
input 61
Menguji
input secara program 61
Exceptions 62
Menguji
input menggunakan event OnExit 63
Menguji
input menggunakan BeforePost 63
Mengolah
data Bagian 65
Mengolah
data Pegawai 68
Menguji
input menggunakan field dari tabel lain. 71
BAB 8
MENCARI RECORD DAN MENYARING RECORD 74
Mencari
record 75
FindKey 75
FindNearest 75
Locate 76
Lookup 76
Membuat
aplikasi Presensi 77
Menyaring
record 79
Relasi
Master-Detail 80
Menyaring
record menggunakan properti Filter 85
BAB 9
CALCULATED FIELD dan LOOKUP FIELD 91
Calculated
Field 92
Lookup Field 92
BAB 10
POSTGRESQL 103
Sejarah
PostgreSQL 104
Memperoleh
PostgreSQL 105
Instalasi
PostgreSQL 105
Memasang
PostgreSQL 106
BAB 11 Structured
Query Language (SQL) 112
SQL 113
Komponen SQL 113
Data
Definition Language (DDL) 113
CREATE TABLE 113
CREATE VIEW 114
ALTER TABLE 115
DROP TABLE
dan DROP VIEW 116
Data
Manipulation Language (DML) 116
INSERT 116
SELECT 116
UPDATE 117
DELETE 118
BAB 12
MEMBUAT KONEKSI KE REMOTE DATABASE 119
Membuat
koneksi ke server 120
Menggunakan
BDE 120
Menggunakan
ODBC 122
Menggunakan
dbExpress 124
Komponen
database sesuai dengan metoda koneksi 125
Mengirim
query ke server 126
BAB 13
MENGGUNAKAN TQUERY 127
TDatabase 128
TQuery 130
Memasukkan
data menggunakan TQuery 131
Query dengan
parameter 133
Mengambil
record menggunakan TQuery 135
Menggunakan
konstanta sebagai query 138
Mengubah isi
record 139
Menghapus
record 142
Langganan:
Postingan (Atom)