if (window.jstiming) window.jstiming.load.tick('headEnd');
Minal 'Aidin wal Faizin
Mampukah setiap tahun bertambah baik?
Sebuah tantangan bagi siapapun. Jadikan Idul fitri sebagai mement yang indah dan tepat untuk setiap kali merubah diri menjadi pribadi yang jauh lebih baik, lebih peduli, jauh dari korupsi, jauh dari iri hati dan dengki... dan tentu saja ... jauh lebih lebih berharga dimata Allah dan dan sesama.
Home »Archives forMay 2012

Cara meringankan blog dengan jQuery Lazy Load

Posted byTeacher's Message
Lazy Loader adalah plugin jQuery di mana efek lazy load akan menangguhkan proses loading untuk image yang terdapat pada blog. Efek Lazy load hanya akan berfungsi apabila page di scroll. Image setelah page yang di scroll akan terbuka dengan menggunakan efek jQuery Lazy Load.
D E M O
Lazy Load membantu meringankan blog dengan mengurangi tempomasa proses loading page pada sebuah blog terutama pada blog yang banyak memuat image gambar ataupun image yang berukuran besar.

Untuk memasang jQuery Lazy Load di blogspot, ikut beberapa langkah di bawah.

Login Blogger Dashboard 
Klik Design --> Add A Gadget --> HTML/Javascript.
Copy dan paste kode di bawah pada content HTML/Javascript. Jika gambar kurang jelas arahkan kursor pada gambar...


dan inilah scriptnya
<script src='https://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js' type='text/javascript'></script>
<script type='text/javascript' src='http://javscript-code.googlecode.com/files/jquery.lazyload.mini.js?ver=1.5.0'></script>
<script type="text/javascript">
jQuery(document).ready(function($){
if (navigator.platform == "iPad") return;
jQuery("img").lazyload({
effect:"fadeIn",
placeholder: "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEidrFYn4sKwTucriXuXT0L9fc9f-x4MCBTgt9mPHRZJQ3g_XcmkoM0Q6PeDB8hr9a0bhjYFVPHm5fAKwFKnQqZZysGdRB2WMPuKUKPA5RHjZVZ4re2GdicgJG5EPoDE3gUrbDmQGiy2HVU/s1600/grey.gif"
});
});
</script>

Terakhir dan yang paling utama, klik Save.

NOTE:

1. Jika  tidak ada perubahan, silahkan paste kode tersebut di atas kode </body> pada script template.
2. Jika tidak ada perubahan juga, maka silahkan dicoba lagi dengan cara paste di atas kode </head>

Demikian semoga bermanfaat....

                                              

The Owner of Education For All Blog hanyalah seorang Blogger pemula namun bila sobat blogger mania berminat untuk melihat tutorial lainya bergaya magazine blog silahkan. Akses melalui link di bawah ini :





» Selamat Berkreasi - E F A «


2comments

Cara Pasang Breadcrumb Pada Blogspot

Posted byTeacher's Message
Educationfor all kali ini akan posting artikel  mengenai apakah itu breadcrumb dan cara memasangnya.Untuk meningkatkan SEO sesuatu blog,breadcrumb  adalah salah satu dari masalah yang perlu kita praktikkan.Breadcrumb pada sesuatu blog ibarat seperti peta atau sitemap yang akan memudahkan pembaca mengenal pasti kedudukan mereka di dalam page yang ada pada blog kita.

Apakah itu breadcrumb?

  • Secara ringkasnya breadcrumb adalah salah satu dari blog navigasi atau site navigation yang perlu ada pada sebuah blog. 

    Apakah kaitannya breadcrumb dengan seo?

    Untuk masalah ini EFAtunjukkan sedikit artikel yang didapati dari Google Search Engine Optimization Starter Guide.

    • Good practices for site navigation.
    • Use "breadcrumb" navigation - A breadcrumb is a row of internal links at the top or bottom of the page that allows visitors to quickly navigate back to a previous section or the root page.
      Many breadcrumbs have the most general page (usually the root page) as the first,left-most link and list the more specific sections out to the right.
    note : klik link ini untuk membaca artikel penuh dari Google Search Engine Optimization Starter Guide. [klik sini]

    Cara  memasang breadcrumb di blog.

    1. Login ke Blogger > Layout > Edit HTML
    2. Save  template dulu.
    3. Klik pada kotak Expand Widget template
    4. Cari kode ini <b:if cond='data:post.title'>
    5. Copy kode di bawah ini dan paste kan di bawah kod <b:if cond='data:post.title'>
paste kan di bawah kod <b:if cond='data:post.title'>
<b:if cond='data:blog.pageType == "item"'>
<a href='http://fajar7siblings.blogspot.com/'>Home</a> &#187;
<b:if cond='data:post.labels'>
<b:loop values='data:post.labels' var='label'>
<a expr:href='data:label.url' rel='tag'><data:label.name/></a>
<b:if cond='data:label.isLast != "true"'>,</b:if>
</b:loop>
&#187;
</b:if>
<data:post.title/>
</b:if>
“Ganti tulisan berwarna hijau dengan nama URL blog sobat blogger mania.”

Klik priview dan save jika tidak ada masalah

