Gudang Makalah: Tips Trik

Home » Semua post berkategori Tips Trik

Tampilkan postingan dengan label Tips Trik. Tampilkan semua postingan

Cara Pasang Read More Animasi

Setelah menyelesaikan tudas-tugas dari dosen Alhamdulillah akhirnya bisa kembali sharing pengetahuan di blog. Dan kali ini,sesuai dengan judulnya,saya akan membahas tentang Bagaimana caranya membuat readmore animasi (kaya punyaku ini,hehe ).

Caranya caranya cukum gampang tinggal sobah lanjutkan bacanya
1.Bagi sobat yang blognya belum pake readmore,buat readmore dulu disini

2.Dihalaman Edit HTML, ganti tulisan read more ato lainya yang sobat pake buat link baca selanjutnya dengan kode berikut <img src="link gambar kamu"/>
Yang sudah pake read more langsung langkah 2 aja ya.
3.Langkah terakhir dan terpenting adalah Save Template

Kalo sobat belum punya gambar ini aku sediakan:

http://i496.photobucket.com/albums/rr329/grandisyf/th_button-green-f.gif

http://i496.photobucket.com/albums/rr329/grandisyf/th_arrow-readmore.gif

http://i496.photobucket.com/albums/rr329/grandisyf/th_more.gif

http://i496.photobucket.com/albums/rr329/grandisyf/Read-more-3_grandis.gif

http://i496.photobucket.com/albums/rr329/grandisyf/th_Readmore3.gif

gimana sobat gampang kan, semoga artikel ini bemanfaat

jika ada pertanyaan silahkan coment di bawah

Cara Mecegah Copy Paste Pada Blog

akhirnya kita bisa jumpa lagi disini saya haram teman-teman mempunyai kabar yang baik, kali ini saya hanya sedikit share dari postingan blog teman-teman yaitu tentang cara mencegah copy paste pada blog, kalau menurut saya sih hal ini tidak terlalu penting, merupakan satu keuntungan tersendiri bila artikel kita di copas (copy paste), apa lagi bila sobat yang copas mau mencantumkan sumber dari artikel tersebut, bisa menambah back link kan, merupakan keuntungan tersendirikan.

Namun bagi sobat yang merasa bahwa artikel sobat sangat penting dan tidak rela untuk di copy paste, mungkin hal ini cukup berguna untuk dilakukan. akan tetapi cara tersebut tidak melindungi content blog sobat sepenuhnya, stidaknya cukup membuat orang yang berniat copas sedikit bingung apabila dia seorang newbie, karena sebenarnya ada jalan lain untuk bisa meng-copas artikel blog sekalipun sudah dilindungi dengan script anti copas.

Tanpa panjang lebar, kali ini untuk melindungi blog di blogger (blogspot) dari dari copy paste adalah dengan mendisable right click, atau lebih dikenal dengan mematikan klik kanan. Berikut tutorial cara mematikan klik kanan pada blogspot.

Login terlebih dahulu ke Blogger.com
Dari halaman Dashboard, silahkan Sobat menuju ke Tata Letak > Edit HTML
Lalu cari kode <body> atau <body (dengan bantuan tekan Ctrl+F atau F3)
Tambahkan kode dibawah ini ke dalam kode <body> atau <body tadi, atau bisa juga di ganti sekalian

<body oncontextmenu='return false' onmousedown='return false' onselectstart='return false' onkeypress='return false'>

Sobat juga bisa menggunakan beberapa tambahan kode saja, atau semuanya juga boleh, terserah kebutuhan anda.

Berikut penjelasan dari kode-kode diatas:

oncontextmenu='return false' (untuk mematikan klik kanan mouse)
onmousedown='return false' (untuk mematikan klik blok ke bawah)
onselectstart='return false' (untuk mematikan seleksi blok)
onkeypress='return false' (untuk mematikan tombol keyboard)

Jika sudah, Simpan Template blog Sobat.

Selamat mencoba dan semoga bermanfaat

Menampilkan Widget Di Halaman Tertentu

