Cara menghilangkan link diberdayakan oleh blogger

Assalamualaikum.
Link diberdayakan oleh blogger (powered by blogger) atau link atribusi biasanya terletak dibagian footer blog,banyak pengguna blogger yang membiarkan link ini tetap berada di blog,namun banyak pula sebagian pengguna blogger yang menghilangkan link tersebut dengan tujuan tertentu.
Bagi anda yang ingin menghilangkan link tersebut,maka di tutorial kali ini saya akan share caranya.
Ditutorial ini saya akan memberikan 3 opsi cara yang dapat anda pilih salah satu,baiklah berikut cara menghilangkan link diberdayakan oleh blogger.

A.CARA PERTAMA
Cara pertama adalah dengan cara menghapus link diberdayakan oleh blogger pada bagian tata letak tanpa menghilangkan kode pada bagian template blog.
1.Silahkan anda login terlebih dahulu ke blogger.com.
2.Jika sudah? Di halaman dashboard blogger silahkan anda klik Template > Edit HTML.
3.Berikutnya silahkan anda cari kode berikut ini:
<b:widget id='Attribution1' locked='true' title='' type='Attribution' visible='true'>

Silahkan anda ganti kata perintah true yang sudah saya beri warna merah dengan kata false,sehingga hasilnya akan menjadi seperti kode berikut ini.
<b:widget id='Attribution1' locked='false' title='' type='Attribution' visible='true'>

4.Jika sudah? berikutnya anda klik simpan untuk menyimpan perubahan.
5.Berikutnya silahkan anda klik Tata Letak.
6.Berikutnya anda klik edit pada bagian layout footer,seperti contoh gambar dibawah ini:
Cara menghilangkan link diberdayakan oleh blogger
7.Berikutnya akan muncul tab kecil baru,silahkan anda klik hapus,seperti contoh gambar dibawah ini.

Cara menghilangkan link diberdayakan oleh blogger

8.Sekarang link tulisan diberdayakan oleh blogger sudah menghilang dari blog anda.

B.CARA KEDUA
Cara kedua adalah menghapus link diberdayakan oleh blogger secara permanen yaitu dengan cara menghapusnya melalui template.
1.Pada halaman dashboard blogger,silahkan anda klik TemplateEdit HTML.
2.Berikutnya silahkan anda cari kode seperti berikut ini.
 <b:widget id='Attribution1' locked='false' title='' type='Attribution' visible='true'>
          <b:includable id='main'>
    <b:if cond='data:feedbackSurveyLink'>
      <div class='mobile-survey-link' style='text-align: center;'>
        <data:feedbackSurveyLink/>
      </div>
    </b:if>
    <div class='widget-content' style='text-align: center;'>
      <b:if cond='data:attribution != &quot;&quot;'>
       <data:attribution/>
      </b:if>
    </div>
    <b:include name='quickedit'/>
  </b:includable>
        </b:widget>

3.Berikutnya silahkan anda hapus semua kode tersebut.
4.Jika sudah? berikutnya anda klik simpan untuk menyimpan perubahan.
5.Sekarang link tulisan diberdayakan oleh blogger sudah menghilang dari blog anda.

C.CARA KETIGA
Cara ketiga adalah dengan cara menyembunyikan link diberdayakan oleh blogger tanpa menghapus kode pada bagian template,ada namun tersembunyi.
1.Pada halaman dashboard blogger,silahkan anda klik Template > Edit HTML.
2.Berikutnya silahkan anda cari kode:
]]></b:skin>

3.Jika sudah? Silahkan anda copy kode dibawah ini:
#Attribution1 {height:0px;visibility:hidden;display:none}

4.Silahkan paste kode yang saya berikan diatas kode ]]></b:skin>.
5.Berikutnya silahkan anda klik simpan untuk menyimpan perubahan.

Demikianlah cara menghilangkan link tulisan diberdayakan oleh blogger pada blog berplatform blogger.com,namun perlu anda perhatikan bahwa lebih baik anda membiarkan link diberdayakan oleh blogger tersebut tetap ada sebagai wujud terimakasih kepada blogger.com.Pilihan saya serahkan kepada anda.
Terimakasih telah berkunjung dan semoga bermanfaat.
Assalamualaikum.
Selengkapnya ➢