Kepada blogger newbie, dapat membuatnnya dengan perlahan2.Sekiranya ada yang kurang faham sobat blogger mania  boleh tanya di kolom komen.Salam Blogger

Semoga bermanfaat...................

The Owner of Education For All Blog hanyalah seorang Blogger pemula namun bila sobat blogger mania berminat untuk melihat tutorial lainya bergaya magazine blog silahkan. Akses melalui link di bawah ini :





» Selamat Berkreasi - E F A «


1comments

Cara pasang Recent Posts Slider di Blogspot

Posted byTeacher's Message
Sungguh tiada habisnya bila kita ingin mempercantik tampilan blog kita, Nah untuk itu Education For All akan sharing lagi dengan para sobat blogger mania pemula seperti EFA ini. Nah sharing kali ini EFA akan posting artikel tentang Cara pasang Recent Posts Slider di Blogspot. Seperti apa kira kira tampilanya?? silahkan sobat blogger mania arahkan kursor sobat blogger mania pada gambar disebelah kanan postingan ini.  Widget tersebut akan menjelaskan  post terbaru beserta thumbnail (image) yang berefek slider.Untuk memasang widget recent post slider ini pada blog sobat blogger mania silahkan,  ikut beberapa langkah di bawah.

Pertama : Login ke Blog
Kedua : klik Design ==> Klik add Gadget
Ketiga : Pilih klik pada HTML/Javascript lalu Copy paste kode dibawah ini pada halaman  HTML/Javascript
 
JUDUL ARTIKEL
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" type="text/javascript">
</script>
<script type="text/javascript">
$(document).ready(function(){
var first = 0;
var speed = 700;
var pause = 4500;
function removeFirst(){
first = $('ul#listticker li:first').html();
$('ul#listticker li:first')
.animate({opacity: 0}, speed)
.fadeOut('slow', function() {$(this).remove();});
addLast(first);
}
function addLast(first){
last = '<li style="display:none">'+first+'</li>';
$('ul#listticker').append(last)
$('ul#listticker li:last')
.animate({opacity: 1}, speed)
.fadeIn('slow')
}
interval = setInterval(removeFirst, pause);
});
</script>
<style type="text/css">
#listticker{
height:277px;
width:280px;
margin-bottom:15px;
padding:0px;
overflow:hidden;
}
#listticker li{
background:#FDE1E1 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEheIQfnIe9BjaVdhdhGVR7zqqtzFLGsigaS39wu8vbHfEsh9ZEGiI6tBP0R1nMkxm7x5aGywlRuaiIbWcCJFZAHer5OKqwiaBzYEtgmBOoOhDoBZZXY87f5XqRSfnCR8kIZJsXCyVDYlwN5/s320/gradient.png) repeat-x 0 -100px!important;
border: 1px solid #C6C6C6;
list-style:none;
line-height:0.90em;
height:46px;
margin:3px;
padding:2px;
-moz-border-radius:5px 5px 5px 5px;
-webkit-border-bottom-left-radius:5px;
-webkit-border-bottom-right-radius:5px;
-webkit-border-top-left-radius:5px;
-webkit-border-top-right-radius:5px;
-webkit-box-shadow: 0px 1px 2px rgba(0,0,0,0.3);
-moz-box-shadow: 0px 1px 2px rgba(0,0,0,0.3);
box-shadow: 0px 1px 2px rgba(0,0,0,0.3);
}
#listticker li a{
font-family: 'arial';
text-transform:normal;
text-shadow:0 1px 2px rgba(0,0,0,0.6);
letter-spacing:0.05em;
overflow:hidden;
}
#listticker img{
float:left;
margin:3px 3px 4px -7px;
padding:0px;
border:#EAE7E7 solid thin;-moz-border-radius:3px;-webkit-border-radius:3px;border-radius:3px;
-webkit-box-shadow: 1px 1px 2px rgba(0,0,0,0.6);
-moz-box-shadow: 1px 1px 2px rgba(0,0,0,0.6);
box-shadow: 1px 1px 2px rgba(0,0,0,0.6);
-o-transition: all 0.5s;
-moz-transition: all 0.5s;
-webkit-transition: all 0.5s;
}
#listticker img:hover {
-o-transition: all 0.3s;
-moz-transition: all 0.3s;
-webkit-transition: all 0.3s;
-moz-transform: scale(1.2);
-o-transform: scale(1.2);
-webkit-transform: scale(1.2);
}
</style>
<script language="JavaScript">
imgr = new Array();
imgr[0] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhIPM-f7YskI054knmmkmCGAqK3AONBN9jiWdTlPSipZBK-ktsRbqmIB_XZCZUBJj5ZKbz_BaZ_2MhfpxifjZZnYwBfVejq_3dFOh9j7JCUx-xzTxRTJp73mFzNjH8q2vC-FUfDSIRuwjXd/";
imgr[1] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhIPM-f7YskI054knmmkmCGAqK3AONBN9jiWdTlPSipZBK-ktsRbqmIB_XZCZUBJj5ZKbz_BaZ_2MhfpxifjZZnYwBfVejq_3dFOh9j7JCUx-xzTxRTJp73mFzNjH8q2vC-FUfDSIRuwjXd/";
imgr[2] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhIPM-f7YskI054knmmkmCGAqK3AONBN9jiWdTlPSipZBK-ktsRbqmIB_XZCZUBJj5ZKbz_BaZ_2MhfpxifjZZnYwBfVejq_3dFOh9j7JCUx-xzTxRTJp73mFzNjH8q2vC-FUfDSIRuwjXd/";
imgr[3] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhIPM-f7YskI054knmmkmCGAqK3AONBN9jiWdTlPSipZBK-ktsRbqmIB_XZCZUBJj5ZKbz_BaZ_2MhfpxifjZZnYwBfVejq_3dFOh9j7JCUx-xzTxRTJp73mFzNjH8q2vC-FUfDSIRuwjXd/";
imgr[4] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhIPM-f7YskI054knmmkmCGAqK3AONBN9jiWdTlPSipZBK-ktsRbqmIB_XZCZUBJj5ZKbz_BaZ_2MhfpxifjZZnYwBfVejq_3dFOh9j7JCUx-xzTxRTJp73mFzNjH8q2vC-FUfDSIRuwjXd/";
showRandomImg = true;
tablewidth = 250;
cellspacing = 0;
borderColor = "";
bgTD = "#";
imgwidth = 35;
imgheight = 35;
fntsize = 12;
acolor = "#262626";
aBold = true;
icon = "";
text = "no";
showPostDate = false;
summaryPost = 0;
summaryFontsize = 0;
summaryColor = "#";
icon2 = "";
numposts = 15;
home_page = "http://fajar7siblings.blogspot.com/";
</script>
<script src="http://javscript-code.googlecode.com/files/recent_posts_slider.js" type="text/javascript"></script>