Assalamualaikum Wr.,Wb.
Gimana kabar tema-teman masih dalam keadaan sehat wal afiat kan? mudah-mudahan begitu sekarang saya akan sharr pengetahuan kepada teman-teman mudah-mudahan bermanfaat, topik ini berbeda dengan yang saya bagikan kemaren yaitu "Menampilkan widget pada halaman tertentu" biasa digunakan pada template megazine, misalnya anda ingin menampilkan widget dihalaman post saja atau tidak ada hanya dihalaman post.

Ok. silahkan simak langkah-langkahnya dibawah.

Langkah pertama yang harus Anda lakukan adalah masuk menu "Design" kemudian masuk ke bagian "Edit HTML" lalu centang kotak "Expand widget templates"

lalu cari code widgetnya seperti ini

<b:widget id='HTML1' locked='false' title='Pesan' type='HTML'>
<b:includable id='main'>


<b:if cond='data:title != ""'>
<h2 class='title'><data:title/></h2>
</b:if>
<div class='widget-content'>
<data:content/>
</div>

<b:include name='quickedit'/>

</b:includable>
</b:widget>

Untuk mempermudah pencarian silahkan masukkan judul widget seperti "Pesan" kedalam kotak pencarian browser (ctrl + F)

Kemudian tambah code

<b:if cond='data:blog.url == data:blog.homepageUrl'>

dan ditutup dengan code </b:if> untuk menempatkan di hanya halaman depan saja

dan ditempatkan seperti dibawah ini

<b:widget id='HTML1' locked='false' title='Pesan' type='HTML'>
<b:includable id='main'>
<b:if cond='data:blog.url == data:blog.homepageUrl'>

<b:if cond='data:title != ""'>
<h2 class='title'><data:title/></h2>
</b:if>
<div class='widget-content'>
<data:content/>
</div>

<b:include name='quickedit'/>
</b:if>
</b:includable>
</b:widget>

Perhatikan penempatan code yang berwarna hijau !

kemudian save.

Dan dibawah ini adalah code yang bisa digunakan untuk penempatan lainya

Untuk menempatkan di halaman depan/index digunakan code

<b:if cond='data:blog.pageType == data:blog.homepageUrl'>

Untuk menempatkan di halaman Archive saja

<b:if cond='data:blog.pageType == "archive"'>

Untuk menempatkan dihalaman item/posting saja digunakan code

<b:if cond='data:blog.pageType == "item"'>

Dan untuk pada halaman pages atau static page blogger digunakan

<b:if cond='data:blog.pageType == "static_page"'>

Dan untuk tambahan, jika Anda ingin menempatkan di halaman tertentu dengan menggunakan URL gunakan code dibawah ini

<b:if cond='data:blog.url == "URL_HERE"'>

Ganti code URL_HERE dengan URL yang ingin anda tampilkan.

Dan untuk pengecualian, misalnya anda tidak menempatkan widget hanya di halaman depan saja dengan cara mengganti tanda = pertama dengan tanda !

Contoh

<b:if cond='data:blog.pageType != data:blog.homepageUrl'>

Gimana teman-teman gak repot kan? semoga artikel ini bermanfaat buat teman-teman.

Sekian silahkan berkomentar jika ada pertanyaa, :D

NB : Code diatas juga dapat di aplikasikan ke fungsi-fungsi blogger lainya yang akan saya bahas di waktu selanjutnya

Widget Top Komentator Dengan Avatar

kegunaan dari widget ini, bisa anda maknai sebagai apresiasi untuk pengunjung setia anda atau undangan untuk menarik perhatian dan keinginannya agar lebih giat berkomentar diblog anda.
Jika anda tertarik untuk menambahkan widget top komentator menarik dengan avatar ini, silahkan ikuti tutorial berikut:

Pada dasbor –> Menu Tata Letak –> Tambah gadget HTML/JavaScript

Beri title/judul yang anda inginkan dan Pada kolom konten masukkan kode berikut:

