Kamis, 26 Juli 2012
Rabu, 18 Juli 2012
Membuat entry post di halaman utama dalam bentuk galeri
mungkin beberapa sobat blogger pernah melihat template blog yang disulap menjadi toko online atau berupa galeri, dimana seolah posting mereka menjadi kecil-kecil (biasanya dalam bentuk thumbnail) dan itu berurutan, mungkin seperti ini
post 1 post 2 post 3post 4 dst-dst...
ada teman yang ngasih tau, tapi rasanya terlalu rumit dan terlihat banyak, setelah googling dengan berbagai kata kunci (dan beberapa hari) akhhirnya ketemu juga tutorial yang (sebenarnya) jauuuh lebih simpel. saya sendiri ga ngerti kenapa dulu sobat saya ngasih taunya kayak banyak banget ya?
ok, ini dia:taruh ini di bawah /b:skin>
<!-- untuk dua kolom seluruh halaman -->
<b:if cond='data:blog.url == data:blog.homepageUrl'>
<style>
.post {
width:140px;
margin-right:7.5px;
height: 190px;
overflow:hidden;
float:left;
border:2px solid silver; }
</style>
</b:if>
<!-- akhir dua kolom -->
<!-- untuk dua kolom halaman label -->
<b:if cond='data:blog.searchLabel'>
<style>
.post {
width:140px;
margin-right:7.5px;
height: 190px;
overflow:hidden;
float:left;
border:2px solid silver; }
</style>
</b:if>
<!-- akhir dua kolom -->
sejauh yang saya pakai (meski ada kode tambahan selain itu) tapi ga berpengaruh dengan tampilan, sobat bisa utak-atik yang ditandai merah agar sesuai dengan ukuran templatenya, semakin kecil maka akan semakin banyak thumbnail posting/entry yang tampil dihalaman utama. setelah dicoba-coba dengan menggabungkan halaman statis, ternyata memang kita harus membuat dua kode yang sama agar halaman statis juga tidak ikut "tersunat"... setidaknya saya tau, kalau kode <b:if cond: blabla> ga bisa digabung jadi satu perintah, bisa sih sobat pake kode bagian 1 aja kalo ga make halaman statis.
post 1 post 2 post 3post 4 dst-dst...
ada teman yang ngasih tau, tapi rasanya terlalu rumit dan terlihat banyak, setelah googling dengan berbagai kata kunci (dan beberapa hari) akhhirnya ketemu juga tutorial yang (sebenarnya) jauuuh lebih simpel. saya sendiri ga ngerti kenapa dulu sobat saya ngasih taunya kayak banyak banget ya?
ok, ini dia:taruh ini di bawah /b:skin>
<!-- untuk dua kolom seluruh halaman -->
<b:if cond='data:blog.url == data:blog.homepageUrl'>
<style>
.post {
width:140px;
margin-right:7.5px;
height: 190px;
overflow:hidden;
float:left;
border:2px solid silver; }
</style>
</b:if>
<!-- akhir dua kolom -->
<!-- untuk dua kolom halaman label -->
<b:if cond='data:blog.searchLabel'>
<style>
.post {
width:140px;
margin-right:7.5px;
height: 190px;
overflow:hidden;
float:left;
border:2px solid silver; }
</style>
</b:if>
<!-- akhir dua kolom -->
sejauh yang saya pakai (meski ada kode tambahan selain itu) tapi ga berpengaruh dengan tampilan, sobat bisa utak-atik yang ditandai merah agar sesuai dengan ukuran templatenya, semakin kecil maka akan semakin banyak thumbnail posting/entry yang tampil dihalaman utama. setelah dicoba-coba dengan menggabungkan halaman statis, ternyata memang kita harus membuat dua kode yang sama agar halaman statis juga tidak ikut "tersunat"... setidaknya saya tau, kalau kode <b:if cond: blabla> ga bisa digabung jadi satu perintah, bisa sih sobat pake kode bagian 1 aja kalo ga make halaman statis.
Selasa, 17 Juli 2012
Cara Mematikan tombol ctrl U, ctrl A, ctrl C, dan Disable Klik Kanan pada Blog
Pertama-tama kita akan mengenal modus para pencuri/plagiat. (kayak Polisi aje)
Biasanya para pencuri melakukan hal-hal ini untuk mencuri :
Jika akan mencuri template biasanya mereka membuka blog sang korban dan menekan CTRL U Yang akan memperlihatkan Source Code template mu. Nah tinggal di edit sedikit maka template sang korban akan menjadi miliknya.
Jika akan mencuri isi artikel, mereka akan meng copy artikel kita dan akan menpaste di blog nya. Jika dia paste dengan menyertakan sumber tak apa. tapi jika yang nakal , mereka tidak akan menyertakan sumbernya, bahkan diatas namakan dia yang menulis. Biasanya merka menggunakan Klik Kanan dan CTRL C, Juga bisa menggunakan CTRL A
Ilustrasi Dilarang KLIK KANAN
Langsung saja. Inilah caranya:
1. Seperti biasa Log In dulu Blogger kamu.
2. Pilih template / Edit HTML pada bagian TAB Rancangan
3. Lalu kamu cari kode <body> (Untuk memudahkan pencarian, tekan CTRL F pada keyboard mu)
4. Nah ganti kode tersebut dengan kode di bawah ini
<body oncontextmenu='return false;' onkeydown='return false;' onmousedown='return false;'>5. Klik pratinjau dulu jika ingin memastikan script di atas bekerja apa tidak.
6. Jika sudah Save Template
Untuk Tambahan saja:
Sebagai contoh, Kita hanya ingin mematikan fungsi CTRL U pada blog, maka script yang dimasukan hanya ini :
- ~ oncontextmenu=’return false;’ (Berfungsi untuk mematikan fungsi klik kanan / right klik pada mouse)
- ~ onkeydown=’return false;’ (Berfungsi untuk mematikan fungsi CTRL+A dan CTRL+U pada keyboard)
- ~ onmousedown=’return false;’ (Berfungsi untuk mematikan block select pada text/artikel)
- ~ ‘return false;’ (Untuk mengaktifkan script yang digunakan)
<body onkeydown='return false;'>Terserah kamu pakai yang mana saja, tinggal pilih. Yang paling penting saat mengedit script nya kamu harus JELI. Supaya tidak terjadi kesalahan, Jika masih belum jelas bisa berkomentar di bawah ini :)
Senin, 16 Juli 2012
Membuat Menarik Unordered List Pada Postingan
- Kode Unordered List Pertama,
.post-body ul,
.post-body ol{
margin: 1em;
padding-left: 1em;
}
.post-footer ul{
margin: 1em;
margin-top: -0.5em;
padding-left: 1em;
}
.post-body ul li,
.post-footer ul li {
list-style-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgErXJ_c9VtfY0sHcppP2AXw9QlnYJgtv-hod9Kz4-20Wvrlvlm_FQSsbqgtiOPyVNGm9SR2AKYBTzS4dKY1JlZH-0vcyxG6l2EeytBFy2_UyOxqJrZhcTgC2qu9MMHF3KTNUaFEQvx5MI/s400/uncheck.gif);
border-bottom: 1px solid #ccc;
padding: .2em 0 .2em .5em;
}
.post-body ul li:hover,
.post-footer ul li:hover {
cursor: pointer;
list-style-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiVGH_6ESrr03ues7TEXqw7WzBwkbuOJFqTgNfjK69Kn6tjpsiPi0UD6E53VwI02MkXScVAHlCzTUZ51lRfIAl2pmoTu9ZMN5dy947azZL7dfU4vYTv-D4TGhlazoiTAbUQ8c7UDdYCUeY/s400/check.gif);
background-color: #f2f2f2;
color: #B1291F;
}
- Selanjutnya, silahkan copy paste salah satu kode CSS tersebut lalu letakan di atas atau sebelum kode di bawah ini,
]]></b:skin>
- Lalu, Simpan Template.
Minggu, 15 Juli 2012
Membuat Efek bayangan Shadow pada background blog.
Membuat Efek bayangan Shadow pada background blog. - Cara membuat bayangan pada background blog - Bayangan atau lebih di kenal dengan efek shadow bisa di buat dengan menggunakan CSS3. Sebagai contoh bisa dilihat di sini Tempat pesan sandal gaul. pada tepi blog, ada semacam bayangan yang membuat blog tambah enak di lihat ( menurut saya ).
Untuk membuatnya, tak perlu dibutuhkan skill yang hebat dalam mengotak-atik blog. Berikut langkah-langkahnya :
Login Blogger
Pilih Rancangan
Pilih Edit Html
dan Tambahkan kode berikut
Untuk membuatnya, tak perlu dibutuhkan skill yang hebat dalam mengotak-atik blog. Berikut langkah-langkahnya :
Login Blogger
Pilih Rancangan
Pilih Edit Html
dan Tambahkan kode berikut
-moz-box-shadow: 0px 0px 40px #151515;
-webkit-box-shadow: 0px 0px 40px #151515;
box-shadow: 0px 0px 40px #151515;
Untuk peletak'an kode, beda template beda tempat. Sebagai contoh untuk blog http://sandal-gaul.rofingi.com/. diletakkan CSS bagian Wrap. Sehingga kodenya menjadi-webkit-box-shadow: 0px 0px 40px #151515;
box-shadow: 0px 0px 40px #151515;
#wrap{width:800px;background:#fff;margin:0px auto;padding:2px; position:relative ;
-moz-box-shadow: 0px 0px 40px #151515;
-webkit-box-shadow: 0px 0px 40px #151515;
box-shadow: 0px 0px 40px #151515;}
-moz-box-shadow: 0px 0px 40px #151515;
-webkit-box-shadow: 0px 0px 40px #151515;
box-shadow: 0px 0px 40px #151515;}
Membuat Ujung Posting Dan Sidebar Melengkung
- Didalam bowsing kita sering kali menemukan blog atau website yang pada keempat ujung halaman posting atau sidebarnya melengkung. Untuk bisa membuat blog seperti itu membutuhkan peng-edit-an pada kode-kode html blog kita. Adapun caranya adalah sebagai berikut:
- Masuk ke akun blogspot>rancangan>edit html. Download dahulu template (klik download template lengkap) untuk mengamankan data apabila praktek kita gagal nantinya.
- Cari kode dibawah ini, gunakan ctrl+f agar memudahkan pencarian:
#post {background:#ffffff;float: left;width: 475px;margin-bottom:5px;padding: 10px;overflow:hidden;border:1px solid #cfcfcf;}
Hapus dan ganti kode berwarna merah dengan kode dibawah ini:
- border:1px solid #cfcfcf;;
- -webkit-border-radius: 15px;
- -moz-border-radius: 15px;
- border-radius: 15px;
- -webkit-box-shadow: 0px 2px 5px rgba(0,0%,0%,.15);
- -moz-box-shadow: 0px 2px 5px hsla(0,0%,0%,.15);
- box-shadow: 0px 2px 5px rgba(0,0%,0%,.15);
Kemudian simpan template.
Untuk merubah sidebarnya cari kode #sidebar/. sidebar .......... yang ditutup dengan }. Ulangi cara seperti diatas,
Sabtu, 14 Juli 2012
Cara Menampilkan Judul Posting saja pada Arsip Blog
1. Masuk ke dashboard > Design/Rancangan > Klik 'expand widget template'.
2. Cari kode: <b:include data='post' name='post'/> (Ctrl+F)
3. Ganti dengan script ini:
*Jika ingin menampilkan judul posting saja khusus di arsip, ambil perintah pada b if cond archive dan b include posting saja:
<!--Judul posting saja di arsip-->-Cara memasukkan scriptnya sama dengan cara yang telah disebutkan di atas.
<b:if cond='data:blog.pageType == "archive"'>
<h3 class='title-only'><a expr:href='data:post.url'><data:post.title/></a></h3>
<b:else/>
<b:include data='post' name='post'/>
</b:if>
<!--Buka-rahasia.blogspot.com-->
Cara Membatasi Arsip/Artikel Supaya Tidak Memanjang
- Pilih ‘TATA LETAK / Rancangan’
- Klik "Edit HTML"
- Agar aman, silakan anda Download dulu template anda (klik Download Template Lengkap), Pada bagian atas
- Kemudian Beri tanda centang pada kotak di samping tulisan Expand Template Widget
- gunakan (Ctrl + F) Cari kode atau yang mirip dengan kode :
- dan Ganti kode diatas dengan kode berikut :
<b:includable id='main'>
<b:if cond='data:title'>
<h2><data:title/></h2>
</b:if>
<div class='widget-content' style='overflow: auto; width: 100%px; height: 200px; padding: 10px; border: 1px solid #000000; '>
<div id='ArchiveList'> - Simpan Template
- Selesai
<b:includable id='main'> <b:if cond='data:title'> <h2><data:title/></h2> </b:if> <div class='widget-content'> <div id='ArchiveList'>
script
<?php
/**
* The base configurations of the WordPress.
*
* This file has the following configurations: MySQL settings, Table Prefix,
* Secret Keys, WordPress Language, and ABSPATH. You can find more information
* by visiting {@link http://codex.wordpress.org/Editing_wp-config.php Editing
* wp-config.php} Codex page. You can get the MySQL settings from your web host.
*
* This file is used by the wp-config.php creation script during the
* installation. You don't have to use the web site, you can just copy this file
* to "wp-config.php" and fill in the values.
*
* @package WordPress
*/
// ** MySQL settings - You can get this info from your web host ** //
/** The name of the database for WordPress */
define('DB_NAME', 'cyber1nfo.co.cc');
/** MySQL database username */
define('DB_USER', 'root');
/** MySQL database password */
define('DB_PASSWORD', '');
/** MySQL hostname */
define('DB_HOST', 'localhost');
/** Database Charset to use in creating database tables. */
define('DB_CHARSET', 'utf8');
/** The Database Collate type. Don't change this if in doubt. */
define('DB_COLLATE', '');
/**#@+
* Authentication Unique Keys and Salts.
*
* Change these to different unique phrases!
* You can generate these using the {@link https://api.wordpress.org/secret-key/1.1/salt/ WordPress.org secret-key service}
* You can change these at any point in time to invalidate all existing cookies. This will force all users to have to log in again.
*
* @since 2.6.0
*/
define('AUTH_KEY', 'NY.W?E+gOtYz!`==_hr<AfI`N#Vv;k/{@[pE] x*#}5H0T%,KHDnIE3Mc!4YX09,');
define('SECURE_AUTH_KEY', ':+1[+Th3cZh&Gb:RNwM5+}7QGbF %09(Adin(t=CL+~vd}mzwdY, &G~G<ihkg~V');
define('LOGGED_IN_KEY', '/vBOa;1E^g.~5@P<F*Tkuftg1fXf]**9H-#+2N)`s&4s(!I/rz,^]6M}FWv>)aCM');
define('NONCE_KEY', 'Z/]Nqo%]j|A{r5gt;%I{m#ZBR?X/On(rt;2c<iso^^s6(UsnAe>5C71m)$_C}}X]');
define('AUTH_SALT', 'X@Sxn=cNzkK@t ?Nh4<d 3a:OF{}yd%-9QW|/RP)247bBZRETdL+*T> w1k1l*UI');
define('SECURE_AUTH_SALT', 'MUX[T6Fv*#5TW-p4gf@E#`^EC+Ox/%Irpy~8/FZNZH)K?&;*O2W~XkQfNE6-yLQY');
define('LOGGED_IN_SALT', 'd_%>HK6=vj(nOOh7*RdQ&tTn9QGhDCHKT.ehV({ *PA9dF<+%P*}DkLU}wb94gJw');
define('NONCE_SALT', 'iW40`6`.=N?.Jw`~mILHxAY((l:7Jsf+-{t~/[4c*`>fd`d-@%$9@VSPrHez>{hk');
/**#@-*/
/**
* WordPress Database Table prefix.
*
* You can have multiple installations in one database if you give each a unique
* prefix. Only numbers, letters, and underscores please!
*/
$table_prefix = 'wp_';
Trik Membatasi Jumlah Posting Pada Halaman Label ini berfungsi untuk membatasi jumlah postingan yang muncul ketika kita mengklik label pada blog kita,trik ini sangat berguna untuk sobat yang postingannya sudah sangat banyak sehingga pengunjung tidak repot untuk menscroll ke bawah. Untuk menerapkan trik ini pertama-tama masuk Dasboard >> Template >> Edit HTML >> klik Lanjutkan >> dan Ceklis Expand Template Widget agar seluruh elemen pembangun posting tampil: Cari kode seperti ini (fokuslah pada atribut expr:href, beberapa atribut lain mungkin juga ditemukan di dalam tag yang sama misalnya expr:dir): expr:href='data:label.url' Ubah kode yang berwarna biru menjadi seperti ini expr:href='data:label.url + "?max-results=5"' 5 adalah jumlah postingan yang akan muncul ketika kita mengklik label.
Trik Membatasi Jumlah Posting Pada Halaman Label ini berfungsi untuk membatasi jumlah postingan yang muncul ketika kita mengklik label pada blog kita,trik ini sangat berguna untuk sobat yang postingannya sudah sangat banyak sehingga pengunjung tidak repot untuk menscroll ke bawah.
Untuk menerapkan trik ini pertama-tama masuk Dasboard >> Template >> Edit HTML>> klik Lanjutkan >> dan Ceklis Expand Template Widget agar seluruh elemen pembangun posting tampil:
Cari kode seperti ini (fokuslah pada atribut expr:href, beberapa atribut lain mungkin juga ditemukan di dalam tag yang sama misalnya expr:dir):
expr:href='data:label.url'
Ubah kode yang berwarna biru menjadi seperti ini
expr:href='data:label.url + "?max-results=5"'
5 adalah jumlah postingan yang akan muncul ketika kita mengklik label.
Cara Menghilangkan Tulisan Diberdayakan Oleh Blog
Bagi Kalian yang menggunakan Template yang di sediakan oleh Blog, pasti di bawah Template ada tulisan Di Berdayakan Oleh Blog. Nah kalo Kalian merasa terganggu dengan tulisan tersebut, dan ingin menghilangkannya, maka Saya punya solusinya. Tinggal ikuti langkah-langkah berikut ini :
[1]. Seperti Biasa Kalian Login Dulu Ke Blog Kalian Masing-Masing
[2]. Kemudian Cari Tata Letak --> Edit HTML
[3]. Trus cari Code Berikut Ini ]]></b:skin>
[4]. Copy dan Paste-kan Code Di Bawah Ini Tepat Di Atas Code Tadi.
#Attribution1 {height:0px;visibility:hidden;display:none}
[5]. Kemudian Save dan Lihat Hasilnya
Baca Selengkapnya Di : http://indonesianblog-jmk.blogspot.com/2011/12/cara-menghilangkan-tulisan-diberdayakan.html#ixzz20eDYkBSF
Cara memberi scroll pada Threaded comment blogger
1. Login pada blog sobat
2. Masuk ke halaman Template
3. Edit HTML lalud Lanjutkan
4. Expand Template Widget
5. Cari kode .comments .comments-content .comment-thread ol { atau lebih lengkapnya seperti ini
2. Masuk ke halaman Template
3. Edit HTML lalud Lanjutkan
4. Expand Template Widget
5. Cari kode .comments .comments-content .comment-thread ol { atau lebih lengkapnya seperti ini
.comments .comments-content .comment-thread ol {
list-style-type: none;
padding: 0;
text-align: none;
}
list-style-type: none;
padding: 0;
text-align: none;
}
6. Jika sudah ketemu, copy kode di bawah ini dan pastekan di bawah kode .comments .comments-content .comment-thread ol {
max-height:400px;border:0px solid #eee;overflow:auto;
7. Sehingga akan menjadi seperti ini:
.comments .comments-content .comment-thread ol {
max-height:400px;border:0px solid #eee;overflow:auto;
list-style-type: none;
padding: 0;
text-align: none;
}
8. Simpan Template dan lihat hasilnyamax-height:400px;border:0px solid #eee;overflow:auto;
list-style-type: none;
padding: 0;
text-align: none;
}
Langganan:
Komentar (Atom)