Andi Rest

Home » Blog Tutorial

Tampilkan postingan dengan label Blog Tutorial. Tampilkan semua postingan

Cara Membuat Halaman Perbaikan (Maintenance) di Blog

Cara Membuat Halaman Perbaikan (Maintenance) di Blog - Berikut ini adalah Cara Membuat Halaman Perbaikan (Maintenance) di Blog? Cara ini digunakan disaat blog dalam perbaikan, dan tentu pada saat utak-atik template blog akan terlihat berantakan dan berserakan. Kalau keadaan blog berantakan orang yang berkunjung pun juga bingung, jadi untuk antisipasinya cukup menggunakan sedikit kode CSS saja.

Cara Membuat Halaman Perbaikan (Maintenance) di Blog -

1. Login ke Blogger.
2. Template >> Edit HTML.
3. Cari kode ]]></b:skin>.
4. Letakkan kode dibawah ini tepat diatas kode ]]></b:skin>

html {
height: 100%;
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhXmkztsWl_152zbFEchlkvgFaFnR7KR_o85pNm46wLNrJCo9EQtfUGkZpRqlOM2O53Xkc-WE5BeXM6S3fd2pdNW6GD6gQLNGD9TPHfmDjuLv76tdXfb-gKaKzSXNw4wrTo7wK9Rdgo5BA/s1600/perbaikan.jpg) no-repeat center 50%;
margin: 0;
}
body {
display: none;
}

5. Simpan dan selesai

Note - Ganti Tulisan yang berwarna dengan url gambar sobat.

- Semoga Bermanfaat -

Cara Membuat Pop Up Window di Blog

Cara Membuat Pop Up Window di Blog - Berikut ini adalah cara membuat Pop Up windows diblog. Pop Up window diblog yaitu halaman baru yang berisi sebuah web atau informasi baru pada saat web awal diakses. Pop Up biasa digunakan untuk ikaln dan lain-lain. Namun terkadang Pop Up sangat mengganggu pengunjung karena munculnya web baru tersebut. Berikut ini cara membuat nya -

1.Login
2.Pilih Template >> Edit HTML
3.Kemudian cari kode <body> (Ctrl+F untuk mempercepat pencarian).
4.Copy kode dibawah ini dan pastekan tepat dibawah kode <body>