Silahkan edit kode yang berwarna biru sesuai blog sobat blogger mania.
width:280px; (lebar kotak)
tablewidth = 250 (lebar teks pada kotak)
background:# FDE1E1; ( background kotak)
acolor = "#262626"; (Warna teks)
numposts = 15; (jumlah post yang ingin ditampilkan)
home_page = "http://fajar7siblings.blogspot.com/"; ( URL blog sobat blogger mania)

Akhir sekali, klik Preview dan jika tiada pesan error, klik saja Save.

Selamat mencoba Semoga bermanfaat.......

The Owner of Education For All Blog hanyalah seorang Blogger pemula namun bila sobat blogger mania berminat untuk melihat tutorial lainya bergaya magazine blog silahkan. Akses melalui link di bawah ini :





» Selamat Berkreasi - E F A «


0comments

Cara pasang Recent posts floating bar widget di Blogspot

Posted byTeacher's Message
Pada postingan kali ini Education for all akan posting artikel tentang cara membuat Recent posts floating bar. Nah apa sebenarnya yang dimaksud dengan Recent posts floating bar, recent post floating bar adalah, dimana setiap posting baru yang sobat blogger mania buat akan muncul dibar sobat blogger mania seperti stiker, hal ini tentunya akan mempermudah tamu sobat blogger mania dalam melihat posting terbaru dari blog sobat blogger mania. Bila sobat blogger mania berminat untuk membuatnya silahkan ikuti langkah langkah berikut ini:
1. Silahkan login ke Blogger terlebih dahulu.
2. Kemudian masuk kehalaman Edit HTML..
3. Seterusnya tick "Expand Widget Templates dan cari kode </head> .
4. Letakkan kode css berikut ini, tepat diatas kode </head>
paste kod css ini, di atas  kode </head>
<style type='text/css'>

#bd {
float:bottom;
font-family:Arial, Helvetica, sans-serif;
line-height:1.5;
margin-top:5px;
font-size:12px
}

.text {
color:#98BF2F;
margin-left:8px
}

div#news-1 .gk_news_highlighter {
font-family:Verdana, Arial;
font-size:11px;
color:#666
}

div#news-1 {
width:960px;
height:24px;
margin-left: -10px;
display:scroll;
position:fixed;
bottom:1px;
border-top:1px solid #CCC;
border-bottom:1px solid #CCC;
background:#000 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEheIQfnIe9BjaVdhdhGVR7zqqtzFLGsigaS39wu8vbHfEsh9ZEGiI6tBP0R1nMkxm7x5aGywlRuaiIbWcCJFZAHer5OKqwiaBzYEtgmBOoOhDoBZZXY87f5XqRSfnCR8kIZJsXCyVDYlwN5/s320/gradient.png) repeat-x 0 -100px;
clear:both;
overflow:hidden
}

div#news-1 .gk_news_highlighter_wrapper {
float:left;
width:820px;
height:24px;
line-height:24px;
overflow:hidden;
position:relative
}

div#news-1 .gk_news_highlighter_item {
width:auto;
height:24px;
padding-left:20px;
display:none;
position:absolute
}

div#news-1 .nowrap {
white-space:nowrap
}

div#news-1 .gk_news_highlighter_title {
padding-left:5px
}

div#news-1 .gk_news_highlighter_desc {
padding-right:5px
}

div#news-1 .gk_news_highlighter_interface {
float:left;
width:120px;
height:24px;
text-align:right;
line-height:24px;
z-index:1000
}

div#news-1 .gk_news_highlighter_interface .text {
float:left;
display:block;
width:auto;
padding-left:5px;
font-weight:700
}

