Cara Menampilkan File PDF di Dalam Postingan Blog

Google Drive adalah  sebuah wadah atau tempat yang  dapat digunakan untuk membuat, membagi, mengolaborasikan dan menyimpan data. Google Drive memiliki kapasitas penyimpanan sebesar 5 Gigabite (GB) dan dapat digunakan gratis. Jika ingin memperbesar kapasitas sebesar 25GB sampai 1TB, pengguna dikenai tarif. Google Drive juga menyediakan fasilitas  aplikasi pengolah kata atau yang biasa disebut sebagai Google Docs.

Pada kesempatan kali ini sampul ilmu menjelasakan tentang Cara Menampilkan File PDF di Dalam Postingan Blog. Buat anda yang ingin menampilkan artikel yang berbentuk PDF pada blog dapat mengikuti langkah-langkah dibawah ini

Siapkan File PDF anda Pada Komputer/Laptop Anda

Setelah itu ketikan URL https://drive.google.com/ Pada Browser anda, kemudian login dengan Account Google Anda jika anda belum mempunyai Account Google Diharapkan membuat terlebih dahulu.

Pada Menu Drive yang berada disamping kiri clik tanda panah keatas kemudian clik File cari file PDF anda kemudian clik Open tunggu beberapa saat sampai File PDF anda Selesai TerUpload.

Jika data / File Anda Berhasil TerUpload Maka nama File PDF anda Akan Muncul pada Drive Centang File PDF anda kemudian clik combo lebih banyak tepat berada diatas kemudian pilih bagikan.

Pada Halaman Setelan Berbagi clik Ubah pada Publik di Web Siapa Saja di internet dapat menemukan dan melihat.

Pada Obsivisibilitas clik Publik di web agar siapa saja  di internet dapat menemukan dan mengakses, tidak perlu masuk kesistem, kemudian pada Akses Siapa Saja (tidak Perlu Masuk) pilih Dapat Melihat setelah itu Simpan dan Clik Selesai.

Langkah Selanjutnya Clik Kanan Pada File PDF Anda kemudian Klik Buka Dengan dan pilih Penampil Google Drive.

Setelah File PDF anda Telah Terbuka langkah selanjutnya clik Menu File dan Pilih Sematkan File PDF ini. Maka akan muncul code HTML.

Untuk Menampilkan File PDF dipostingan Blog  anda  caranya Copy Code HTML tadi Kemudian Paste Pada Halaman Postingan Anda dan Lihat Hasilnya.

 Untuk Contoh Penerapannya Clik Disini

Sumber: http://lembar200.blogspot.com/2014/01/cara-menampilkan-file-pdf-di-dalam.html"

Read more »

Cara ganti Posting Lama Menjadi Angka

Caranya:

• Langkah awal tentu saja harus menuju ke desain template anda kemudian ke "Edit HTML"
• Sobat pilih salah satu dari 3 model diatas (bebas)
• Script nya ada dibawah ini, sesuai dengan tandanya (Model1,2,3)
• Setelah itu cari kode ini ]]></b:skin> kemudian taruh script dibawah ini diatas kode tersebut

Kode 1
.showpageArea {
padding:2px;
margin:0px auto;
text-align: center;
}
.showpageArea a {border: 1px solid #FFFFFF;
color: #FF8000;font-weight:normal;
padding: 3px 6px !important;
padding: 1px 4px ;margin:0px 4px;
text-decoration: none;
}
.showpageArea a:hover {
font-size:11px;
border: 1px solid #fff;
color: #FF8000;
background-color: #000000;
}

.showpageNum a {border: 1px solid #FFFFFF;
color: #FF8000;font-weight:normal;
padding: 3px 6px !important;
padding: 1px 4px ;margin:0px 4px;
text-decoration: none;

}
.showpageNum a:hover {
font-size:11px;
border: 1px solid #fff;
color: #FF8000;
background-color: #000000;

}
.showpagePoint {font-size:11px;
padding: 2px 4px 2px 4px;
margin: 2px;
font-weight: bold;
border: 1px solid #fff;
color: #fff;
background-color: #000000;


}

