Cara Membuat Menu Label Masakan Di Blog

 Cara Membuat Menu Label Masakan Di Blog - Bingung Mau ngasih Judul Apa, Kalau Teman Blog saya Yaitu Kang Hilman Okesharezone memberikan Judul ini dengan nama Cara Membuat Widget Untuk Resep Makanan Seperti Facewoman (Blog Mas Andik) . Terserahlah mau memberikan judul apa untuk tutorial yang satu ini. Jika anda Tertarik untuk membuat trik yang satu ini ikutilah langkah - langkah di bawah ini :

1.Pertama-tama Login Blogger.
2.Langkah kedua Masuk Dashboard - Template - Edit HTML - Centang Expand Widget Template - Kemudian Cari Kode ]]></b:skin> Untuk mempercepat Proses Pencarian Kode Gunakan Ctrl + F, Kemudian Masukkan Kode ]]></b:skin> Jika sudah anda ketemukan Kode Tersebut kemudian Masukkan Kode di bawah ini tepat di atas Kode ]]></b:skin> :

.markermenu{width:110px;position:relative}

.markermenu ul{list-style-type:none}

.markermenu ul li a{background:#008e04;font:bold 12px "Lucida Grande","Trebuchet MS"color:#fff;display:block;font-color:#fff;width:auto;padding:5px;text-decoration:none;text-align:center;-moz-border-radius:4px;-webkit-border-radius:4px;-khtml-border-radius:4px;border-radius:4px;-moz-box-shadow:0 2px 2px rgba(0,0,0,0.6);-webkit-box-shadow:0 2px 2px rgba(0,0,0,0.6);opacity:.850;filter:alpha(opacity=85)}

.markermenu ul li a:visited,.markermenu ul li a:active{color:#fff}

.markermenu ul li a:hover,.markermenu ul li a.selected{color:#fff;background-color:#f60}

.markermenu a:link,.markermenu a:visited{font-size:12px;font-weight:bold;color:#fff;text-decoration:none}

.markermenu a:hover{color:#fff;background-color:#008e04}

.resep{background:url(http://lh4.ggpht.com/_dfnTVAxeWMI/S4FbLs-M7oI/AAAAAAAADUo/gqSMm_QME-I/bgbtk1.gif);border:1px solid #eee;padding:2px;font:12px/1.4em Arial,text-align:justify;sans-serif;width:100%}

.resep img{border:2px solid #ccc;vertical-align:middle;margin-bottom:1px;height:80px;width:80px}

.resep ul li{font-size:1em;line-height:15px;padding:0 0 6px 12px}

Simpan Template.

3.Langkah Ketiga Tata Letak - Tambah Gedget - Add Java Scrip - Masukkan Kode Di bawah ini kedalam Gerget tersebut :

<div style="font-weight:bold; color:#BB2000; font-size:15px; padding:5px 5px 5px 2px;text-align:left;">Tempatnya <span style="color:#008E00;font-weight:bold;font-size:17px;">MASAKAN</span></div>



<script type='text/javascript'>var numposts = 1;var showpostthumbnails = true;var displaymore = true;var displayseparator = false;var showcommentnum = false;var showpostdate = false;var showpostsummary = true;var numchars = 90;</script>



<script type="text/javascript" src="/feeds/posts/default/-/Food?orderby=updated&alt=json-in-script&callback=labelthumbs"></script>



<div class="toprelated left">

<script type="text/javascript">

function recentpostslist(json) {

 document.write('<ul>');

 for (var i = 1; i < json.feed.entry.length; i++)

 {

    for (var j = 1; j < json.feed.entry[i].link.length; j++) {

      if (json.feed.entry[i].link[j].rel == 'alternate') {

        break;

      }

    }

var entryUrl = "'" + json.feed.entry[i].link[j].href + "'";//bs

var entryTitle = json.feed.entry[i].title.$t;

var item = "<li>" + "<a href="+ entryUrl + '" >' + entryTitle + "</a> </li>";

 document.write(item);

 }

 document.write('</ul>');

 }

</script>

<script src="http://facewoman.blogspot.com/feeds/posts/summary/-/Kuliner?max-results=4&alt=json-in-script&callback=recentpostslist"></script></div>



<table><tr>

<td>

<div style='padding-left:50px;' class="markermenu">

<ul>

<li><a href="http://facewoman.blogspot.com/2012/10/kirim-resep-masakan-ke-redaksi-facewoman.html">Kirim Resep</a></li>

</ul> 

</div>

</td>



<td>

<div style='padding-left:10px;' class="markermenu">

<ul> 

<li><a href="http://facewoman.blogspot.com/search/label/Food?max-results=5">Lihat Thread</a></li> 

</ul> 

</div>

</td>

</tr></table>

Keterangan :

• Ganti  Tulisan Kuliner Dengan Nama label anda.
• Ganti Link http://facewoman.blogspot.com/2012/10/kirim-resep-masakan-ke-redaksi-facewoman.html Dengan alamat anda.
• Ganti Link http://facewoman.blogspot.com/search/label/Food dengan alamat label anda.

Simpan Gedget.

4.Langkah terakhir Lihat Hasilnya.

Note :

 Jika tidak nampak gambar Thumb Pada trik tersebut, yang harus anda lakukan adalah membuat lagi tutorial yang saya berikan ini Cara Membuat Label Thumbnail Di Blogspot.

 Itulah Ulasan tentang Cara Membuat Menu Label Masakan Di Blog Semoga bisa jadi referensi untuk anda.