div#news-1 .gk_news_highlighter_interface div {
width:30px;
float:right
}

div#news-1 .gk_news_highlighter_interface a.prev,div#news-1 .gk_news_highlighter_interface a.next {
cursor:pointer;
width:13px;
height:24px;
display:block;
background:url(&#39;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEieFie0yxdbkHQeH7Edi2pOATyanlp7A5Mxih4CcaO7yZoaXKfWgxlvPSa9s9dFiIenfzhj0AeTldj1L4KvyXDFBnX-SHLgvxC-joICn9lXu5Mx9zzLt_3JB6WjGI3FuIbVDPkvz0kniho/s1600/play.png&#39;) no-repeat 0 50%;
float:left
}

div#news-1 .gk_news_highlighter_interface a:hover.prev {
background-position:-13px 50%
}

div#news-1 a,div#news-1 a:link,div#news-1 a:visited,div#news-1 a:active,div#news-1 a:focus {
color:#FFF
}

div#news-1 .gk_news_highlighter_interface a.next {
float:right;
background-position:-26px 50%
}

div#news-1 .gk_news_highlighter_interface a:hover.next {
background-position:-39px 50%
}

</style>
5. Selanjutnya, dengan menggunakan keyboard, tekan "Ctrl+F" cari kode <div id='content-wrapper'>

Bagi blog yang menggunakan template dari template designer, cari kod </footer>

6. Copy dan paste kod HTML dan Javascript ini, dibawah atau selepas kod <div id='content-wrapper'>

Bagi blog yang menggunakan template dari template designer, paste kod HTML dan Javascript ini di atas atau sebelum </footer>
Copy  paste kode ini, dibawah <div id='content-wrapper'>
<div id='bd'>
<div class='gk_news_highlighter' id='news-1'>
<div class='gk_news_highlighter_interface'>
<span class='text'>HOT NEWS</span>
<div>
<a class='prev' href='#'/>
<a class='next' href='#'/>
</div>
</div>
<div class='gk_news_highlighter_wrapper'>
<script language='JavaScript'>
imgr = new Array();
showRandomImg = false;
aBold = true;
text = &quot;no&quot;;
showPostDate = false;
summaryPost = 200;
summaryFontsize = 12;
summaryColor = &quot;#000&quot;;
icon = &quot; &#187; &quot;;
label = &quot;&quot;;
numposts = 30;
home_page = &quot;http://fajar7siblings.blogspot.com/&quot;;
</script>
<script src='http://yourjavascript.com/11843262101/post-hotnews.js' type='text/javascript'/>
</div>
</div>
</div>
<script src='http://yourjavascript.com/01042612211/mootools.js' type='text/javascript'/>
<script src='http://javscript-code.googlecode.com/files/engine_compress.js' type='text/javascript'/>
<script type='text/javascript'>
try {$Gavick;}catch(e){$Gavick = {};};
$Gavick[&quot;gk_news_highlighternews-1&quot;] = {
&quot;animationType&quot; : 3,
&quot;animationSpeed&quot; : 200,
&quot;animationInterval&quot; : 2000,
&quot;animationFun&quot; : Fx.Transitions.linear,
&quot;mouseover&quot; : 1};
</script>
7. Edit kod yang di bold warna merah dengan menggantikannya URL blog sobat blogger mania dan jumlah postingan terbaru yang akan ditampilkan
8. Seterusnya klik Preview. Jika posisi bar terlalu ke kiri atau ke kanan, silahkan edit nilai pada kode yang di bold dengan warna biru pada langkah 4.

width:960px; (Panjang bar)
margin-left: -10px; (Jika posisi bar terlalu ke kanan, edit nilai -10 menjadi 10 dan sebaliknya)

9 . terakhir dan paling utama save template,
Semoga bermanfaat...........

The Owner of Education For All Blog hanyalah seorang Blogger pemula namun bila sobat blogger mania berminat untuk melihat tutorial lainya bergaya magazine blog silahkan. Akses melalui link di bawah ini :





» Selamat Berkreasi - E F A «


0comments

Cara pasang widget Recent comments dilengkapi dengan avatar/Foto di Blogspot

Posted byTeacher's Message
Hello, all bloggers around Indonesia and oversea may be...Yep dalam postingan kali ini Education for all akan posting artikel tentang cara pasang widget Recent comments dilengkapi dengan avatar/Foto di Blogspot. Sungguh tiada habisnya bila kita bicara tentang cara memperindah blog yang kita sayangi, betulkan. nah bila sobat blogger mania berminat untuk membuatnya caranyapun cukup gampang and mudah sekali nggak seribet yang kita bayangkan. ikuti saja langkah langkah sederhana ini. Oh ya, kalau mau lihat demonya lihat aja dikolom recent coment EFA disidebar sebelah kanan atau arahkan kursor sobat blogger mania pada gambar dibawah ini








Oke dah jelas kan, kalau dah jelas mari kita praktekan bersama sama. 
Cara Membuat
  • Login : Login to Blogger. Gunakan User Name atau Email Address serta Password. Setelah data tersebut dituliskan dengan benar, KLIK "Login".
  • Dasboard (Dasbor) : Ini halaman yang akan dijumpai setelah login. Akan terlihat beberapa buah link di dalamnya. Cari dan KLIK "Design (Rancangan)". Tunggu beberapa saat!
  • Design (Rancangan) : KLIK link "Add gadget".
  • Pilih Edit HTML : Setelah halaman ini terbuka, Pastekan script dibawah ini kedalamnya

