welcome to my blog

Cara ganti template blog

Rabu, Agustus 17, 2011  alya fauzi  No comments

Artikel ini aku tulis berdasarkan apa yang pernah aku lakukan berkaitan dengan mengganti template blog.. memang sih.. sebelumnya aku berselancar dulu cari tutorial blog yang berkaitan dengan cara ganti template blog yang kemudian aku praktekkan-praktekkan dan praktekkan... ternyata tidak sesulit yang aku bayangkan.. walhasil seperti blog-ku ini.. dan perlu temen2 ketahui bahwa aku belajar otodidak untuk membuat tampilan @y@ Blog's sedikit beda dari template standar.. lho.. kok koyo curhat yo.. hehee.. aa...embuhlah.. intinya kalau kita mau pasti bisa walau tanpa bimbingan langsung...
Ok langsung saja .. langkah - langkah yang pernah gue lakukan untuk ganti template blog...

===== TAHAP PERTAMA ====
  1. Berselancar dulu cari template blog yang kamu suka [bisa cari disini atau yang lain] kemudian kamu download..
  2. Karna template yang kamu download tadi masih dalam bentuk ZIP maka perlu kamu ekstrak dulu agar keliatan file XML-nya karna file inilah yang akan gantikan template kamu. caranya klik kanan file zip yang kamu download tadi kemudian pilih [extrak ...<nama file zip>..] maka akan muncul sebuah folder yang namanya sama dengan nama file zip tadi kemudian buka folder tersebut dan kamu akan liat type file <XML dokumen>dan file inilah yang akan kamu unggah untuk menggantikan template kamu..
===== TAHAP PERTAMA SELESAI ====  

Lanjuuut...

===== TAHAP KEDUA ====
  1. Kamu login ke dashbor blog kamu 
  2. Klik Rancangan kemudin klik edit HTML
  3. Kamu klik dulu kotak kecil yang sebelahnya ada tulisan expad template widget
  4. Untuk jaga-jaga seandainya penggantian template kamu  belum berhasil kamu klik donwload template lengkap dulu kemudian simpan itu adalah file XML dokumen untuk template yang sedang kamu gunakan.
  5. Selanjutnya klik brows dan pilih file yang tadi kamu download, tentunya file yang sudah kamu exstrak dan jangan lupa file XML dokumen.
  6. Klik unggah
  7. Lihat hasilnya
  8. Kalau sudah OK kamu klik simpan template.. kalau belum coba lagi... ''tanpa mencoba gak akan bisa..''
===== TAHAP KEDUA selesai==== 
..............................................SELAMAT MENCOBA......................

Selengkapnya

Widget shere, fon size dan geogle translate

Senin, Agustus 15, 2011  alya fauzi  No comments

Awalnya widget ini aku dapet dari blognya kang jaloe yang judulnya J-GAZA WIDGET- Gadget Kepedulian 
yang coba aku pasangkan di blog ini dan alhamdulilah berhasil.. tapi karna kurang cocok dengan tampilannya yang vertikal aku coba utak-atik sendiri agar tampilannya mendatar.. tapi pas waktu bereksperimen ternyata templatenya malah jadi eror karna tidak bisa betulin akhirnya aku ganti dengan yang lain, dan singkat cerita hasilnya jadi seperti di atas posting ini [klik dulu "selengkapnya" biar keliatan] buat temen-temen yang mau pasang widget di atas caranya sama dengan dengan yang ada di blognya kang jaloe

Cara Menginstall-nya ke dalam Blog.
Pertama :
Dalam tab Layout pilih Edit Html kemudian tandai kotak kecil di samping tulisan “ Expand Widget Templates “.
Expand Template Widget

Setelah itu  di atas tag :

]]></b:skin>

masukan kode kode css di bawah ini.

/* J-Gaza Widget  
-------------------------------*/  
.gaza {  
border:1px solid #A3A3A3;  
float:right;  
font-size:10px;  
line-height:140%;  
margin:3px;  
padding:3px;  
width:450px;  
}

.gaza img {  
 border:none; padding:0px;  
 }
.rgaza {  
line-height:16px;padding:0px 5px 0 0px;  
margin:5px 0 -2px;  
}
.jgaza {   
background:#4DA96A;  
display:block; font-size:11px;  
margin-top:10px; color:#000; text-align:center;  
}
.jgaza a{   
color:#FFF;  
}   
.jgaza a:hover {  
color:#FF0000;   
}
.gazapost{ 
font-size: 13px; 
}