.showpage a:hover {font-size:11px;
border: 1px solid #fff;
color: #FF8000;
background-color: #000000;

}
.showpageNum a:link,.showpage a:link {
font-size:11px;
padding: 2px 4px 2px 4px;
margin: 2px;
text-decoration: none;
border: 1px solid #FFFFFF;
color: #FF8000;
background-color: #000000;}

.showpageNum a:hover {font-size:11px;
border: 1px solid #fff;
color: #FF8000;
background-color: #000000;
}


Kode 2
.showpageArea a {
text-decoration:underline;
}
.showpageNum a {
text-decoration:none;
border: 1px solid #cccccc;
margin:0 3px;
padding:3px;
}
.showpageNum a:hover {
border: 1px solid #cccccc;
background-color:#cccccc;
}
.showpagePoint {
color:#333;
text-decoration:none;
border: 1px solid #cccccc;
background: #cccccc;
margin:0 3px;
padding:3px;
}
.showpageOf {
text-decoration:none;
padding:3px;
margin: 0 3px 0 0;
}
.showpage a {
text-decoration:none;
border: 1px solid #cccccc;
padding:3px;
}
.showpage a:hover {
text-decoration:none;
}
.showpageNum a:link,.showpage a:link {
text-decoration:none;
color:#333333;
}



Kode 3
.showpageArea {
padding:2px;
margin:0px auto;
text-align: center;
}
.showpageArea a {border: 1px solid #5FB404;
color: #FE2E2E;font-weight:normal;
padding: 3px 6px !important;
padding: 1px 4px ;margin:0px 4px;
text-decoration: none;
}
.showpageArea a:hover {
font-size:11px;
border: 1px solid #5FB404;
color: #FE2E2E;
background-color: #FFFFFF;
}

.showpageNum a {border: 1px solid #5FB404;
color: #FE2E2E;font-weight:normal;
padding: 3px 6px !important;
padding: 1px 4px ;margin:0px 4px;
text-decoration: none;

}
.showpageNum a:hover {
font-size:11px;
border: 1px solid #5FB404;
color: #FE2E2E;
background-color: #FFFFFF;

}
.showpagePoint {font-size:11px;
padding: 2px 4px 2px 4px;
margin: 2px;
font-weight: bold;
border: 1px solid #5FB404;
color: #fff;
background-color: #5FB404;


}

.showpage a:hover {font-size:11px;
border: 1px solid #5FB404;
color: #FE2E2E;
background-color: #FFFFFF;

}
.showpageNum a:link,.showpage a:link {
font-size:11px;
padding: 2px 4px 2px 4px;
margin: 2px;
text-decoration: none;
border: 1px solid #5FB404;
color: #FE2E2E;
background-color: #FFFFFF;}

.showpageNum a:hover {font-size:11px;
border: 1px solid #5FB404;
color: #FE2E2E;
background-color: #FFFFFF;
}



Selanjutnya cari kode ini </body> kemudian taruh script dibawah ini diatas kode tersebut.
<!--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 -->

 Semoga berhasil

Read more »

Bikin Daftar Isi Sederhana

Mau bikin daftar isi seperti yang ada pada blog Daud, neh dia resepnya. Ikutin ya!

* Login di blogger, lalu masuk ke page element.

* Klik add page element
* Pilih html / javascript .

*Selanjutnya, copy paste kode di bawah :

<div style="border: 1px solid #000; overflow: auto; height: 220px;">
<script style="text/javascript" src="http://mizwar.blog.googlepages.com/daftar_isi.js"></script>
<script style="text/javascript">
var numposts = 1000;
var showpostdate = false;
var showpostsummary = false;
var numchars = 100;
var standardstyling = true;
</script>
<script src="http://catatan-daud.blogspot.com/feeds/posts/default?
orderby=published&alt=json-in-script&max-results=999
&callback=showrecentposts"></script></div>

Langkah selanjutnya klik Ok untuk menyimpan.

Selesai.


Oiya, jangan lupa diganti text yang berwarna Hijau dengan URL blog Sahib, ya.

Semoga Bermanfaat.

Read more »

Cara Membuat Berita Berjalan Di Blog

Berita berjalan atau newsticker ini berisi tentang cuplikan berita pendek yang mewakili berita secara keseluruhan sehingga bisa memberikan informasi terbaru kepada pengunjung blog arbakid tentang peristiwa yang sedang terjadi saat ini dan pada akhirnya pengunjung dari blog arbakid tidak akan ketinggalan informasi terbaru.

Inilah Cara membuat berita berjalan di blog atau newsticker. caranya sangat mudah, untuk membuat berita berjalan atau newsticker diblogspot tinggal ikuti saja langkah-langkah dibawah ini :

1.    Login ke blogger
2.    masuk ke edit HTML dan cari kode ]]></b:skin>
3.    Letakkan kode berikut tepat diatas kode ]]></b:skin>

#berita {
position:fixed;_position:absolute;bottom:0px; center:0px;
clip:inherit;
_top:expression(document.documentElement.scrollTop+
document.documentElement.clientHeight-this.clientHeight); _left:expression(document.documentElement.scrollLeft+ document.documentElement.clientWidth - offsetWidth); }

4.    Lalu cari lagi kode </body>
5.    Copy dan paste kode berikut dan letakkan diatas kode </body>

<div id=' berita '>
<iframe allowtransparency='true' frameborder='0' height='17' id='NewsWindow' marginheight='0' marginwidth='0' scrolling='no' src='http://www.elshinta.com/v2003a/scrolling.htm' style='background-color: transparent;' width='1200'/>
</div>

6.    Simpan Template kamu. Selesai

Sumber: http://dark-paper.blogspot.com

Semoga Bermanfaat

Read more »

Cara pasang like fb, tweet, google+, share dibawah setiap postingan

Ingin pasang tombol Like fb dan lainnya seperti gambar di bawah ini? Ikuti langkah praktisnya berikut ini!

Langkah Praktis

1. masuk ke blog sobat
2. pilih template kemudian pilih edit HTML
3. cari kode <data:post.body/>
4. masukan kode dibawah ini tepat dibawah kode <data:post.body/> jika kalian menemukan banyak kode tersebut kalian letakan di yang ke dua, atau kalo ngak mau ambil yang ketiga.

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div style='background:#222; border:1px solid #000; border-bottom:1px solid #444; border-right:1px solid #444;padding:8px 0;margin:12px 0px;width:100%;float:left;height:20px'>
<div style='float:right;padding-right:10px;'>
<div class='addthis_toolbox addthis_default_style '>
<a class='addthis_button_facebook_like' fb:like:layout='button_count'/>
<a class='addthis_button_tweet'/>
<a class='addthis_button_google_plusone' g:plusone:size='medium'/>
<a class='addthis_counter addthis_pill_style'/>
</div>
<script src='http://s7.addthis.com/js/250/addthis_widget.js#pubid=4rifin' type='text/javascript'/>
</div>
<div style='float:right;padding:2px 10px 0px 0px;font:normal 12px Arial;color:#eceaea;text
shadow: 1px 1px 1px #000'>
<strong>Share this article</strong> :
</div>
</div>
</b:if>

5. jika sudah klik simpan kemudian lihat hasilya

Read more »