<style type="text/css">
#recentcomment {
width:98%;
margin-left:5px;
}
img.recentcomment-avatar {
background:#000;
float:right;
padding:2px;
margin:2px -2px 0px 0px;
height:30px;
width:30px;
border:solid #ddd 1px;
-webkit-border-radius: 2px;
-moz-border-radius: 2px;
border-radius: 2px;
-webkit-box-shadow: 0px 1px 0px rgba(0,0,0,0.3);
-moz-box-shadow: 0px 2px 5px 0px #000;
box-shadow: 0px 2px 5px 0px #fff;
}
td div.recentcomment-content a,td div.recentcomment-content a:hover{
font-family: 'trebuchet ms';
font-size:1.00em!important;
color:yellow;
text-decoration:none;
}
div.recentcomment-content{
font-size:1.00em!important;
text-decoration:none;
line-height:1.45em;
letter-spacing:0.03em;
background: #02022b;
padding:4px;
border:1px solid #ddd;
-webkit-border-radius: 2px;
-moz-border-radius: 2px;
border-radius: 2px;
-webkit-box-shadow: 0px 1px 0px rgba(0,0,0,0.3);
-moz-box-shadow: 0px 2px 5px 0px #000;
box-shadow: 0px 2px 5px 0px #fff;
}
</style>

<script type="text/javascript">
ava_mode = "all";
var cm_num = 10;
var cm_desc = 13;
var homepage = "http://fajar7siblings.blogspot.com/";

var cm_ava = new Array();
cm_ava['openid'] = "http://img1.blogblog.com/img/anon36.png";
cm_ava['livej'] = "http://img1.blogblog.com/img/anon36.png";
cm_ava['wp'] = "http://img1.blogblog.com/img/anon36.png";
cm_ava['typepad'] = "http://img1.blogblog.com/img/anon36.png";
cm_ava['aim'] = "http://img1.blogblog.com/img/anon36.png";
cm_ava['url'] = "http://img1.blogblog.com/img/anon36.png";
cm_ava['anon'] = "http://img1.blogblog.com/img/anon36.png";

</script>
<script src="http://javscript-code.googlecode.com/files/recent-comment-avt.js" type="text/javascript"></script>

Ganti tulisan berwarna merah dengan alamat URL blog sobat blogger mania.
Sedangkan angka 10 jumlah recent komment yang akan ditampilan.
Terakhir dan paling utama simpan/ SAVE  

SELESAI, SEMOGA BERMANFAAT..........

The Owner of Education For All Blog hanyalah seorang Blogger pemula namun bila sobat blogger mania berminat untuk melihat tutorial lainya bergaya magazine blog silahkan. Akses melalui link di bawah ini :





» Selamat Berkreasi - E F A «


2comments

Macam-macam jenis Teknik SEO ala Blogger Pemula