<script type="text/javascript">
var popurls=new Array()
popurls[0]="Url Pop Up"
popurls[1]="Url Pop Up"
popurls[2]="Url Pop Up"
popurls[3]="Url Pop Up"
function openpopup(popurl){
var winpops=window.open(popurl,"","width=,height=,toolbar,location,status,
scrollbars,menubar,resizable")
}
openpopup(popurls[Math.floor(Math.random()*(popurls.length))])
</script>

5.Selanjutnya Simpan & selesai.

NB - Ganti Url Pop Up dengan url yang diinginkan.

----selamat mencoba & semoga bermanfaat----

Cara Memasang Burung Twitter Terbang di Blog

Cara Memasang Burung Twitter Terbang di Blog - Berikut ini adalah cara memasang burung twitter terbang diblog. Cara kerja burung ini yaitu terbang mondar mandir dan terkadang sedikit membuat emosi. Sobat tertarik ingin memasangnya? saya tidak.

Berikut ini cara memasang nya diblog -
1.Login
2.Tata Letak >> Tambah Gadget >> Pilih HTML/Javascript
3.Copy dan pastekan kode dibawah ini ke HTML/Javascript

<script type="text/javascript" src="http://tateluproject.googlecode.com/files/tripleflap.js"></script>
<script type="text/javascript">
var birdSprite="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiWm2UsxvSw179VmH7dbJeMYqof0simRrc3iIHylFCm2e-EtAEYkEG3n4wirSs3LTi3y4XKCXYyk-O9rGyZOIv6K51JsbohCv_P8U-YQGR0zonGK4cr2EvYjW46swHcTrM4_j5ZYsbxJ2A/s1600/burung+twitter+terbang.png";
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/AndiRest";
var tweetThisText = "Twitter - UserID http://bloggerpeer.blogspot.com/";
tripleflapInit();
</script>

4.Selanjutnya simpan dan lihat hasilnya.

NB - Ganti AndiRest, untuk icon burung twitter silah kan ganti https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiWm2UsxvSw179VmH7dbJeMYqof0simRrc3iIHylFCm2e-EtAEYkEG3n4wirSs3LTi3y4XKCXYyk-O9rGyZOIv6K51JsbohCv_P8U-YQGR0zonGK4cr2EvYjW46swHcTrM4_j5ZYsbxJ2A/s1600/burung+twitter+terbang.png dengan icon dibawah ini -

Warna Kuning

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjOgIk7Xy9ajrX_xLfeBR-iKFtgiAi69Yl_zFi1DHossBtTGNCxgTucvVeDzP9Lwt1jfTognvOMSIotY8ZL2nh3SR5dZMoB9wmhac3uGwhyphenhyphendnzOzQKKkepU_lS2qVz1YhLODbzYB2ZBNYA/s1600/yellow+bird.png

Warna Hitam

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj2JVQOeGwlak2gd3Rk1qnppqn_oYilli03NJUvElPznN_odsT5408AHC05RgYwUeuA3ZDHhXl3Gqr5lecNzSyN_xxgyyWbXTepY6OH_WmIjAOoUy1fnQhP1AbRzmDWhyphenhyphenckgmv5nmVmeR0/s1600/black+bird.png

Warna Biru

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh33oMbLus61IeEnSNrwTC1t8bzNsPS6U2ObdL5rxC7YYo5FNj-qN5FETZ-wSiLPy-jIKF8iYde7s8RiQ-tC3XfQXh46zqLVLs7Q9JLHP2_Q9IEGOHD7PwLq4HNYzrpgtBI8vzKfRIxmKg/s1600/Blue+bird.png

Warna Coklat

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgx_-jh1POdh9PuwaqHd9RZXOY5HKHbcA7T7swldFXq27D7SEE360RgtglVPEbbj7AGF73DIi9DbcS0uxxAqM_aHvGspQtK8pRR0gI1OzJpBYb8175eP6NfcV7HzRvc5Ht14OdhyphenhyphenGxJp9U/s1600/brown+bird.png

Warna Hijau

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgB77a8aQuEOQd1aeA75dY-rJkrKi3UPU9i8tGwnOq4WYZnKBVZ8Aw8AQOCwcGEf9DC6nR2ZoQcRerwzSSbvDsWOC2V4kS6iWsh18r4PcxT9ApTIOrYchdo5hoximbCvtVD8Pbd3RaQvzQ/s1600/Green+bird.png

Warna Ungu

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhTrkGDo-XW_VKjAujAI9gUy6pXMNZpAEHnJk2rF0H2ySN2XBsCilHKGH28uweqBzmbw0W6bUUjdXkanTNlZLY7hGGAJJ56zuzHNQ4avuOMZmdIQGo8ITlguTgL0tMdI3C1yQjEBT_kNUg/s1600/purple+bird.png

Warna Putih

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi5p2nKCqAMUupILhUzpl-TTTrfXPZzvGyV4Gp-Dc_9A81AFd2DaQ7YCUi13khHz2fJ0hhwll010XjjYJl5WuHr6eTBnpdHQfquqErD5XlccHCnNqzhMZx7cC-iAD_9ctxm9K9JTOWPJ4s/s1600/white+bird.png

Warna Merah

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhxIw-QWMj4Hs5Rk_4dA3Ec-uXFhqFlui0ELB_LTpwi2WY7GeaDUwoZIF0raM_MmFqXu49fv6KNW_RyKpQXPpaGDfcgmb-2cXNQTLl3ig1z0JvFh-P2kB2FAhqb_Aalod-Zi2k_F1v5lh0/s1600/red+bird.png

----selamat mencoba dan semoga bermanfaat----
(Sumber - Cara Membuat / Memasang Burung Twitter Terbang di Blog)

Cara Membuat Daftar Isi Otomatis Untuk Label Tertentu di Blog

Cara Membuat Daftar Isi Otomatis Untuk Label Tertentu di Blog - Berikut ini adalah cara membuat Daftar isi dengan label tertentu di blogger. Seperti halnya juga membuat Daftar isi yang mana seluruh isi perlabel terlihat namun yang ini hanya menampilkan satu label saja. Untuk lebih jelasnya langsung saja klik Demo di bawah ini -

Berikut ini cara membuatnya -

1.Login ke blogger
2.langsung menuju Tata letak >> Tambah Gadget >> HTML/Javascript
3.Kemudian copy dan pastekan code dibawah ini ke kotak HTML/Javascript

<div style="overflow:auto; width:auto; height:150px; padding:5px;border:0px solid #000000; font-family:julee; font-size:15px; font-color:#0000FF;">
<ol>
<script style="text/javascript">
var numposts = 100;
var standardstyling = true;
</script>
<script type='text/javascript' src='http://tateluproject.googlecode.com/files/postlabel%281%29.js'></script><ol>
<script src="http://www.andisitorus.com/feeds/posts/default/-/Blog%20Tutorial?orderby=published&alt=json-in-script&callback=showrecentposts&max-results=999"></script>
</ol>
</ol></div>

4.Kemudian simpan.

NB - Ganti http://www.andisitorus.com dengan URL blog Sobat, Blog%20Tutorial ganti sesuai dengan label sobat - %20 adalah tanda spasi jadi perhatikan setiap penulisan, height:150px - tinggi dari scroll box, sobat juga bisa meletakkan code diatas pada postingan.

Jika sobat ingin menggunakan tanpa menggunakan scroll box berikut ini codenya -

<script style="text/javascript">
var numposts = 100;
var standardstyling = true;
</script>
<script type='text/javascript' src='http://tateluproject.googlecode.com/files/postlabel%281%29.js'></script><ol>
<script src="http://www.andisitorus.com/feeds/posts/default/-/Blog%20Tutorial?orderby=published&alt=json-in-script&callback=showrecentposts&max-results=999"></script></ol>

----selamat mencoba & semoga bermanfaat----

Cara Menghilangkan Navbar Terbaru di Blog

Cara Menghilangkan Navbar Terbaru di Blog - Berikut ini adalah cara menghilang kan navbar terbaru cara nya pun sangat mudah , cara ini juga legal dari blogger sendiri, dan sangat bebeda dari yang dulu-dulu yang penuh dengan kontroversial.

Berikut ini cara nya -

1.Login ke blogger
2.Langsung menuju tata letak

3.pilih/klik Edit pada widget Navbar

4.Setelah muncul tampilannya, pilih Off

5.Kemudian klik simpan & selesai

----selamat mencoba dan semoga bermanfaat----

Membuat Widget Tulisan Mengetik Sendiri di Blog

Membuat Widget Tulisan Mengetik Sendiri di Blog - Berikut ini adalah cara membuat Tulisan mengetik sendiri? Apa maksudnya?
Lebih jelas lihat contoh dibawah ini -

Seperti itulah Tulisan mengetik sendiri, Berikut ini scriptnya -

<br />
<form name="news"><br />
<textarea cols="50" name="news2" rows="3" wrap="virtual"></textarea></form><br />
<script type="text/javascript"><br />
//<![CDATA[<br />
var newsText = new Array();<br />
newsText[0] = "<span style="color: #cc0000;">Tips dan Trik Blogger</span> ";<br />
newsText[1] = "<span style="color: #cc0000;">Membuat Widget Tulisan Mengetik Sendiri di Blog</span>";<br />
newsText[2] = "<span style="color: #cc0000;">selamat mencoba</span>";<br />
newsText[3] = "<span style="color: #cc0000;">dan semoga bermanfaat</span>";<br />
newsText[4] = "<span style="color: #cc0000;">andisitorus.com</span>";<br />
newsText[5] = "<span style="color: #cc0000;">Salam</span> ";<br />
var ttloop = 1; // diulang-ulang teksnya ganti dengan 1 (1 = True; 0 = False)<br />
var tspeed = 250; // Typing speed in milliseconds (larger number = slower)<br />
var tdelay = 1000; // Time delay between newsTexts in milliseconds<br />
// ------------- NO EDITING AFTER THIS LINE -------------<br />
var dwAText, cnews=0, eline=0, cchar=0, mxText;<br />
function doNews() {<br />
mxText = newsText.length - 1;<br />
dwAText = newsText[cnews];<br />
setTimeout("addChar()",1000)<br />
}<br />
function addNews() {<br />
cnews += 1;<br />
if (cnews <= mxText) {<br />
dwAText = newsText[cnews];<br />
if (dwAText.length != 0) {<br />
document.news.news2.value = "";<br />
eline = 0;<br />
setTimeout("addChar()",tspeed)<br />
}<br />
}<br />
}<br />
function addChar() {<br />
if (eline!=1) {<br />
if (cchar != dwAText.length) {<br />
nmttxt = ""; for (var k=0; k<=cchar;k++) nmttxt += dwAText.charAt(k);<br />
document.news.news2.value = nmttxt;<br />
cchar += 1;<br />
if (cchar != dwAText.length) document.news.news2.value += "_";<br />
} else {<br />
cchar = 0;<br />
eline = 1;<br />
}<br />
if (mxText==cnews && eline!=0 && ttloop!=0) {<br />
cnews = 0; setTimeout("addNews()",tdelay);<br />
} else setTimeout("addChar()",tspeed);<br />
} else {<br />
setTimeout("addNews()",tdelay)<br />
}<br />
}<br />
doNews()<br />
//]]><br />
</script>

Nb - Ganti tulisan yang berwarna sesuai keinginan, script ini dapat diletakkan pada Widget atau postingan.

----selamat mencoba & semoga bermanfaat----

Cara Membuat Komentar Facebook Berdampingan Dengan Komentar Blogger

Cara Membuat Komentar Facebook Berdampingan Dengan Komentar Blogger - Berikut ini adalah cara membuat komentar facebook berdampingan dengan komentar blog, fungsinya dalah untuk memudahkan pengunjung blog jika ingin berkomentar apakah ingin menggunakan komentar blog atau facebook. Berikut ini caranya -

1.Login
2.Template >> Edit HTML
3.Centang kotak Expand Widget Template
4.Kemudian cari kode ]]></b:skin> (CTRL+F pencarian cepat)
5.Selanjutnya Copy dan pastekan kode dibawah ini tepat diatas ]]></b:skin>

