e-book tutorial blogspot tingkat lanjut
Post on 17-Jul-2015
71 Views
Preview:
TRANSCRIPT
5/14/2018 E-book Tutorial Blogspot Tingkat Lanjut - slidepdf.com
http://slidepdf.com/reader/full/e-book-tutorial-blogspot-tingkat-lanjut 1/10
MENAMBAHKAN READ AND MORE
ATAU BACA SELENGKAPNYA
:
1. Akses atau klik www.blogger.com.
2. Selanjutnya pilih menu Tata Letak dan klik menu Edit HTML
3. Maka akan keluar tag Edit Template. Langkah selanjutnya
centang atau tandai Expand Templates Widget
4. Masukan kode dibawah ini, sebelum tag </head> atau tepat
sesudah kode } ]]></b:skin>. Untuk mencari biar lebih mudah
kode tersebut tekan Ctrl – F pada kyboard.
<style>
<b:if cond='data:blog.pageType == "item"'>
span.fullpost {display:inline;}
<b:else/>
span.fullpost {display:none;}
</b:if>
</style>
5/14/2018 E-book Tutorial Blogspot Tingkat Lanjut - slidepdf.com
http://slidepdf.com/reader/full/e-book-tutorial-blogspot-tingkat-lanjut 2/10
5. Seperti nampak pada gambar dibawah ini
6. Selanjutnya mengatur supaya postingan/tulisan terpotong. Cari
kode <p><data:post.body/></p>. Tambahkan kode dibawah
ini, tepat dibawahnya :
<b:if cond='data:blog.pageType != "item"'>
<a expr:href='data:post.url'> Read More..</a>
</b:if>
7. Seperti nampak pada gambar dibawah ini:
5/14/2018 E-book Tutorial Blogspot Tingkat Lanjut - slidepdf.com
http://slidepdf.com/reader/full/e-book-tutorial-blogspot-tingkat-lanjut 3/10
8. Setiap kali akan posting harus pada EDIT HTML, bukan pada
Compose/Tulis. Supaya tulisan terpotong, biar nampak read
more muncul, ketikan kode <span class="fullpost">, sisa
postingan sampai selesai ketikan kode </span>.
9. Contoh:
Mungkin kita boleh berfikir seperti itu, akan tetapi kita
sudah sedikit mendapatkan jawabanya yaitu pertama, sebagai
rumah atau tempat tinggal ini menandakan dengan jaringan atau
networking kita akan mendapatkan manfaat. <span
class="fullpost">
Kedua, sebagi tempat berlindung dengan jaringan kita
akan belajar berlindung sebab jaring laba-laba sangat lengket dan
pekat. Ketiga, jaring-jaring itu membentuk lingkaran tidak
beraturan bahwa konsepsi jaringan setidaknya mengajarkan
bagaimana kita berhubungan dengan orang lain tanpa membeda-
bedakan. Keempat , lihat jaring-jaring itu terikat kuat pada setiap
sisinya sehingga mampu tegak berdiri, mengisyaratkan kita harus
tanggung jawab (sense of responbility) dan mampu menjaga
hubungan baik (the lookout for carefully relationship). Pada
akhirnya laba-laba itu tidur dengan pulas ditengah rumhnya,
maka hal tersebutlah yang kita harapkan melalui hubungan atau
ikatan menjaga tali persaudaraan, khusunya persaudaraan sesama
muslim). </span>
10. Maka hasilnya akan terpotong seperti ini:
Mungkin kita boleh berfikir seperti itu, akan tetapi kita sudah
sedikit mendapatkan jawabanya yaitu pertama, sebagai rumah
atau tempat tinggal ini menandakan dengan jaringan atau
networking kita akan mendapatkan manfaat.
11. SELAMAT MENCOBA.....
5/14/2018 E-book Tutorial Blogspot Tingkat Lanjut - slidepdf.com
http://slidepdf.com/reader/full/e-book-tutorial-blogspot-tingkat-lanjut 4/10
MEMBUAT MENU HORISONTAL
1. Akses atau klik www.blogger.com.
2. Selanjutnya pilih menu Tata Letak dan klik menu Edit HTML
3. Maka akan keluar tag Edit Template. Langkah selanjutnya
centang atau tandai Expand Templates Widget
4. Masukan kode dibawah ini, Cari kode ]]></b:skin>, kalau sudah
ketemu copy kode HTML tersebut dan taruh diatasnya. Untuk
mencari biar lebih mudah kode tersebut tekan Ctrl – F pada
kyboard.
/*credits : http://sanggarilci.blogspot.com */
#tabshori {
float:left;
width:100%;
font-size:13px;
border-bottom:1px solid #2763A5; /* Garis Bawah*/
line-height:normal;
5/14/2018 E-book Tutorial Blogspot Tingkat Lanjut - slidepdf.com
http://slidepdf.com/reader/full/e-book-tutorial-blogspot-tingkat-lanjut 5/10
}
#tabshori ul {
margin:0;
padding:10px 10px 0 50px; /*Posisi Menu*/
list-style:none;
}
#tabshori li {
display:inline;
margin:0;
padding:0;
}
#tabshori a {
float:left;
background: url("http://kendhin.890m.com/menu/ blackleft.gif ")
no-repeat left top;
margin:0;
padding:0 0 0 4px;
text-decoration:none;
}
#tabshori a span {
float:left;
display:block;
background:
url("http://kendhin.890m.com/menu/ blackright.gif
") no-repeatright top;
padding:5px 14px 4px 4px;
color:#fff;
}
/* Commented Backslash Hack hides rule from IE5-Mac \*/
#tabshori a span {float:none;}
/* End IE5-Mac hack */
5/14/2018 E-book Tutorial Blogspot Tingkat Lanjut - slidepdf.com
http://slidepdf.com/reader/full/e-book-tutorial-blogspot-tingkat-lanjut 6/10
#tabshori a:hover {
background-position:0% -42px;
}
#tabshori a:hover span {
background-position:100% -42px;
}
Seperti gambar dibawah ini:
5. Tulisan yang Dicetak Tebal bisa kamu ganti dengan gambar-
gambar warna dibawah ini. Misalnya jika kamu memilih warna
kuning maka kodenya menjadi:
background: url("http://kendhin.890m.com/menu/ yellowright.gif ")
no-repeat left top;
background: url("http://kendhin.890m.com/menu/ yellowright.gif ")
no-repeat right top;
5/14/2018 E-book Tutorial Blogspot Tingkat Lanjut - slidepdf.com
http://slidepdf.com/reader/full/e-book-tutorial-blogspot-tingkat-lanjut 7/10
Kode warna-warna:
blackleft.gif blackright.gif
greenleft.gif greenright.gif
redleft.gif redright.gif
unguleft.gif unguright.gif
yellowleft.gif yellowright.gif
5/14/2018 E-book Tutorial Blogspot Tingkat Lanjut - slidepdf.com
http://slidepdf.com/reader/full/e-book-tutorial-blogspot-tingkat-lanjut 8/10
blueleft.gif blueright.gif
whiteleft.gif whiteright.gif
6. Memasang Tag Halaman (sastra, opini, profil dan lain-lain). Cari
kode <div id="content-wrapper">. Semua pemasangan
tergantung dari template yang digunakan. Selanjutnya copy kode
HTML berikut tepat diatasnya :
<div id="tabshori">
<ul>
<li><a
href="http://sanggarilci.blogspot.com"><span> Home</span></a></l
i>
<li><a href="http://sanggarilci.blogspot.com"><span>Trik-
Tips</span></a></li>
<li><a href="http://sanggarilci.blogspot.com"><span>Free
Template </span></a></li>
<li><a
href="http://sanggarilci.blogspot.com"><span> Kamus</span></a><
/li>
<li><a
5/14/2018 E-book Tutorial Blogspot Tingkat Lanjut - slidepdf.com
http://slidepdf.com/reader/full/e-book-tutorial-blogspot-tingkat-lanjut 9/10
href="http://sanggarilci.blogspot.com"><span> Profile</span></a></
li>
</ul>
</div >
Ganti http://sanggarilci.blogspot.com dengan link yang kamu
tuju. Link tersebut bisa berupa alamat blog lain atau link
postingan kamu. Untuk mendapatkan link postingan caranya klik
kanan pada judul postingannya trus pilih "copy link location"
(untuk mozilla firefox).Kemudian text yang dicetak tebal bisa kamu ganti dengan text
yang kamu suka. Text tersebut adalah text yang muncul di
tombol/menu
Seperti nampak gambar dibawah ini:
7. Kalau sudah terpasang klik SIMPAN. Selesai sudah....
8. Bagaimana hasilnya. Lihat sekarang....
9. SELAMAT MENCOBA
5/14/2018 E-book Tutorial Blogspot Tingkat Lanjut - slidepdf.com
http://slidepdf.com/reader/full/e-book-tutorial-blogspot-tingkat-lanjut 10/10
MENAMBAHKAN MARQUE ATAU TEKS BERJALAN
1. Akses atau klik www.blogger.com.
2. Selanjutnya pilih menu Tata Letak dan klik menu Edit HTML
3. Maka akan keluar tag Edit Template. Langkah selanjutnya
centang atau tandai Expand Templates Widget
4. Pasang kode dibawah ini tepat diatas menu horisontal/jeniskategori atau dibawah kode <div id="content-wrapper">.
<marque align=’center’ direction=’bottom right’ height=’4px’Onmouseout=’this.start { } ’ onmouseover=’this.stop { } ‘scrolldelay=’400’Width=’100’>SELAMAT DATANG DI WEBLOG NEGERIKEGILAAN (Menebar Cinta Menerangi Semesta)
</marquee>
Nampak seperti gambar dibawah ini:
5. Kalimat yang dicetak tebal diatas bisa anda rubah seperti
kemauan anda. Ok....SELAMAT MENCOBA
top related