Posted byTeacher's Message
Dihalaman ini EDUCATION FOR ALL akan sharing tentang Macam-macam jenis Teknik SEO ala Blogger Pemula.
Dalam sebuah website atau blog pasti ingin blog tersebut dapat dilihat oleh banyak orang. Di dalam teknik SEO ada dua cara supaya blog kita dapat dilihat banyak orang yaitu dengan cara On Page dan Off Page. tentu sobat blogger mania sudah tahu kan? jadi EFA sudah tidak akan menjelaskannya lagi ya.
On Page merupakan metode yang dilakukan untuk membuat tampilan blog menjadi lebih baik dari segi desain, isi halaman, maupun tema blog itu sendiri. semakin baik desain dan bentuk blog obat blogger mania. semakin unik dan nyaman buat pengunjung blog obat blogger mania. ingat, pengunjung adalah raja . jadi jangan sampai sobat blogger mania mengecewakan raja jika tidak ingin sobat blogger mania di pecat dari jabatan obat blogger mania sebagai blogger yang baik.  Sedangkan Off Page merupakan cara untuk membangun banyak link menuju ke blog kita. Ada bermacam cara untuk membangun link, di antaraya dengan mengirimkan sebuah link melalui komentar pada buku tamu maupun dari kegiatan chatting dengan sesama pengguna internet. Di dalam berkomentar pun kita harus tahu tata cara supaya kita bisa menarik hati dan simpati dari pemilik blog yang kita komentari untuk bisa menerima link kita dalam blog yang kita komentari. sehingga secara tidak langsung kita sudah melakukan Optimasi Blog.
Dalam menggunakan metode On Page, ada beberapa hal yang perlu diperhatikan di antaranya :
1.    Website atau blog yang sobat blogger mania buat perlu diperhatikan dengan benar mengenai tema blog yang sesuai dengan perkembangan dunia saat ini.jadilah blogger yang mempunyai pendirian teguh. jangan hanya jika sobat blogger mania sekarang memilih tema blogging tetapi pada saat booming  blog sobat blogger mania berubah haluan menjadi blog yang berisikan konten sia sia, harus memiliki satu tujuan
2.    Buatlah blog yang sederhana tetapi padat isi. jika blog sobat blogger mania terlalu rumit dan padat. tentu pengunjung akan merasa males dan tidak nyaman karena melihat berbagai konten ataupun widget yang tidak serasi ataupun tidak ada gunannya bertebaran di blog sobat blogger mania ingat,, tamu adalah raja. jadi layani tamu sebaik baiknya..
3.    Selalu update website secara berkala dan teratur. (Ini yang susah, kadang males dan ngawur ngawuran atau jika mood saja,
4.    Buatlah sitemap agar dapat dikenali oleh mesin pencari. oya,sitemap sangat penting untuk penunjang optimasi blog sobat blogger mania. jadi kalo bisa utamakan setiap blog sobat blogger mania selalu pasang sitemap agar memudahkan pengunjung maupun mesin pencari..
5.    Buatlah setiap halaman blog mempunyai judul dan tema yang unik dari blog yang lain. jika asal asalan dalam memilih judul blog karena judul blog mempengaruhi isi maupun konten blog tersebut.
Sedangkan dalam penggunaan metode Off Page, agar blog sobat blogger mania dapat dikunjungi oleh pengguna internet yang lain, maka ada beberapa hal yang perlu diperhatikan, yaitu :
1.    Submit artikel ke dalam article directory.
2.    Jangan lupa men submit blog ke dalam blog directory
3.   Sebarluaskan link blog sobat blogger mania dengan cara melakukan pertukaran link antar pengguna        
      internet.
4.    Menyebarluaskan link juga bisa melalui berbagai sosial bookmarking seperti facebook ataupun twitter.
5.    Banyak aktif dalam forum diskusi.
6. submit setiap sobat blogger mania setelah melakukan posting artikel ke berbagai situs bookmarking dofollow indonesia (misal lintasberita atau infogue) karena sudah EFA buktikan dan sangat manjur sekali sehingga postingan sobat blogger mania akan cepat diindex oleh mesin pencari.
dan jangan lupa sobat blogger mania juga dapat memasukkan alamat blog sobat blogger mania pada mesin pencari untuk di indeks ke dalam database search engine sehingga pengguna lain dapat melihat link website sobat blogger mania ketika melakukan pencarian. Dalam hal ini banyak sekali search engine yang bisa anda gunakan, diantaranya :
1.    Google dengan dengan alamat http://www.google.com/addurl
Dan masih banyak lagi search engine yang memiliki fasilitas ini.
Demikian yang bisa EFA share, mudah mudahan bermanfaat.

The Owner of Education For All Blog hanyalah seorang Blogger pemula namun bila sobat blogger mania berminat untuk melihat tutorial lainya bergaya magazine blog silahkan. Akses melalui link di bawah ini :





» Selamat Berkreasi - E F A «


1comments

Free SEO submission Tool

Posted byTeacher's Message
Buat sobat blogger mania pemula seperti Education For All yang ingin submit URL blognya silahkan submit disini gratis, tidak dipungut biaya...he..he..he..

Free SEO Tool





FREE Site Submission!
URL:
E-mail:
Add Free Site Submitter to Your Website - Click Here!
Default EnginesAdditional Engines
AtomicBot
Burf
Claymont
FyberSearch
Google
Google-ca
Google-fr
ScrubTheWeb
SplatSearch
Subjex
Unasked
Walhello		Abacho (.de)
Acoon (.de)
BigFinder
ExactSeek
OnSeek
SearchEngine
SearchSight
SearchWarp
WebWizard






Semoga bermanfaat dan bisa meningkatkan rating....


The Owner of Education For All Blog hanyalah seorang Blogger pemula namun bila sobat blogger mania berminat untuk melihat tutorial lainya bergaya magazine blog silahkan. Akses melalui link di bawah ini :





» Selamat Berkreasi - E F A «


1comments

Menampilkan Avatar / Foto Komentator Blogger

Posted byTeacher's Message
Hello, all newbie blogger all around Inonesia and oversea may be. Yaa.. kenapa saya EFA sebut newbie?? karena para blogger master sudah tentu tidak akan membutuhkan artkel artikel gurem seperti ini. Ok pada halaman ini Education for All akan sharing artikel tentang " Menampilkan Avatar / Foto Komentator Blogger" melalui tutorial ini sobat blogger mania  bisa menampilkan foto / avatar para komentator di samping isi komentar atau dibawah. Jika para komentator memberi komentar dengan akun atau profil Blogger mereka, maka foto dari profil tersebut akan langsung muncul disamping isi komentar. Untuk lebih jelasnya arahkan kursor sobat blogger mania pada gambar dipojok samping atas. jika sobat blogger mania berminat untuk membuatnya diblog sobat blogger mania silahkan ikuti langkah langkah berikut ini: 

Pertama Login ke akun sobat blogger mania
kedua Plih Layout  => Edit HTML, lalu centang Expand Widget Template
Ketiga cari kode yang seperti ini <dl id='comments-block'>  ganti kode tersebut dengan kode di bawah ini:



<dl expr:class='data:post.avatarIndentClass' id='comments-block'>
 
Jika di template sobat blogger mania kode comments-block berada dalam tag div, maka ganti tag dl pada <dl expr:class='data:post.avatarIndentClass' id='comments-block'/> dengan tag div. Hasilnya: <div expr:class='data:post.avatarIndentClass' id='comments-block'/>. 

 Selanjtunya, cari kode <a expr:name='data:comment.anchorName'/>, lalu paste kode dibawah ini di atasnya:
 


<b:if cond='data:comment.favicon'>
<img expr:src='data:comment.favicon' height='35px' width='35px' style='margin-bottom:-2px;' />
</b:if>
<a expr:name='data:comment.anchorName'/>
<b:if cond='data:blog.enabledCommentProfileImages'>
<data:comment.authorAvatarImage/>
</b:if>



Yang terakhir dan yang paling utama SAVE template,  SELESAI.

The Owner of Education For All Blog hanyalah seorang Blogger pemula namun bila sobat blogger mania berminat untuk melihat tutorial lainya bergaya magazine blog silahkan. Akses melalui link di bawah ini :





» Selamat Berkreasi - E F A «


0comments

Cara Memasang Warning... !!! Blog Sedang di Maintenance

Posted byTeacher's Message
Dalam postingan kali ini EFA akan sharing tentang Cara Memasang Warning... !!! Blog Sedang di Maintenance 
Maintenance adalah perbaikan sebuag web/blog sehingga tidak memungkinkan untuk di kunjungi ,nah jika sobat blogger mania ingin memperbaiki Blog sobat blogger mania sebaiknya maintenance-kan blog sobat blogger mania dulu, Kalau tidak visitor / pengunjung akan mengira blog sobat blogger mania blog kumuh karena masih dalam perbaikan. Lalu bagimana Cara Buat Blog Menjadi Maintenance, ikuti langkah berikut :

1.Login blog tentunya menggunakan akun sobat blogger mania
2. Buka rancangan >> edit HTML
3. Taruh kode dibawah ini diatas kode ]]></b:skin>
  