Cara memasang dan menggunakan google font di blogger

Cara memasang dan menggunakan google font di blogger

Assalamulaikum.
Bagi anda yang sedang memodifikasi template blog,tentunya anda juga memikirkan style font apa saja yang akan anda gunakan untuk blog anda.Anda dapat mengganti style font yang anda sukai dengan cara masuk ke menu perancang template yang telah disediakan oleh pihak blogger.com maupun masuk pada menu edit HTML template.
Namun bagi anda yang kurang puas dengan style font yang telah disediakan oleh blogger.com,maka sebaiknya anda memasang font dari luar blogger.com.Adapun layanan penyedia font yang paling sering dipakai para pendesain template baik amatir seperti saya maupun yang sudah mahir adalah layanan google font,dimana google font memiliki banyak sekali jenis font yang dapat dipakai untuk keperluan blogging atau web.
Bagi anda yang belum memahami bahkan belum tau tentang cara memasang dan menggunakan google font ini,maka dikesempatan kali ini saya akan share tutorialnya yang semoga mudah anda fahami.


CARA MENDAPATKAN KODE GOOGLE FONT
Pertama-tama yang anda harus lakukan adalah mendapatan kode font yang anda sukai di situs google font uttuk berikutnya dipasang kedalam template blog anda.
Caranya adalah sebagai berikut ini:
1.Silahkan anda kunjungi situs google font
2.Berikutnya silahkan anda cari font yang anda sukai,lalu pilih quick use,seperti contoh gambar dibawah ini.
Cara memasang dan menggunakan google font di blogger

3.Berikutnya,silahkan anda pilih style font sesuai dengan kebutuhan anda,caranya yaitu dengan memberi tanda ceck (centang) pada kolom ceck yang telah disediakan.
Seperti contoh gambar dibawah ini.
Cara memasang dan menggunakan google font di blogger

Perhatian:
Perlu anda ingat bahwa semakin banyak style font yang anda gunakan maka semakin berat pula loadingnya,

4.Jika sudah? Berikutnya anda geser kursor ke halaman bawah,nanti anda akan melihat kode dari font tersebut,berikutnya anda copy kode tersebut,seperti contoh gambar dibawah ini.
Cara memasang dan menggunakan google font di blogger

CARA MEMASANG KODE GOOGLE FONT DI TEMPLATE BLOGGER
Jika anda sudah berhasil mendapatkan kode di google font,maka langkah berikutnya adalah memasang kode tersebut didalam template blogger.
Caranya adalah sebagai berikut ini:
1.Pertama-tama silahkan anda login ke blogger.com.
2.Di halaman dashboard blogger,silahkan anda klik template > Edit HTML.
3.Berikutnya silahkan anda paste kode font yang anda dapatkan dari google font diatas kode <head> pada template blog anda.
4.Jangan lupa menambahkan tag penutup "/" (tanpa tanda kutip),pada kode yang anda paste tersebut.
Misalnya,kode yang anda dapat dari google font adalah sebagai berikut:
fonts.googleapis.com/css?family=PT+Sans:400,700' rel='stylesheet' type='text/css'>
Silahkan anda beri tag penutup "/" pada bagian akhir kode,sehingga hasilnya akan seperti contoh berikut ini : (perhatikan teks yang berwarna merah)
fonts.googleapis.com/css?family=PT+Sans:400,700' rel='stylesheet' type='text/css'/>
5.Berikutnya silahkan anda klik simpan untuk menyimpan perubahan.