<style type="text/css">
.top-commenter-line img {
-webkit-border-radius: 100px; -moz-border-radius: 100px; border-radius: 100px; -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, .4); -moz-box-shadow: 0 1px 3px rgba(0, 0, 0, .4); box-shadow: 0 1px 3px rgba(0, 0, 0, .4);
margin-left:5px;margin-right:5px;
}
.top-commenter-line {margin: 5px 0;border-bottom:1px solid #eee;padding:3px 5px 6px 0px;}
.top-commenter-line .profile-name-link {padding-left:0;font-weight:bold;}
.top-commenter-avatar {vertical-align:middle;width:30px;height:30px;
}
</style>
<script type="text/javascript">
//
// Top Commentators gadget with avatars, by MS-potilas 2012.
// Gets a list of top commentators from all comments, or specified number of days in the past.
// See http://yabtb.blogspot.com/2012/05/top-commenters-gadget-with-avatars.html
//
// CONFIG:
var maxTopCommenters = 5;   // how big a list of top commentators
var minComments = 1;        // how many comments must top commentator have at least
var numDays = 0;            // from how many days (ex. 30), or 0 from "all the time"
var excludeMe = true;       // true: exclude my own comments
var excludeUsers = ["Anonymous", "Nama Admin"];     // exclude these usernames
var maxUserNameLength = 42; // 0: don't cut, >4: cut usernames
//
var txtTopLine = '<b>[#].</b> [image] [user] ([count])';
var txtNoTopCommenters = 'No top commentators at this time.';
var txtAnonymous = '';      // empty, or Anonymous user name localized if you want to localize
//
var sizeAvatar = 56;
var cropAvatar = true;
//
var urlNoAvatar = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjFRALbEpWCogw1aCW-qWQVCOWLj2OTAWNh2K9JeNmV-FLrbmIQFfuCQqsT66yVYR-R2x4GofRxkYbxIFMQBxmTxa-pacQQ3u4jUuFyGjBaADaLDOvzhyphenhyphen-qyL3Mua1XLMg6pmUHL1aKaYM/"+sizeAvatar+"/avatar_blue_m_96.png"; // http://www.blogger.com/img/avatar_blue_m_96.png resizeable
var urlAnoAvatar = 'http://www.gravatar.com/avatar/00000000000000000000000000000000?d=mm&s=' + sizeAvatar;
var urlMyProfile = ''; // set if you have no profile gadget on page
var urlMyAvatar = '';  // can be empty (then it is fetched) or url to image
// config end
// for old IEs & IE modes:
if(!Array.indexOf) {
 Array.prototype.indexOf=function(obj) {
  for(var i=0;i<this.length;i++) if(this[i]==obj) return i;
  return -1;
}}
function replaceTopCmtVars(text, item, position)
{
  if(!item || !item.author) return text;
  var author = item.author; 

  var authorUri = "";
  if(author.uri && author.uri.$t != "")
    authorUri = author.uri.$t; 

  var avaimg = urlAnoAvatar;
  var bloggerprofile = "http://www.blogger.com/profile/";
  if(author.gd$image && author.gd$image.src && authorUri.substr(0,bloggerprofile.length) == bloggerprofile)
    avaimg = author.gd$image.src;
  else {
    var parseurl = document.createElement('a');
    if(authorUri != "") {
      parseurl.href = authorUri;
      avaimg = 'http://www.google.com/s2/favicons?domain=' + parseurl.hostname;
    }
  }
  if(urlMyProfile != "" && authorUri == urlMyProfile && urlMyAvatar != "")
    avaimg = urlMyAvatar;
  if(avaimg == "http://img2.blogblog.com/img/b16-rounded.gif" && urlNoAvatar != "")
    avaimg = urlNoAvatar;
  var newsize="s"+sizeAvatar;
  avaimg = avaimg.replace(/\/s\d\d+-c\//, "/"+newsize+"-c/");
  if(cropAvatar) newsize+="-c";
  avaimg = avaimg.replace(/\/s\d\d+(-c){0,1}\//, "/"+newsize+"/"); 

  var authorName = author.name.$t;
  if(authorName == 'Anonymous' && txtAnonymous != '' && avaimg == urlAnoAvatar)
    authorName = txtAnonymous;
  var imgcode = '<img class="top-commenter-avatar" height="'+sizeAvatar+'" width="'+sizeAvatar+'" title="'+authorName+'" src="'+avaimg+'" />';
  if(authorUri!="") imgcode = '<a href="'+authorUri+'">'+imgcode+'</a>'; 

  if(maxUserNameLength > 3 && authorName.length > maxUserNameLength)
    authorName = authorName.substr(0, maxUserNameLength-3) + "...";
  var authorcode = authorName;
  if(authorUri!="") authorcode = '<a class="profile-name-link" href="'+authorUri+'">'+authorcode+'</a>'; 

  text = text.replace('[user]', authorcode);
  text = text.replace('[image]', imgcode);
  text = text.replace('[#]', position);
  text = text.replace('[count]', item.count);
  return text;
} 

var topcommenters = {};
var ndxbase = 1;
function showTopCommenters(json) {
  var one_day=1000*60*60*24;
  var today = new Date(); 

  if(urlMyProfile == "") {
    var elements = document.getElementsByTagName("*");
    var expr = /(^| )profile-link( |$)/;
    for(var i=0 ; i<elements.length ; i++)
      if(expr.test(elements[i].className)) {
        urlMyProfile = elements[i].href;
        break;
      }
  } 

  for(var i = 0 ; i < json.feed.entry.length ; i++ ) {
    var entry = json.feed.entry[i];
    if(numDays > 0) {
      var datePart = entry.published.$t.match(/\d+/g); // assume ISO 8601
      var cmtDate = new Date(datePart[0],datePart[1]-1,datePart[2],datePart[3],datePart[4],datePart[5]); 

      //Calculate difference btw the two dates, and convert to days
      var days = Math.ceil((today.getTime()-cmtDate.getTime())/(one_day));
      if(days > numDays) break;
    }
    var authorUri = "";
    if(entry.author[0].uri && entry.author[0].uri.$t != "")
      authorUri = entry.author[0].uri.$t; 

    if(excludeMe && authorUri != "" && authorUri == urlMyProfile)
      continue;
    var authorName = entry.author[0].name.$t;
    if(excludeUsers.indexOf(authorName) != -1)
      continue; 

    var hash=entry.author[0].name.$t + "-" + authorUri;
    if(topcommenters[hash])
      topcommenters[hash].count++;
    else {
      var commenter = new Object();
      commenter.author = entry.author[0];
      commenter.count = 1;
      topcommenters[hash] = commenter;
    }
  }
  if(json.feed.entry.length == 200) {
    ndxbase += 200;
    document.write('<script type="text/javascript" src="http://'+window.location.hostname+'/feeds/comments/default?redirect=false&max-results=200&start-index='+ndxbase+'&alt=json-in-script&callback=showTopCommenters"></'+'script>');
    return;
  } 

  // convert object to array of tuples
  var tuplear = [];
  for(var key in topcommenters) tuplear.push([key, topcommenters[key]]); 

  tuplear.sort(function(a, b) {
    if(b[1].count-a[1].count)
        return b[1].count-a[1].count;
    return (a[1].author.name.$t.toLowerCase() < b[1].author.name.$t.toLowerCase()) ? -1 : 1;
  }); 

  // list top topcommenters:
  var realcount = 0;
  for(var i = 0; i < maxTopCommenters && i < tuplear.length ; i++) {
    var item = tuplear[i][1];
    if(item.count < minComments)
        break;
    document.write('<di'+'v class="top-commenter-line">');
    document.write(replaceTopCmtVars(txtTopLine, item, realcount+1));
    document.write('</d'+'iv>');
    realcount++;
  }
  if(!realcount)
    document.write(txtNoTopCommenters);
} 
document.write('<script type="text/javascript" src="http://'+window.location.hostname+'/feeds/comments/default?redirect=false&max-results=200&alt=json-in-script&callback=showTopCommenters"></'+'script>');
</script>

Silahkan konfigurasikan widget sesuai keinginan anda.

Tulisan berwarna Biru dan bercetak tebal diatas (Nama Admin), silahkan diganti dengan nama anda jika anda tidak menginginkan masuk dalam lists top komentator

Simpan dan lihat hasilnya di blog anda.

Sampai disini tutorial menambahkan widget top komentator di blog. Semoga bermanfaat.

Modifikasi Widget Profil Blogger

Ada beberapa pilihan modifikasi widget profil blog, intinya hanya pada permainan CSS, karena yang ditanya adalah yang terpasang diblog ini maka saya hanya akan memberikan kode sesuai permintaan, untuk selanjutnya anda bisa lebih kreatif dalam membuat modifikasi lainnya.

Baiklah silahkan ikuti langkah-langkah berikut:

cara membuat modifikasi widget profil blogger di blog

1. Setelah login ke akun anda.
2. Pada dasbor >> masuk menu tata letak >> klik tambah gadget >> HTML/JavaScript
3. Pada kolom title beri nama sesuai keinginan, selanjutnya copy dan tempelkan kode HTML berikut pada kolom kontent

<style>
#profileKamu{
border:2px solid #888; margin:2px 5px 0px 0px; padding:2px;
}
#profileKamu:hover {
border:2px solid #ccc;
cursor:pointer;
}
.opacity  {
opacity: 0.5;
margin-left: 50px;
-moz-transition: all 0.5s ease-out;  
-o-transition: all 0.5s ease-out;  
-webkit-transition: all 0.5s ease-out;  
-ms-transition: all 0.5s ease-out;  
transition: all 0.5s ease-out;
-moz-transform: rotate(7deg);  
-o-transform: rotate(7deg);  
-webkit-transform: rotate(7deg);  
-ms-transform: rotate(7deg);  
transform: rotate(7deg);  
filter: progid:DXImageTransform.Microsoft.Matrix(
                    M11=0.9961946980917455, M12=-0.08715574274765817, M21=0.08715574274765817, M22=0.9961946980917455, sizingMethod='auto expand');
zoom: 1;  
}
.opacity:hover  {
opacity: 1;
margin-left: 0px;
-moz-transform: rotate(0deg);  
-o-transform: rotate(0deg);  
-webkit-transform: rotate(0deg);  
-ms-transform: rotate(0deg);  
transform: rotate(0deg);  
filter: progid:DXImageTransform.Microsoft.Matrix(
                    M11=1, M12=0, M21=0, M22=1, sizingMethod='auto expand');
zoom: 1;
-moz-box-shadow: 1px 1px 4px #000;
-webkit-box-shadow: 1px 1px 4px #000;
box-shadow: 1px 1px 4px #000;
} 
</style>
   <!--[endif]----> 

<img align="left" class="opacity" id="#profileKamu" src="URL YOUR IMAGE PROFIL" />About YOU<a href="YOUR LINK BLOGGER PROFIL" style="color: #888888;">...Read More</a><!--![endif]----> 

<div class="clear">
</div>
<span class="widget-item-control">
<span class="item-control blog-admin">
<a class="quickedit" href="http://www.blogger.com/blogID=5781730866338756976&amp;widgetType=Profile&amp;widgetId=Profile1&amp;action=editWidget&amp;sectionId=lowerbar1" onclick="return _WidgetManager._PopupConfig(document.getElementById(&quot;HTML1&quot;));" target="configHTML1" title="Edit">
</a>
</span>
</span>
<br />
<div class="clear">
</div>

Kustomisasi

Ganti profilAmatullah dengan nama profil anda,
perhatikan tulisan tebal berwarna diatas, ganti dan sesuaikan dengan keinginan anda
ganti blog ID dengan ID blog anda
silahkan jika ingin menambahkan CSS untuk modifikasi sesuai keinginan.

4. Simpan dan klik simpan lagi. Lihat hasilnya diblog anda

sampai disini, cara modifikasi tampilan widget profil blogger pada blog. Semoga bermanfaat.

Trik Shortcut Android 4.2 Jelly Bean

Jelly Bean adalah sistem operasi Android yang paling mutakhir saat ini sebelum nanti diluncurkannya Key Lime Pie sebagai Android 5.0. Saat ini banyak smartphone dengan spesifikasi high-end melintas dengan OS yang satu ini. Dengan segudang fitur dan design yang top membuat betah untuk berlama-lama menggunakan ponsel Android.

Berbagai tips dan trik Android untuk Anda yaitu shortcut Android 4.2 Jelly Bean yang perlu kamu ketahui. Dikutip TeknoFlas dari RumpiTekno (08/04/2013), simak tips Android berikut ini.

1. Akses Quick Settings: Menggunakan dua jari untuk swipe bar notifikasi merupakan salah satu opsi mengakses Quick Settings di Android Anda. Jika Anda lupa dan menggunakan satu tangan Anda karena kebiasaan, Anda masih bisa menuju ke Quick Settings dengan cepat dengan tap bagian bawah bar notifikasi dengan jari yang lain.

2. Mengatur waktu dan tanggal: jika Anda ingin mengganti pengaturan waktu dan tanggal dengan cepat, Anda bisa tarik ke bawah bar notifikasi dan tap di jam di pojok kiri atas untuk langsung menuju settings.

3. Membuka Google Now: untuk akses Google Now dengan cepat, swipe ke atas dari bawah screen Anda dan drag jari Anda ke tombol “Google Now” dan hasilnya akan muncul. Tidak masalah dari (aplikasi) mana Anda menggesernya, shortcut tersebut akan tetap bekerja.

4. Unlocking Developer Options: di versi 4.2 developer option tersembunyi karena aturan default-nya. Untuk unlock developer options, tap settings> About Phone dan tap opsi “build number” beberapa kali sampai Anda mendapatkan pesan yang memberitahukan bahwa Anda telah menjadi developer.

5. Unlocking Easter Egg Day Dream: Day Dream adalah fitur baru di Android Jelly Bean 4.2 , jika Anda mau Jelly Bean Easter Egg tersedia, lakukan hal ini: Masuk ke settings> About Phone dan tap beberapa kali opsi “Android Version” hingga Anda melihat big ‘ol Jelly Bean.

6. Switching Tabs: Chrome adalah default browser pada Android 4.2 dan Anda dapat switching tab dengan mudah dengan sedikit trik. Swipe dari ujung screen ponsel Anda (dari kiri atau kanan) ke ujung yang lain beralih bolak-balik antara tab yang terbuka di Chrome Anda.

7. Identify Buttons: Dengan ICS , Google mengubah system menu lama dengan action bar baru. Hal ini akan memudahkan, kecuali juka Anda tidak tahu apa fungsi dari tombol-tombol kecil pada action bar. Nah, cara untuk menghindari mencari tahu melalui trial dan error hanyalah dengan menekan tombol tak Anda kenal agak lama dan Anda akan mendapat sedikitpemberitahuan Anda apa fungsi tombol tersebut.

8. Switching Keyboards:Dengan keyboard emoji baru yang hadir di Android 4.2, anda mungkin ingin tahu bagaimana cara beralih (switching) keyboard dengan cepat. Caranya mudah. Tekan dan tahan space bar dan Anda akan mendapatkan pop up yang memungkinkan Anda memilih inputs method yang tersedia.

9. Lihat Foto Original: Dengan Foto Editing Android Jelly Bean, Anda bisa dengan cepat melupakan bagaimana foto yang original (apalagi jika versi editan lebih baik). Daripada harus membuang-buang waktu kembali ke gallery Anda, Anda bisa swipe ke bawah ketika proses editing untuk melihat foto yang belum diedit.

10. Quick Uninstall: Jika Anda ingin uninstall sebuah aplikasi di smartphone Anda dengan cepat, Anda tidak perlu melakukannya melalui Google Play store atau masuk ke settings. Anda tinggal membuka launcher aplikasi Anda dan tekan kemudian tahan aplikasi yang Anda ingin uninstall. Setelah anda menekan dan tahan aplikasi tersebut akan muncul dua pilihan tombol di layar smartphone Anda. Untuk menghapus aplikasi, drag aplikasi ke tombol uninstall dan lepaskan.

Jika Anda belum jelas mengenai tips diatas bisa langsung praktek dan lihat video dibawah ini.

sumber : TeknoFlas.com

Cara Membuat Author Box Di Bawah Postingan

Kali ini aku akan bagikan bagaimana cara membuat Author Box di bawah posting. Kalian tentu pernah melihat ada sebuah kotak profil penulis di bawah postingan, Author Box ini juga sering disebut sebagai permalink. Mau tau cara buat dan cara pasangnya di blog kalian? silahkan lanjutkan bacanya

Permalink adalah sebuah Link atau tautan yang merujuk ke Suatu blog atau forum tertentu masuk setelah berlalu dari halaman depan ke arsip. Kebanyakan pengguna Blogger memasang permalink pada bagian bawah postingan mereka. Dalam kotak Permalink tersebut dalam kota tersebut sudah ada tag atau kode html yang berisi permalink dari postingan yang sedang dibuka atau dibacanya. Permalink ini juga berfungsi untuk mempermudah pembaca atau pengguna blog lain agar mengetahui permalink dari postingan yang sedang dibacanya. Supaya Pengguna Blog lain bisa menyematkan atau menaruh kode HTML permalink itu di blog mereka, sehingga memberikan tautan (backlink) ke halaman postingan tadi.

Cara Memasang Permalink Pada Blog :

Login Ke Dashboard Blog Sobat masing-masing
Pilih Menu Template
Pilih Menu Edit Html (Jangan lipa beri tanda centang Expand Template Widget)
Selanjutnya silahkan cari kode ]]></b:skin>
Kemudian Letakan kode Berikut Tepat diatas kode ]]></b:skin>

