. Tips Dan Trik Blog

.

.

9.11.2015

cara membuat efect gambar berputar di blog

Bikin Gambar Berputar Sa’at di Sentuh Mouse

Bikin Gambar Berputar Sa’at di Sentuh Mouse :

Setelah kemarin ane posting tentang cara agar gambar membesar sa’at di sentuh mouse / krusor
Nah Dalam kesempatan kali ini Ane akan coba share cara agar gambar di blog kita berputar / sleding img zoom  saat di sentuh mouse / krusor, Biar ga penasaran ,kaya AbG tuir liat mangga muda yang bawaannya pingin nyacipin ,kayanya hehehhe...........Gimana kalau kita langsung saja ,eng - ing - eng......................................Monggo ikutipanduan dibawah ini ,silakan lihat di TKP :



______________________________________________________________________________

1.seperti biasa login ke akun bloger masing-masing.

2.padada menu drop down ,silakan pilih TEMPLATE .

3.backup dulu template ,(sekedar berjaga-jaga)

4.lalu klik  Edit Html ....

5.cari kode ]]></b:skin>  :untuk memudahkan pencarian ,kita gunakan CNTRL + F

6.nah jika sudah ketemu ,silakan Copy Paste Kode di bawah Tepat di atas Kode ]]></b:skin>
_______________________________________________________________________

.post img{-o-transition:all 1.5s ease;-moz-transition:all 1.5s ease;-webkit-transition:all 1.5s ease}.post img:hover{-o-transform:scale(1.2) rotate(360deg) translate(0px);-moz-transform:scale(1.2) rotate(360deg) translate(0px);-webkit-transform:scale(1.2) rotate(360deg) translate(0px);-o-transition:all 1.5s ease;-moz-transition:all 1.5s ease;-webkit-transition:all 1.5s ease}
_______________________________________________________________________

7. jika semua sudah silakan simpan template klik save dan lihat hasilnya

Cara diatas udah ane coba
selamat mencoba semoga berhasil

INGAT;;.....






cara membuat efek zoom di gambar blog

CARA MEMBUAT GAMBAR MEMBESAR/ZOOM EFECT SAAT DI SENTUH MOUSE

Setelah kemarin ane posting tentang cara agar gambar bergerak sa’at di sentuh moush / krusor
Nah Dalam kesempatan kali ini Ane akan coba share cara agar gambar di blog kita Membesar / zoom efek saat di sentuh moush / krusor
Silakan ikutipanduan dibawah ini ,silakan lihat di TKP :






_____________________________________________________________
1.seperti biasa login ke akun bloger masing-masing.
2.padada menu drop down ,silakan pilih TEMPLATE .
3.backup dulu template ,(sekedar berjaga-jaga)
4.lalu klik  Edit Html ....
5.cari kode ]]></b:skin>  :untuk memudahkan pencarian ,kita gunakan CNTRL + F

6.nah jika sudah ketemu ,silakan Copy Paste Kode di bawah Tepat di atas Kode ]]></b:skin>
___________________________________________________________
 
.post img:hover { -o-transition: all 0.3s; -moz-transition: all 0.3s; -webkit-transition: all 0.3s; -moz-transform: scale(2.0); -o-transform: scale(2.0); -webkit-transform: scale(2.0); -webkit-border-radius: 0px 0px; -moz-border-radius: 0px / 0px; -webkit-box-shadow: 2px 2px 6px rgba(0,0,0,0,6); }}
___________________________________________________________

7. jika semua sudah silakan simpan template klik save dan lihat hasilnya

Cara diatas udah ane coba .Selamat Mencoba Semoga Berhasil


INGAT;;.....




9.06.2015

cara memasaang fanspage facebook di blog

 Cara Membuat Fanspage Facebook tampil di blogger