Kemudian di bawah tag penutup :

</head>

masukan link kode css dan javascript di bawah ini.


<link href='http://jaloee.googlepages.com/gazatextsizer.css' rel='stylesheet' type='text/css'/> 

<script src='http://jaloee.googlepages.com/doctextsizer.js' type='text/javascript'/> 

<script src='http://jaloee.googlepages.com/addprintlink.js' type='text/javascript'/>
 Setelah beres dengan pekerjaan di atas cari kode  ini.

<p><data:post.body/></p>

Kemudian ganti kode di atas dengan kode ini.


<b:if cond='data:blog.pageType == &quot;item&quot;'>
    <div class='gaza'>Font Size :
<a class='texttoggler' href='#' rel='normalview' title='normal size'><span style='font-size:12px'>A</span></a>
<a class='texttoggler' href='#' rel='largeview' title='large size'><span style='font-size:16px'>A</span></a>
<a class='texttoggler' href='#' rel='xlargeview' title='extra large size'><span style='font-size:20px'>A</span></a>

<div id='google_translate_element'/><script>
function googleTranslateElementInit() {
  new google.translate.TranslateElement({
    pageLanguage: &#39;id&#39;
  }, &#39;google_translate_element&#39;);
}
</script><script src='//translate.google.com/translate_a/element.js?cb=googleTranslateElementInit'/>

<script type='text/javascript'>
//documenttextsizer.setup(&quot;shared_css_class_of_toggler_controls&quot;)
documenttextsizer.setup(&quot;texttoggler&quot;)
</script>

<br/>
<a class='addthis_button_twitter'><img alt='Twitter' height='64' src='http://cdn1.iconfinder.com/data/icons/pc_social_media/PNG/128x128/Twitter.png' width='64'/></a>
<a class='addthis_button_delicious'><img alt='Delicious' height='64' src='http://icons.iconarchive.com/icons/kaplang/social-media/256/Delicious-icon.png' width='64'/></a>
<a class='addthis_button_facebook'><img alt='Facebook' height='64' src='http://www.iconshut.com/icons/Facebook-icon-256x256px-1331.png' width='64'/></a>
<a class='addthis_button_digg'><img alt='Digg' height='64' src='http://www.gettyicons.com/free-icons/101/high-detail/png/256/digg_256.png' width='64'/></a>
<a class='addthis_button_stumbleupon'><img alt='Stumbleupon' height='64' src='http://icons.iconarchive.com/icons/cute-little-factory/social-trucks/256/stumbleupon-icon.png' width='64'/></a>
<br/>

<blink>support an independent Palestina</blink>

<span class='jgaza'>
<script src='http://s7.addthis.com/js/250/addthis_widget.js' type='text/javascript'/>
<a href='http://www.inminds.co.uk/boycott-leaflet.html' target='_blank'>Save Our Palestina </a></span>
</div></b:if>
        <div class='gazapost'><p><data:post.body/></p></div>



Catatan :
 
Jika anda men-install read more dari ramani , maka yang di ganti <data:post.body/> yang pertama. dan jika anda mengunakan read more yang “ special-effects-for-peekaboo-posts “,  maka anda harus menghapus kode ini.
<b:if cond='data:blog.pageType == "item"'> dan tag penutupnya ialah </b:if>. ( dari kode tambahan  saya bro. )
Setelah itu :
Simpan template anda, kemudian buka tab Setting – Basic. dan pastikan di samping kanan tulisan “ Show Email Post links? “ . dalam keadaan terpilih “ Yes”.

MAU TUTORIAL BLOG YANG LAIN..SILAHKAN KUNJUNGI BLOGNYA KANG JALOE

NB
  • tulisan yang berwarna kuning "450" bisa diubah untuk mengatur lebar yang diinginkan
  • tulisan yang berwarna pink adalah URL gambar icon twitter, facebook dsb, bisa kamu ganti dengan yang kamu suka
  • angka "64" adalah ukuran max icon yang di tampilkan, bisa kamu ubah sesuai selera.

=====SELAMAT MENCOBA=====
Selengkapnya