CARA MENGGUNAKAN GOOGLE FONT
Jika anda sudah berhasil memasang kode google font pada template,berikutnya adalah menggunakan font tersebut didalam css style template blog anda.
Caranya adalah sebagai berikut ini:
1.Pertama-tama silahkan anda login ke blogger.com.
2.Di halaman dashboard blogger,silahkan anda klik template Edit HTML.
3.Misalnya anda ingin mengubah font pada bagian header dengan font yang anda gunakan dari google font yaitu "PT Sans".
Maka silahkan anda cari kode :
#header h1{
  margin:5px 5px 0;
  padding:15px 20px .25em;
  font: $(header.font);
  color: $(header.text.color);
  text-shadow: $(header.shadow.offset.left) $(header.shadow.offset.top) $(header.shadow.spread) rgba(0, 0, 0, .2);
}
Coba anda perhatikan kode diatas yang saya beri warna merah,silahkan anda ganti jenis font tersebut dengan jenis google font yang anda gunakan,sehingga hasilnya seperti berikut ini:
#header h1{
  margin:5px 5px 0;
  padding:15px 20px .25em;
  font: PT Sans;
  color: $(header.text.color);
  text-shadow: $(header.shadow.offset.left) $(header.shadow.offset.top) $(header.shadow.spread) rgba(0, 0, 0, .2);
}
4.Jika sudah? silahkan anda klik simpan untuk menyimpan perubahan.

Demikianlah cara memasang dan menggunakan google font di blogger.Namun,perlu anda ingat bahwa tutorial diatas hanyalah tutorial secara garis besarnya saja,karena sebenarnya anda dapat melakukan berbagai variasi font yang style yang berbeda-beda dan anda dapat mengganti semua font yang ada didalam template blog.Bukan hanya di bagian header saja,namun dapat anda aplikasikan juga pada bagian sidebar,link,posting,bahkan anda dapat mengganti keseluruhan font di blog dengan google font.
Semoga bermanfaat dan terimakasih telah berkunjung.
Assalaamualaikum.
Selengkapnya ➢

Cara memasang font awesome icon di blog

Cara memasang font awesome icon di blog

Assalamualaikum.
Untuk membuat blog lebih menarik tentunya kita juga memerlukan icon-icon gambar kecil yang dapat dipasang di blog.Jika dulu kita hanya dapat memasang icon gambar dengan URL file gambar online,maka disaat ini kita dapat memasang icon dengan bantuan font awesome icon,sehingga loading blog tidak terlalu berat.
Untuk pemasangan font awesome icon di blog tidaklah sulit,karena caranya sama dengan halnya kita memasang jquery dan bootstrap yaitu memasang pemanggil font awesome diatas kode </head> dan menyisipkan kode font pada bagian html teks atau link yang kita sukai.
Bagi anda yang belum mengetahui caranya,maka dikesempatan kali ini saya akan share caranya.

CARA MEMASANG FONT AWESOME ICON DI BLOG
1.Pertama-tama silahkan anda login ke blogger.com.
2.Berikutnya silahkan anda klikTemplate > Edit HTML.
3.Berikutnya silahkan anda cari kode </head>.
4.Berikutnya silahkan anda masukkan kode berikut diatas kode </head>.
<link href='//maxcdn.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css' rel='stylesheet'/>
5.Berikutnya silahkan anda buka tab baru pada browser,lalu kunjungi situs fortawesome.github.io/Font-Awesome/icons
6.Nanti anda akan melihat banyak sekali icon,silahkan anda klik icon yang anda sukai,seperti contoh gambar dibawah ini.

Cara memasang font awesome icon di blog

7.Berikutnya anda akan dibawa ke halaman baru,anda akan melihat kode dari icon yang anda klik tadi,silahkan anda copy kode tersebut,seperti contoh gambar dibawah ini.

Cara memasang font awesome icon di blog

8.Berikutnya adalah menyisipkan kode tersebut kedalam HTML link atau teks didalam template blogger,misalnya saya akan membuat link di bagian navigasi dropdown,maka kode standard untuk penulisan link adalah sebagai berikut ini.
<a href='URL LINK'> TEKS LINK </a>
Untuk menyisipkan font awesome icon,silahkan anda masukkan kode font awesome yang sudah anda copy setelah kode <a href='URL LINK'>,sehingga hasilnya adalah sebagai berikut.
<a href='URL LINK'><i class='fa fa-user'></li> TEKS LINK </a>
9.Berikutnya silahkan anda klik simpan untuk menyimpan perubahan.