.comments-page { background-color: #f2f2f2;}#blogger-comments-page { padding: 0px 5px; display: none;}.comments-tab { float: left; padding: 5px; margin-right: 3px;cursor: pointer; background-color: #f2f2f2;}.comments-tab-icon { height: 14px; width: auto; margin-right: 3px;}.comments-tab:hover { background-color: #eeeeee;}.inactive-select-tab { background-color: #d1d1d1;}

6.Lanjut lagi, kemudian cari kode </head>
7.Copy dan pastekan kode dibawah ini tepat diatas kode </head>

<script src='http://connect.facebook.net/en_US/all.js#xfbml=1'/>
<script src='http://code.jquery.com/jquery-latest.js'/>
<meta content='ID Fb sobat' property='fb:admins'/>
<script type='text/javascript'>
function commentToggle(selectTab) {
$(".comments-tab").addClass("inactive-select-tab");
$(selectTab).removeClass("inactive-select-tab");
$(".comments-page").hide();
$(selectTab + "-page").show();}
</script>

8.Ganti ID Fb sobat (tulisan berwarna diatas)
9.Lanjut lagi, cari kode <div class='comments' id='comments'>
10.Kode tersebut terdapat 2 & letakkan kode dibawah ini tepat dibawah 2 kode tersebut

<div class='comments-tab' id='fb-comments' onclick='javascript:commentToggle("#fb-comments");' title='Comments made with Facebook'><img class='comments-tab-icon' src='http://static.ak.fbcdn.net/rsrc.php/v1/yH/r/eIpbnVKI9lR.png'/><fb:comments-count expr:href='data:post.url'/> Comments</div><div class='comments-tab inactive-select-tab' id='blogger-comments' onclick='javascript:commentToggle("#blogger-comments");' title='Comments from Blogger'><img class='comments-tab-icon' src='http://www.blogger.com/img/icon_logo32.gif'/> <data:post.numComments/> Comments</div><div class='clear'/></div><div class='comments-page' id='fb-comments-page'><b:if cond='data:blog.pageType == "item"'><div id='fb-root'/><fb:comments expr:href='data:post.url' num_posts='2' width='450'/></b:if></div><div class='comments comments-page' id='blogger-comments-page'>

11.Ganti 450 , sesuikan dengan lebar blog sobat (450=lebar kotak komentar facebook)

----selamat mencoba & semoga bermanfaat----

Cara Menghapus Tulisan Tampilkan Posting Dengan Label di Blog

cara menghapus tulisan tampilkan posting dengan label di Blog - Berikut ini adalah cara menghilangkan pesan Tampilkan Semua Posting Pada Label, Apa itu? Apa bila Label dibuka maka pada bagian atas akan muncul pesan tersebut, nah mungkin ada yang sedikit resah atau ingin sekali menghilangkan pesan tersebut berikut ini caranya -

1.Login
2.Template >> Edit HTML
3.Centang kotak Expand Widget Template
4.Cari kode seperti dibawah ini

<b:includable id='status-message'> <b:if cond='data:navMessage'> <div class='status-msg-wrap'> <div class='status-msg-body'> <data:navMessage/> </div> <div class='status-msg-border'> <div class='status-msg-bg'> <div class='status-msg-hidden'><data:navMessage/></div> </div> </div> </div> <div style='clear: both;'/> </b:if> </b:includable>

5.Ganti kode yang diatas tadi dengan kode dibawah ini

<b:includable id='status-message'>
<b:if cond='data:navMessage'>
<div>
</div>
<div style='clear: both;'/>
</b:if>
</b:includable>

6.Jika sudah merasa benar langsung disave dan lihat hasilnya

----selamat mencoba & semoga bermanfaat----

Andi Rest

Site Info

Ads

Cara Membuat Halaman Perbaikan (Maintenance) di Blog

Cara Membuat Pop Up Window di Blog

Cara Memasang Burung Twitter Terbang di Blog

Cara Membuat Daftar Isi Otomatis Untuk Label Tertentu di Blog

Cara Menghilangkan Navbar Terbaru di Blog

Membuat Widget Tulisan Mengetik Sendiri di Blog

Cara Membuat Komentar Facebook Berdampingan Dengan Komentar Blogger

Cara Menghapus Tulisan Tampilkan Posting Dengan Label di Blog

Post Terbaru

Tutorial Blogger

Windows

Teknologi

Kesehatan

Unik