html {
  height: 100%;
  background: url(http://www.freecomputermaintenance.com/wp-content/uploads/2011/09/Closed_for_Maintenance_JPG.jpg) no-repeat center 50%;
  margin: 0;
}
body {
  display: none;
}

Sobat blogger mania bisa mengganti alamat url gambar yang berwarna merah, sesuai dengan selera sobat blogger mania.


The Owner of Education For All Blog hanyalah seorang Blogger pemula namun bila sobat blogger mania berminat untuk melihat tutorial lainya bergaya magazine blog silahkan. Akses melalui link di bawah ini :





» Selamat Berkreasi - E F A «


0comments

Cara Memasang Contact us di Blog

Posted byTeacher's Message
Apakah sobat blogger mania sedang mencari artikel tentang "Cara Memasang Contact us di Blog" ??? jika jawabanya,..Yess..maka sobat blogger mania come to the right place EFA rasa semua blogger mania pasti memberikan menu contact us pada blog mereka, mungkin ada sebagian yang kesulitan dalam membuat menu contact us seperti efa ini. nah untuk membuatnya pun EFA kira tidak terlalu sulit sobat blogger mania hanya perlu mengikuti tutorial dibawah ini. Oke mari kita ke TKP.

Pertama sobat blogger mania harus mempunyai akun email untuk proses pendaftaran
kedua silahkan Kunjungi  http://123contactform.com
dan lakukan pendaftaran disana, ingat pilihlah yang gartis.bisa juga langsung sign in mith google.
Selanjutnya klik => my form"+newform" => klik contact form
beri judul pada  menu contact sobat blogger mania  lalu edit sesuka sobat blogger mania. untuk lebih jelasnya coba perhatikan pada gambar ini kalau gambarnya kurang jelas silahkan arahkan kursor sobat blogger mania pada gambar.


Apabila sobat blogger mania telah menyelesaikanya, silahkan sobat blogger mania klik publish form dan tentunya pilih blogger apabila ingin dipasang diblog sobat blogger mania. Untuk lebih jelasnya lihat pada gambar berikut. kalau gambarnya kurang jelas silahkan arahkan kursor sobat blogger mania pada gambar.  



Ambil sriptnya kemudian pastekan pada postingan atau laman sobat blogger mania. SELESAI

D E M O

Selamat Mencoba semoga berhasil.......

The Owner of Education For All Blog hanyalah seorang Blogger pemula namun bila sobat blogger mania berminat untuk melihat tutorial lainya bergaya magazine blog silahkan. Akses melalui link di bawah ini :





» Selamat Berkreasi - E F A «


2comments

Halaman Contact Education For All

Posted byTeacher's Message

I am only villager who was born and grew up in a remote area. my favorite telesion program is: Bedah warung, Orang pinggiran, Jika aku menjadi, Kick Andy, and Mario Teguh. The news I hate so much is KISS, Silet and other bad infotaiment. thanks



If you really wanna share somethings with me, just use this colum to tell everythhing. I will be good listener.


       

Free forms powered by 123ContactForm.com | Report abuse

 








The Owner of Education For All Blog hanyalah seorang Blogger pemula namun bila sobat blogger mania berminat untuk melihat tutorial lainya bergaya magazine blog silahkan. Akses melalui link di bawah ini :





» Selamat Berkreasi - E F A «


0comments

Cara Mengembalikan Blogspot ke tampilan lama

Posted byTeacher's Message
Halo,..sobat blogger mania. pada sharing kali ini EDUCATION FOR ALL akan sharing ilmu sederhana yaitu cara  Mengembalikan Blogspot ke tampilan lama. kenapa hal ini harus dilakukan padahal blogger sudah begitu luar biasa mengupgrade tampilanya. yah barang kali saja karena berbagai alasan, kalu EFA sendiri cenderung lebih menyukai tampilan blogger lama. kenapa begitu??? karena EFA hanya menggunakan modem HP, dan loading tampilan blogger baru relatif lebih lama. disamping layanan telkomsel flash yang tidak begitu maksimal didaerah EFA, dimana signalnya tumbuh tenggelam sehingga kadang membuat emosional. okelah tidak usah panjang lebar ikuti saja langkah langkahnya berikut ini:

Pertama Login ke Dashboard blog sobat mania
kedua  lihat tanpilan blogspot yang baru  seperti gambar ini. kalau kurang jelas arahkan mouse sobat blogger mania ke gambar dibawah ini.










Ketiga  klik tampilan antar muka yang terdapat pada pojok kanan dashboard blog sobat blogger mania. lebih jelasnya lihat gambar dibawah ini. bila kurang jelas arahkan kursor sobat blogger mania kegambar agar lebih jelas.










Kemudian klik pada tampilan ANATAR MUKA BLOGGER LAWAS  seperti pada gambar yang EFA kasih kotak merah. kemudian save dan lihat hasilnya blog sobat blogger mania kembali ke tampilan lama lagi,selamat mencoba semoga bermanfaat...........   

Begitu aja selamat mencoba....kalau kurang jelas sebaiknya sobat blogger mania, matikan laptop terus ambil kain sarung dan langsung tidur saja.

The Owner of Education For All Blog hanyalah seorang Blogger pemula namun bila sobat blogger mania berminat untuk melihat tutorial lainya bergaya magazine blog silahkan. Akses melalui link di bawah ini :





» Selamat Berkreasi - E F A «


2comments

Cara Membuat Tooltip gambar dengan jquery

Posted byTeacher's Message
kali ini EFA akan sharing jquery lagi, karena Tooltip kali ini di buat dengan bantuan jquery, dan sedikit berbeda dengan Tooltip - Tooltip biasanya, seperti apa bentuk Tooltip gambar dengan jquery, ini silahkan di lihat demo nya dibawah ini, ngak usah kemana mana, jadi coba sobat blogger mania sorot saja gambar ini, mereka pada telanjang sepertikita dulu.









kita lanjut ke tahap pembuatannya :
  1. Log in ( masuk di blog anda )
  2. Klik Rancangan
  3. Klik Edit HTML
  4. Cari Kode </head>
  5. Setelah ketemu silahkan anda simpan kode di bawah ini di atas kode </head>


<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.2.3/jquery.js' type='text/javascript'></script>
<script>
this.imagePreview = function(){ /* CONFIG */
xOffset = 10;
yOffset = 30;
// these 2 variable determine popup's distance from the cursor
// you might want to adjust to get the right result
/* END CONFIG */
$("a.preview").hover(function(e){
this.t = this.title;
this.title = ""; var c = (this.t != "") ? "<br/>" + this.t : "";
$("body").append("<p id='preview'><img src='"+ this.href +"' alt='Image preview' />"+ c +"</p>");
$("#preview")
.css("top",(e.pageY - xOffset) + "px")
.css("left",(e.pageX + yOffset) + "px")
.fadeIn("fast");     },
function(){
this.title = this.t; $("#preview").remove();
    }); $("a.preview").mousemove(function(e){
$("#preview")
.css("top",(e.pageY - xOffset) + "px")
.css("left",(e.pageX + yOffset) + "px");
}); };

// starting the script on page load
$(document).ready(function(){
imagePreview();
});
</script>
sekarang cari kode ]]></b:skin>
setelah ketemu silahkan anda simpan kode di bawah ini di atas kode ]]></b:skin>


#preview{
position:absolute;
border:2px solid #0e0;
background:#0B0;
padding:5px;
display:none;
color:#fff;
}
Ok sekarang silahkan klik SIMPAN TEMPLATE
dan kode pemanggilannya / penggunaannya ada di bawah ini,


<a href="Disini URL gambar Tooltip" class="preview"><img src="Disini url gambar" width="100" height="150"></a>
Atur ketinggian dan lebar gambar lihat kode
width = Lebar, [ silahkan sesuaikan dengan keinginan anda ]
height = Tinggi [ silahkan sesuaikan dengan keinginan anda ]
Disini URL gambar Tooltip, Disini url gambar =  silahkan ganti dengan url gambarnya.


Untuk menggunakannya di sidebar silahkan Tambah gadget ► html/javascript
Kalau di postingan silahkan beralih dari mode Compose ke ► Edit html
Mungkin hanya itu yang bisa saya share semoga bermanfaat.

The Owner of Education For All Blog hanyalah seorang Blogger pemula namun bila sobat blogger mania berminat untuk melihat tutorial lainya bergaya magazine blog silahkan. Akses melalui link di bawah ini :





» Selamat Berkreasi - E F A «


5comments
NextPrev
Subscribe to:Posts (RSS)