Ok sobat berikut ini juntakx.blogspot.com akan membagikan tentang cara Membuat Fanspage Facebook tampil di Blog Blogger. Tutorial ini sudah pernah di bahas diartikel sebelumnya yang berjudul Cara memasang likebox Fanspage Facebook di Blog dan cara memasang widget likebox Fanspage Facebook melayang dengan tombol close kecil tapi karena ada yang tidak tahu kodenya diambil dimana maka saya membuat artikel ini..

Tentunya sobat sudah tahu kegunaan fanspage Facebook ini. sederhananya seperti ini, jika ada orang yang menyukai fanspage facebook kita baik itu melalui Blog ataupun di like langsung di Facebook ( semakin banyak maka semakin bagus) maka jika kita membuat artikel dan mempostingnya ( menaruh link Blog kita di Fanspage ) maka kemungkinan besar artikel tersebut akan muncul di dashboard ( beranda Facebook ) orang yang melike Fanspage Facebook kita, sehingga kemungkinan mendapatkan pengunjung lebih banyak menjadi lebih besar.


Ok berikut ini adalah :

Cara Membuat Fanspage Facebook Di Blog

1. Login dulu ke akun Facebook Anda  dan masuk ke; Facebook Developers.
2. Jika anda belum memiliki halaman fanspage facebook silahkan anda baca; cara membuat halaman Fanspage Facebook
3. Pada Facebook Page URL, Anda masukkan URL Facebook page blog Anda. Jika tampilan fansepage facebook anda sudah keluar silahkan klik "get Code".

ups, tapi apakah fb anda sudah mempunyai halaman facebook, klo blom buat dulu


4.Oh iya untuk anda yang ingin memasang fanspage fecebook melayang seperti di artikel yang saya sudah jelaskan sebelumnya ( baca : cara memasang widget fanspage facebook melayang ) anda tinggal menghilankan tanda centang di pilihan  "Show Friends' Faces" dan "Show Header" dan "Show Posts" dan "Show Border".


Catatan : Jika sudah sampai langkah ke 4 di atas dan tidak ada kode IFRAME maka gabungkan saja ke dua kode yang muncul seperti gambar di bawah ini.


Ketika di gabungkan contohnya seperti kode dibawah ini:
<div id="fb-root"></div>
<script>(function(d, s, id) {
  var js, fjs = d.getElementsByTagName(s)[0];
  if (d.getElementById(id)) return;
  js = d.createElement(s); js.id = id;
  js.src = "//connect.facebook.net/id_ID/sdk.js#xfbml=1&appId=483767385088491&version=v2.0";
  fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
<div class="fb-like-box" data-href="https://www.facebook.com/Seocips" data-colorscheme="light" data-show-faces="true" data-header="true" data-stream="false" data-show-border="true"></div>

Memasang Fanspage ke Blog

Tinggal masukan saja kode yang sudah anda dapatkan tadi ke widget Blog. Caranya masuk ke bagian "tata letak" di Klik Add a Gadget > pilih HTML/JavaScript, dan letakan kode di atas ke dalamnya.


Membuat Fanspage Facebook
Selesai tinggal lihat hasilnya di Blog anda.

9.03.2015

cara membuat arsip blog bergerak dengan gambar

Cara Membuat Arsip Blog Bergerak Dengan Gambar


  - Mungkin apabila kalian perhatikan, arsip blog bawaan default dari blogger terkesan monoton dan kurang menarik. Ada kalanya blogger ingin membuat sesuatu yang menarik dari segi tampilan yang terkesan "LEBIH KEREN". Berikut adalah gambar arsip blog default bawaan blogger yang saya maksud :
Cara Membuat Arsip Blog Bergerak Dengan Gambar
Kalau mau jujur sich, saya lumayan suka dengan tampilan arsip default. Namun apabila kalian ingin mengubahnya menjadi Arsip Blog Bergerak Dengan Gambar seperti ini :
Cara Membuat Arsip Blog Bergerak Dengan Gambar
kalian bisa mengubahnya melalui cara berikut:

Cara Membuat Arsip Blog Bergerak Dengan Gambar

Untuk Cara Membuat Arsip Blog Bergerak Dengan Gambar, silahkan kalian ikuti step - step berikut ini, tenang saja . . . mudah kok Cara Membuat Arsip Blog Bergerak Dengan Gambar
1. Login ke akun blogger kalian.
2. Pilih blog yang akan kalian rubah tampilan Blog Archive nya.
3. Klik pada tombol Menu Opsi Lainnya Pilih tulisan "Tata Letak" klik tulisan tersebut.
Cara Membuat Arsip Blog Bergerak Dengan Gambar
4. Klik tambah Gadget -> Pilih dan klik tulisan "HTML/Javascript". Maka akan muncul tampilan seperti gambar berikut ini
Cara Membuat Arsip Blog Bergerak Dengan Gambar
5. Selanjutnya kalian masukkan kode di bawah ini

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" type="text/javascript"></script>
<style media="screen" type="text/css">

<!--

#spylist {
overflow:hidden;
margin-top:5px;
padding:0px 0px;
height:350px;
}
#spylist ul{
width:355px;
overflow:hidden;
list-style-type: none;
padding: 0px 0px;
margin:0px 0px;
}
#spylist li {
width:335px;
padding: 5px 5px;
margin:0px 0px 5px 0px;
list-style-type:none;
float:none;
height:70px;
overflow: hidden;
background:#fff url(http://i879.photobucket.com/albums/ab351/bloggerblogimage/blogger/post.jpg) repeat-x;
border:1px solid #ddd;
}