Silahkan anda kunjungi blog anda untuk melihat hasilnya,sebenarnya banyak efek untuk font awesome icon ini,namun disini saya hanya share cara pemasangannya saja sebagai dasar.
Demikianlah cara memasang font awsome icon di blog.
Semoga bermanfaat dan terimkasih atas kunjungan anda.
Assalamualaikum.
Selengkapnya ➢

Cara membuat recent post di sidebar blogger

Cara membuat recent post di sidebar bloggerAssalamualaikum.
Recent post adalah sebuah widget artikel terbaru atau posting yang baru diterbitkan di suatu blog,untuk itu keberadaan recent post ini juga dinilai penting.Kenapa? Agar posting yang baru saja terbitkan tersebut mendapat traffic pengunjung yang cukup baik dan tidak kalah dengan artikel atau posting yang lama.

Recent post ini biasanya di letakkan di bagian sidebar blog dengan bentuk mirip popular post,namun ada juga recent post yang dibuat dibagian croscoll (antara header dan posting) dan ada juga recent post yang diletakkan dibagian atas header blog yang bentuknya mirip headline dengan teks/link yang
bergerak.
Bagaimana cara membuat recent post di sidebar blogger?
Karena judul dari tutorial ini adalah cara membuat recent post di sidebar blogger,maka mohon maaf disini saya akan share cara membuat recent post di bagian sidebar blogger saja.

CARA MEMBUAT RECENT POST DI SIDEBAR BLOGGER
1.Pertama-tama silahkan anda login ke blogger.com.
2.Berikutnya silahkan anda klik tata letak,seperti contoh gambar dibawah ini.
Cara membuat recent post di sidebar blogger

3.Berikutnya silahkan anda klik add gadget pada bagian layout sidebar,seperti contoh gambar dibawah ini.
Cara membuat recent post di sidebar blogger

4.Berikutnya silahkan anda pilih HTML/Javascript seperti contoh gambar dibawah ini.
Cara membuat recent post di sidebar blogger

5.Berikutnya silahkan anda masukkan kata artikel terbaru atau terserah anda (pada bagian kolom judul),lalu masukkan kode berikut pada bagian konten.
<style type='text/css'>
img.recent_thumb {width: 90px;height: 70px;float: left;
margin-right: 10px;}.recent_posts_with_thumbs {float: left;width: 100%;min-height: 70px;margin: 5px 0px 5px 0px;padding: 0;font-size:12px;}
ul.recent_posts_with_thumbs li {padding-bottom:5px;padding-top:5px;min-height:65px;} .recent_posts_with_thumbs a {text-decoration:none;} .recent_posts_with_thumbs strong {font-size:10px;}</style><script style='text/javascript' src='https://googledrive.com/host/0BzPgmXeCwsMRcmlNOHhtaDNNMjA'></script><script style='text/javascript'>
var numposts = 5;
var showpostthumbnails = true;
var displaymore = false;

 var displayseparator = false;
var showcommentnum = false;
var showpostdate = false;
var showpostsummary = true;
var numchars = 50;</script>
<script src='/feeds/posts/default?orderby=published&alt=json-in-script&callback=showrecentpostswiththumbs'></script>
<hr/>

Sehingga hasilnya akan seperti contoh gambar dibawah ini.
Cara membuat recent post di sidebar blogger

6.Jika sudah? berikutnya silahkan anda klik simpan.

Silahkan anda kunjungi blog anda maka widget recent post akan muncul di bagian sidebar blog anda,
Demikianlah cara membuat widget recent post di sidebar blogger,smoga bermanfaat dan terimakasih atas kunjungan anda.
Assalamualaikum.
Selengkapnya ➢

Cara membuat next page button dengan angka di blog (style ke-2)

Cara membuat next page button dengan angka di blog (style ke-2)