admin-tulisan{width:auto;background:#333;border:2px solid #aaa;margin:30px 0 10px 0;display:block;font-family:"julee";

color:#aaa;}
.admin-tulisan .kontainer{padding:5px;}
.admin-tulisan h4{background:#000000;border:none;border-bottom:1px solid #000000;color:#fff;font-family:"julee";text-shadow:0 1px 0 rgba(0, 0, 0, 0.4);padding:5px 10px;margin:0 0 0 0;display:block;}.admin-tulisan h4 a{color:#000000;}
.admin-tulisan img{background:#000000;width:90px;height:100px;border:1px solid #000000;margin:3px 10px 0 0;float:left;padding:2px;box-shadow:none;-moz-box-shadow:none;-webkit-box-shadow:none;}

Keterangan : Angka 90 yang saya beri warna Kuning tersebut adalah Lebar dari permalink. dan angka 100 yang warna Kuning adalah tingginya. Sobat bisa menyesuaikanya dengan template sobat masing-masing

Selanjutnya cari kode <data:post.body/>
Jika Sobat menggunakan template yang menggunakan auto readmore, kemungkinan kode tersebut ada dua buah. silahkan pilih kode yang nomer dua.
Lalu Letakkan kode berikut tepat dibawah kode <data:post.body/> tadi.

<b:if cond='data:blog.pageType == "item"'>
<div class='admin-tulisan'>
<h4>Ditulis Oleh : <b><data:post.author/></b> ,Menjadi Lebih Baik</h4>
<div class='kontainer'>
<img alt='Dwi Pratama' src='http://lh3.googleusercontent.com/-0o3cJfWH_lo/AAAAAAAAAAI/AAAAAAAAAEs/uUfYHAZhj9k/s512-c/photo.jpg'/>
Anda sedang membaca artikel tentang <b><a expr:href='data:post.url'><data:post.title/></a></b>. Oleh Admin Menjadi Lebih Baik, Anda diperbolehkan mengcopy-paste atau menyebar-luaskan artikel ini, namun jangan lupa untuk meletakkan link dibawah ini sebagai sumbernya
<textarea cols='50' id='bloglinking' name='bloglinking' onclick='this.focus();this.select()' onfocus='this.select()' onmouseover='this.focus()' readonly='readonly' rows='2'><a href="<data:post.url/>" target="_blank"><data:blog.pageName/></a></textarea>
<p><span style='float:right;font:italic 10px Arial, Sans-Serif;'>
<a href='http://lhk-blogs.blogspot.com/' target='_blank'>:: Pasang Widget Ini ::</a></span></p><div style='clear:both;'/></div></div>
</b:if>

Keterangan : Kode yang saya beri warna Biru adalah URL atau alamat Gambar yang akan Sobat gunakan pada permalink tersebut. jadi silahkan ganti dengan URL Gambar sobat masing-masing.

Silahkan Save Template kalian dan lihat hasilnhya.

Sekian Postinganku kali ini, semoga bisa bermanfaat.

Cara Membuat Menu Tab View Di Blog

Bagaimana Cara Pasang Tab View Menu Di blog ?, Jangan kemana-mana ikuti terus Master Chef karena Master Chef akan membahas tuntas mengenai resep ini. Berikut langkah-langkahnya :

Menu Tab View Blog

Silahkan masing-masing login kehalaman blog
Jika semua sudah masuk ke akun blog masing-masing, sekarang Akses halaman Edit HTML Blogspot
Jangan lupa juga untuk download template lengkap untuk antisipasi kesalahan dalam edit HTML
Jika sudah masuk hlaman Edit HTML cari kode ]]></b:skin> ( Gunakan tombol CTRL + F dan F3 untuk mempermudah pencarian kode )
Jika kode sudah ditemukan Copy kode dibawah dan letakan diatas kode ]]></b:skin>