#spylist li a {
text-decoration:none;
color:#4B545B;
font-size:11px;
height:18px;
overflow:hidden;
margin:0px 0px;
padding:0px 0px 2px 0px;
}
#spylist li img {
float:left;
margin-right:5px;
background:#EFEFEF;
border:0;
}
.spydate{
overflow:hidden;
font-size:10px;
color:#0284C2;
padding:2px 0px;
margin:1px 0px 0px 0px;
height:15px;
font-family:Tahoma,Arial,verdana, sans-serif;
}

.spycomment{
overflow:hidden;
font-family:Tahoma,Arial,verdana, sans-serif;
font-size:10px;
color:#262B2F;
padding:0px 0px;
margin:0px 0px;
}

-->
</style>

    <script language="javascript">
imgr = new Array();
imgr[0] = "http://i43.tinypic.com/orpg0m.jpg";
imgr[1] = "http://i43.tinypic.com/orpg0m.jpg";
imgr[2] = "http://i43.tinypic.com/orpg0m.jpg";
imgr[3] = "http://i43.tinypic.com/orpg0m.jpg";
imgr[4] = "http://i43.tinypic.com/orpg0m.jpg";
showRandomImg = true;
boxwidth = 300;
cellspacing = 6;
borderColor = "#232c35";
bgTD = "#000000";
thumbwidth = 60;
thumbheight = 60;
fntsize = 12;
acolor = "#666";
aBold = true;
icon = " ";
text = "Komentar";
showPostDate = false;
summaryPost = 40;
summaryFontsize = 5;
summaryColor = "#666";
icon2 = " ";
numposts = 10;
home_page = "http://juntax.blogspot.com/";
limitspy=5
intervalspy=6000
</script>

<br />
<div id="spylist">
<script type="text/javascript">
//<![CDATA[
 /*
 * Script dikombinasikan dari bloggerstricks.com
 * spy effect dari jqueryfordesigners.com
 * Oleh Abu Farhan (www.abu-farhan.com)
 * Modifikasi oleh daw-xp.blogspot.com
 */