Assalamualaikum.
Seperti yang kita ketahui bahwa tujuan pembuatan navigasi next page,previous page dengan angka di blog adalah untuk memudahkan para pengunjung blog dalam melihat artikel apa saja yang ada di blog yang kita miliki halaman demi halaman.
Untuk jumlah artikel atau posting di tiap satu halaman,kita dapat menentukannya sendiri,semakin banyak jumlah arikel dalam satu halaman maka loading blog akan semakin berat,begitu pula dengan sebaliknya.Untuk itu jumlah artikel pada satu halaman sebaiknya dibatasi maksimal 10 posting atau dibawahnya.
Beberapa saat yang lalu saya telah share cara membuat tombol navigasi next page dengan angka di blog,nah di kesempatan kali ini saya akan share cara membuat next page button dengan angka di blog tentunya dengan style yang berbeda atau saya namakan style ke-2 di blog ini.

Berikut cara membuat nextpage button dengan angka di blog (style yang ke-2)
1.Pertama-tama yang anda harus lakukan adalah masuk ke halaman dashboard blog anda di www.blogger.com dengan menggunakan akun blogger yang anda miliki.
2.Setelah masuk ke halaman dashboard,silahkan anda klik nama blog yang anda miliki (apabila anda memiliki blog lebih dari 1).Contoh seperti gambar dibawah ini.
cara membuat next page button dengan angka di blog

3.Di halaman berikutnya silahkan anda klik template,seperti contoh gambar dibawah ini.
cara membuat next page button dengan angka di blog

4.Selanjutnya anda klik edit HTML,seperti contoh gambar dibawah ini.
cara membuat next page button dengan angka di blog

5.Nanti anda akan bertemu dengan struktur kode-kode yang membentuk template blog anda.Silahkan anda cari kode
 ]]></b:skin>.Agar lebih mudah dalam pencarian kode anda bisa menggunakan CTRL+F (jika anda menggunakan komputer).
6.Silahkan anda masukkan kode CSS berikut ini tepat diatas kode
 ]]></b:skin>.
.showpageArea a{text-decoration:underline}
.showpageNum a{text-decoration:none;border:1px solid #ccc;margin:0 3px;padding:3px}
.showpageNum a:hover{border:1px solid #ccc;background-color:#ccc}
.showpagePoint{color:#333;text-decoration:none;border:1px solid #ccc;background:#ccc;margin:0 3px;padding:3px}
.showpageOf{text-decoration:none;padding:3px;margin:0 3px 0 0}
.showpage a{text-decoration:none;border:1px solid #ccc;padding:3px}
.showpage a:hover{text-decoration:none}
.showpageNum a:link,.showpage a:link{text-decoration:none;color:#333}

7.Berikutnya silahkan anda cari kode </body> lalu masukkan kode dan script berikut ini tepat diatasnya.
<!--Page Navigation Starts-->
<b:if cond='data:blog.pageType != &quot;item&quot;'>
<b:if cond='data:blog.pageType != &quot;static_page&quot;'>
<script type='text/javascript'>
var pageCount=5;
var displayPageNum=5;
var upPageWord =&#39;Previous&#39;;
var downPageWord =&#39;Next&#39;;
</script>
<script src='http://bloggergadgets.googlecode.com/files/blogger_pagenavi_min.js' type='text/javascript'/>
</b:if> </b:if>
<!--Page Navigation Ends -->
Tambahan:
  • Kata prev dan next dapat anda ganti dengan kata yang anda inginkan.
  • Angka 4 yang pertama adalah jumlah post yang ditampilkan untuk setiap page yang di klik.
  • Angka 4 yang kedua adalah jumlah nomor yang ingin ditampilkan diarea homepage blog.
8.Jika sudah? silahkan anda klik simpan untuk menyimpan perubahan.

Silahkan anda kunjungi homepage (halaman utama blog anda) maka navigasi next page dengan angka kini telah muncul dibagian bawah post footer blog anda.
Bagaimana? cukup mudah bukan?
Demikianlah cara membuat next page button dengan angka di blog (style ke-2).
Semoga bermanfaat dan terimakasih telah berkunjung.
Assalamualaikum.
Selengkapnya ➢