div.TabView div.Tabs { height: 24px; overflow: hidden; } div.TabView div.Tabs a { float: left; display: block; width: 90px; /* Lebar Menu Utama Atas */ text-align: center; height: 24px; /* Tinggi Menu Utama Atas */ padding-top: 3px; vertical-align: middle; border: 1px solid #000; /* Warna border Menu Atas */ border-bottom-width: 0; text-decoration: none; font-family: "Times New Roman", Serif; /* Font Menu Utama Atas */ font-weight: 900; color: #000; /* Warna Font Menu Utama Atas */ } div.TabView div.Tabs a:hover, div.TabView div.Tabs a.Active { background-color: #FF9900; /* Warna background Menu Utama Atas */ } div.TabView div.Pages { clear: both; border: 1px solid #6E6E6E; /* Warna border Kotak Utama */ overflow: hidden; background-color: #FF9900; /* Warna background Kotak Utama */ } div.TabView div.Pages div.Page { height: 100%; padding: 0px; overflow: hidden; } div.TabView div.Pages div.Page div.Pad { padding: 3px 5px; }

Biru

Simpan template

Tata Letak atau Layout

Add a Gadget

Tabah a Gadget

<form action="tabview.html" method="get"> <div class="TabView" id="TabView"> <div class="Tabs" style="width: 350px;"> <a>Tab 1</a> <a>Tab 2</a> <a>Tab 3</a> </div> <div class="Pages" style="width: 350px; height: 250px;"> <div class="Page"> <div class="Pad"> Tab 1.1 <br /> Tab 1.2 <br /> Tab 1.3 <br /> </div> </div> <div class="Page"> <div class="Pad"> Tab 2.1 <br /> Tab 2.2 <br /> Tab 2.3 <br /> </div> </div> <div class="Page"> <div class="Pad"> Tab 3.1 <br /> Tab 3.2 <br /> Tab 3.3 <br /> </div> </div> </div> </div> </form> <script type="text/javascript"> tabview_initialize('TabView'); </script>

Keterangan :

Code yang berwarna biru diatas adalah lebar dan tinggi tabview yang bisa kamu sesuaikan.
Code yang berwarna Merah adalah text judul dari menu tabel (tab 1, tab 2, tab 3 ....)

Contoh punya saya: Tab 1 ganti dg BLOG

Tab 2 ganti dg Facebook

Tab 3 ganti dg Tips Trik

3. Code yang berwarna Pink diatas adalah halaman dari tabel yang bisa kamu pasangi code-code gagdet, gambar atau link.

12. Klik Simpan
13. Selesai dan Lihat hasilnya

Sangat mudah bukan? Sekian tutorial saya mengenai Cara Membuat Menu Tab View Di Blog, Untuk Anda yang sedang mencari gadget apa yang paling bagus? saran kami adalah Acer Iconia PC Tablet Dengan Windows 8, setelah memiliki gadget ini pasti ingin memasukkan software dan game kan? saran kami adalah download di JalanTikus.com: Download Gratis, Aman dan Cepat. Dan untuk menyenangkan si buah hati, kunjungi Keretamini.com Pabrik Kereta Mini No 1 Ready Stock terima kasih.

Langganan: Postingan ( Atom )

Gudang Makalah