jQuery(function(){jQuery("ul.spy").simpleSpy(limitspy,intervalspy).bind("mouseenter",function(){jQuery(this).trigger("stop")}).bind("mouseleave",function(){jQuery(this).trigger("start")})});(function(e){e.fn.simpleSpy=function(f,g){f=f||4;g=g||5000;return this.each(function(){var l=e(this),k=true,i=[],m=f,o=0,h=l.find("> li:first").height();l.find("> li").each(function(){i.push("
<li>"+e(this).html()+"</li>
")});o=i.length;l.wrap('<div class="spyWrapper" />
').parent().css({height:h*f});l.find("> li").filter(":gt("+(f-1)+")").remove();l.bind("stop",function(){k=false}).bind("start",function(){k=true});function n(){if(k){var p=e(i[m]).css({height:0,opacity:0,display:"none"}).prependTo(l);l.find("> li:last").animate({opacity:0},1000,function(){p.animate({height:h},1000).animate({opacity:1},1000);e(this).remove()});m++;if(m>=o){m=0}}setTimeout(n,g)}n()})}})(jQuery);function showrecentposts(z){document.write('<ul class="spy">');j=(showRandomImg)?Math.floor((imgr.length+1)*Math.random()):0;img=new Array();for(var o=0;o<numposts;o++){var w=z.feed.entry[o];var g=w.title.$t;var f;var p;if(o==z.feed.entry.length){break}for(var l=0;l<w.link.length;l++){if(w.link[l].rel=="alternate"){p=w.link[l].href;break}}for(var l=0;l<w.link.length;l++){if(w.link[l].rel=="replies"&&w.link[l].type=="text/html"){f=w.link[l].title.split(" ")[0];break}}if("content" in w){var r=w.content.$t}else{if("summary" in w){var r=w.summary.$t}else{var r=""}}postdate=w.published.$t;if(j>imgr.length-1){j=0}img[o]=imgr[j];s=r;a=s.indexOf("<img");b=s.indexOf('src="',a);c=s.indexOf('"',b+5);d=s.substr(b+5,c-b-5);if((a!=-1)&&(b!=-1)&&(c!=-1)&&(d!="")){img[o]=d}cmtext=(text!="no")?'<i><font color="'+acolor+'">('+f+" "+text+")</font></i>":"";var q=[1,2,3,4,5,6,7,8,9,10,11,12];var x=["Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec"];var u=postdate.split("-")[2].substring(0,2);var h=postdate.split("-")[1];var t=postdate.split("-")[0];for(var e=0;e<q.length;e++){if(parseInt(h)==q[e]){h=x[e];break}}var n=(showPostDate)?'<i><font color="'+acolor+'"> ('+u+" "+h+" "+t+")</font></i>":"";g=(aBold)?"<b>"+g+"</b>":g;var v='
<li><a href="'+p+'"><img src="'+img[o]+'" width="'+thumbwidth+'" height="'+thumbheight+'" class="recent-thumb"/></a><a href="'+p+'" class="recent-link">'+g+'</a><div class="spydate">
'+n+'</div>
<div class="spycomment">
'+cmtext+"</div>
";document.write(v);j++}document.write("</ul>
")}document.write('<script src="'+home_page+"feeds/posts/default?max-results="+numposts+'&orderby=published&alt=json-in-script&callback=showrecentposts"><\/script>');
//]]>
</script>
</div>

6.silahkan kalian ganti url, http://juntakx.blogspot.com  dengan url blog anda

INGAT;;.....



9.02.2015

cara menghubungkan blogspot ke domain freenom(ga.tk.ml)

Cara Menghubungakn Blogspot ke Domain Freenom (.ga, .tk, .ml, .cf)

Sebelumnya saya telah membuat tutorial dasar tentang 'cara membuat blogspot dan cara membuat domain gratis dari freenom'. Nah, selanjutnya saya akan menjelaskan cara untuk menghubungkan domain freenom ke blogspot. Maksudnya gimana sih gan? Mungkin ada yang bertanya seperti itu? Gini, kan domain blogspot .blogspot.com, sedangkan freenom mempunya domain gratis yang pendek dan lebih bagus diantaranya .ga, .ml, .tk dan .cf. Jadi domain yang sebelumnya, misal domain di blogspot yang kalian buat adalah iniloo.blogspot.com, bisa kalian ganti dengan iniloo.ga atau iniloo.tk dan kawan-kawan.
Menghubungkan domain freenom ke blogspot tergolong mudah, karena freenom mempunyai kecepatan update DNS Server tercepat dibandingkan penyedia layanan hosting dan domain yang ada di Indonesia. Mungkin dalam waktu 2-5 menit domain freenom sudah bisa digunakan, sedangkan layanan di Indonesia membutuhkan kurun waktu 1-5 Jam untuk menghubungkan domain mereka ke blogspot.
Apasih gunanya dihubungkan?
Melihat panjanganya kata blogspot, membuat orang susah untuk mengingat nama domain. Berikut menurut saya keuntungan untuk menghubungkan domain freenom ke blogspot:
  • Mudah diingat orang, karena domain tergolong pendek (.ga, tk, dkk)
  • Support untuk membuat akun google adsense non hosted
  • Lebih simple dan lebih elegan
  • Lebih keren
  • Menambah wawasan dan lain sebagainya.
Selanjutnya, iniloo cara menghubungkan domain freenom ke blogspot:
1. Buka Account freenom yang telah dibuat (jika belum punya, silahkan buat dan lihat caranya disini)
2. Buka Account blogspot (blogger) dan masuk ke menu setelan (jika belum punya buat saja disini)
3. Pada menu setelan dasar, Siapkan URL Pihak ke-3 untuk Blog, tepat dibawah domain blogspot.
1 Setelan Domain
4. Selanjutnya, masukkan nama domain freenom yang telah dibuat misal www.iniloo.ga, kemudian klik simpan.
2 Nama Domain
5. Maka akan muncul error URL, selanjutnya, copy satu persatu Host Name ke Manage DNS di Freenom.
3 Copy Alamat
Buka Freenom, My Domain --> Manage Domain dan Manage Freenom DNS
Domain
4 Manage
Masukkan Name (www dan xfwhramnici (bisa berubah-ubah) ke Host Name freenom.
3 Copy Alamat
Untuk Type pilih CNAME, TTL gak usah diubah kemudian target isi sesuai target Host Name Seperti gambar dibawah:
5 Copy Link
6. Setelah itu, masukkan Record IP Google. IP Google sebagai berikut:
216.239.32.21
216.239.34.21
216.239.36.21
216.239.38.21
Masukkan IP tersebut pada kolom target. Dengan Type = A. Seperti gambar dibawah ini.
6 IP Address
Selanjutnya klik Simpan, jika semua benar maka akan muncul notifikasi Successfully.
7 Record Sukses
7. Kembali ke blogger, setelah setelan sudah selesai, maka tunggu 2-5 menit. Kemudian simpan perubahan domain. Jika masih error, tunggu beberapa menit dan simpan lagi.
8 Simpan blogspot to domain
8. Jika domain sudah berubah, selanjutnya edit kembali domain pihat ke-3 dan centang alihkan domain kamu, misa iniloo.ga ke www.iniloo.ga. Ini bertujuan ketika seseorang akses tanpa www didepan, maka otomatis langsung direct ke www. Jangan lupa simpan lagi.
9 Centang dan Simpan
Demikianlah, tutorial tentang cara menghubungkan domain freenom ke blogspot, semoga dapat menambah pengetahuan kalian dalam dunia blogspot. Penulis mengharapkan kepada teman-teman untuk menyebarluaskan artikel ini baik media sosial maupun blogspot kalian dengan catatan menuliskan sumber artikel ini. Penulis juga menyediakan artikel video, dipersembahkan untuk mereka yang lambat paham dengan tutorial tulisan dan gambar.



INGAT;;.....










luvne.com resepkuekeringku.com desainrumahnya.com yayasanbabysitterku.com