RSS FEED
Tampilkan postingan dengan label Mempercanik blog. Tampilkan semua postingan
Tampilkan postingan dengan label Mempercanik blog. Tampilkan semua postingan

Membuat icon bokmarks





Pagi sobad, Setelah Udhi menggunakan template dengan tampilan baru, ternyata ada banyak saran dan komentar tentang blog udhi, dan sekarang udhi ngasi tutorial ini berhubung karena ada permintaan dari salah satu teman blogger Fherry A untuk dibuatin icon2 jejaring sosial (bokmarksning Icons), dia berkomentar di tampilan template baru udhi.



sebagai contoh bisa dilihat diblog ini!!!



ok langsung aja kita mulai,

1. terlebih dahul login ke blogger(emang kalau gak login dulu, bisa ngedit ya??)

2. masuk ke layout(tata letak)

3. Edit html

4.cari kode </head>

5. Copy kode dibawah ini diatas kode tadi





<style>

.tbzbookmark {

background:#FFF !important;

width:310px; /* lebar kotak */

text-align:center;

text-transform:none;

border:1px solid #DDD; /* warna border kotak */

-moz-border-radius:5px;

padding:10px;

}

.tbzbookmark img {

margin-top:5px;

opacity:.4;

-moz-opacity:.4;

filter:alpha(opacity=40);

}

.tbzbookmark img:hover {

opacity:1;

-moz-opacity:1;

filter:alpha(opacity=100);

}

.sharemessage {

color:#666; /* warna judul */

font:Arial, Helvetica, sans-serif;

font-size:13px; /* ukuran huruf judul */

font-weight:bold;

margin-bottom:5px;

padding-bottom:2px;

border-bottom: 1px solid #CCC; /* warna border bawah judul */

}

.tbzcredit {

font-size:9px;

text-align:right;

}

.tbzcredit a {

text-decoration:none;

}

.tbzcredit a:hover {

text-decoration:underline;

}

</style>

<script src='http://z-sbookmark.googlecode.com/files/Z-Bookmarking.js' type='text/javascript'/>

<!-- TBZ-Bookmark by http://tipsbloggerzacky.blogspot.com END -->







6.sekarang cari kode <data:post.body/>

7.copy and paste kode dibawah ini tepat sebelum kode diatas





<div class="tbzbookmark">

<div class="sharemessage">

<div expr:id='"sbtxt"+data:post.id'>Share this post!</div>

<script type='text/javascript'>showsbtext("sbtxt" + "<data:post.id/>",0)</script>

</div>



<div id='row1'>

<a expr:href='"http://www.facebook.com/share.php?u="+ data:post.url + "&title=" + data:post.title' expr:onmouseout='"javascript:showsbtext(\"sbtxt" + data:post.id + "\",0);"' expr:onmouseover='"javascript:showsbtext(\"sbtxt" + data:post.id + "\",1);"' rel='nofollow' target='_blank' title='Facebook'><img alt='Facebook' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiTnhSjDHmu8SDif2GQKPbz2WAjcQGFjPOEA2923sCYN-qkWIZoTC1L9F_9JuzMqp_u2vN6J1xsF6yZWWMGRhcrfkbuZKHvCZsAuSUEAQXooCv890QESJ6UVWYFoMwaaf7mjE6dKSGhCSo/s400/facebook.png'/></a>



<a expr:href='"http://del.icio.us/post?url="+ data:post.url + "&title=" + data:post.title' expr:onmouseout='"javascript:showsbtext(\"sbtxt" + data:post.id + "\",0);"' expr:onmouseover='"javascript:showsbtext(\"sbtxt" + data:post.id + "\",2);"' rel='nofollow' target='_blank' title='Delicious'><img alt='Delicious' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi0PxFGWZbL_EDF1MEU9mttmfzN5bvkaO1FgtrH0XPLOSG2sDhGEYaaMEwee8WZuS3oGkO2sSk_JVQZVZgy0tF2yBWG2JzcfzQubZzPHEvBV4LS9sauK_Huvp06bimHF6SDsOL7XY0ehQ4/s400/Delicious.png'/></a>



<a expr:href='"http://digg.com/submit?phase=2&url="+ data:post.url + "&title=" + data:post.title' expr:onmouseout='"javascript:showsbtext(\"sbtxt" + data:post.id + "\",0);"' expr:onmouseover='"javascript:showsbtext(\"sbtxt" + data:post.id + "\",3);"' rel='nofollow' target='_blank' title='Digg!'><img alt='Digg!' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhV0sGQx3IuCDP0w5-5tHo1SyQjIqvYLLokyidB-8mKkOErRFWKRyyymVq-9qDUD3vbfb2JIA0xUN1SJ7OoRnKlEFhhJAcEzJ1RrTniQEHUVCgUyfPk9DHvSs_uUWJA9Yp2SyyDTMp0vcY/s400/Digg.png'/></a>



<a expr:href='"http://twitter.com/home?status=Currently reading: " + data:blog.title + " - " + data:post.url + ". What about you?"' expr:onmouseout='"javascript:showsbtext(\"sbtxt" + data:post.id + "\",0);"' expr:onmouseover='"javascript:showsbtext(\"sbtxt" + data:post.id + "\",4);"' rel='nofollow' target='_blank' title='Twitter'><img alt='Twitter' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjh7eh6nMQ0eEW9kI3_GsvkO1GKktfG1USGSRt_qmG0JQsva2ykjsac3jPXhsk5RhtYEGJEg7Ek829qA81-mGY6BI6doV7XGyxIxCuI0vgbT5EwTRorPuvCemNW7Im18flSoPmMYWRpz8c/s400/Twitter.png'/></a>



<a expr:href='"http://www.linkedin.com/shareArticle?mini=true&url="+ data:post.url + "&title=" + data:post.title' expr:onmouseout='"javascript:showsbtext(\"sbtxt" + data:post.id + "\",0);"' expr:onmouseover='"javascript:showsbtext(\"sbtxt" + data:post.id + "\",5);"' rel='nofollow' target='_blank' title='Linkedin'><img alt='Linkedin' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEieYKONJgVwc5hXKjkP7JwBFmZbcaVTpPceP7nJN_idmtsG0TLVXOeVlPCGuB6XBFqJZKCzWE1t4YlcJhAbSXo5e6zxyzk3wNgDjcdo7A2pAohyphenhyphenYZN-_wavN4UjCQDHROlaAa4l_DNu5jo/s400/Linkedin.png'/></a>



<a expr:href='"http://www.stumbleupon.com/submit?url="+ data:post.url + "&title=" + data:post.title' expr:onmouseout='"javascript:showsbtext(\"sbtxt" + data:post.id + "\",0);"' expr:onmouseover='"javascript:showsbtext(\"sbtxt" + data:post.id + "\",6);"' rel='nofollow' target='_blank' title='StumbleUpon'><img alt='StumbleUpon' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjZQFgj0uE_NNeh4ynPcHNRMhAyH0cTkHTcmbGQmlzi_-1hKK5_NocP2HhXe_KnQQlOyhUEgDtgrwO_iXwEIdvxUK1s-7BkGHI6zK41XiIXklGszn7rcXI5aRW4FmgnKtfZ1X5P-HSKG-4/s400/Stumbleupon.png'/></a>

</div>



<div id='row2'>

<a expr:href='"http://technorati.com/faves?add="+ data:post.url + "&title=" + data:post.title' expr:onmouseout='"javascript:showsbtext(\"sbtxt" + data:post.id + "\",0);"' expr:onmouseover='"javascript:showsbtext(\"sbtxt" + data:post.id + "\",7);"' rel='nofollow' target='_blank' title='Technorati'><img alt='Technorati' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgpVhWCn9N3s7miHY7wMl43dl1iA6KLFQ7GOk5KuQI25Ign5af-1xlHJGmkueB0KQBA1Cz_r0FLRceiGNiIeBlIIFw4zw4OQKyegq0JVp6nL4wK0Xd3gIMGEQIcvxB4iATrcYgHJVLRl-Y/s400/Technorati.png'/></a>



<a expr:href='"http://www.google.com/bookmarks/mark?op=add&bkmk="+ data:post.url + "&title=" + data:post.title' expr:onmouseout='"javascript:showsbtext(\"sbtxt" + data:post.id + "\",0);"' expr:onmouseover='"javascript:showsbtext(\"sbtxt" + data:post.id + "\",8);"' rel='nofollow' target='_blank' title='Google Bookmarks'><img alt='Google Bookmarks' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgihyadEYPNWMnteOtw8UpkPZq8MRCKKzeWXClOZhqAJ1ACsriHOeYZDlDG1G-Ab5qsFg-ct6_RABw8c6dHI8dGIxnWUFys9lFgyr-xTl8iEc5GYFAb6ku1JjP2Bl0wqEB4aCuxow2jKVk/s400/Google.png'/></a>



<a expr:href='"http://www.mixx.com/submit?page_url=" + data:post.url' expr:onmouseout='"javascript:showsbtext(\"sbtxt" + data:post.id + "\",0);"' expr:onmouseover='"javascript:showsbtext(\"sbtxt" + data:post.id + "\",9);"' rel='nofollow' target='_blank' title='Mixx'><img alt='Mixx' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiR1BULEj1-A1ym1Y4-cGCtrV3ustuxkN1oz-fcGOwWzu3vixgw4QQfjYfjqsK9VUB9FhiBagUz5QQrhZuxhDppTIe1iPGMfeNjsXA0-FUU6hi1-9aegDpNMJd9JMdyvQ4Naq38IlnSjtY/s400/mixx.png'/></a>



<a expr:href='"http://myweb2.search.yahoo.com/myresults/bookmarklet?u=" + data:post.url + "&=" + data:post.title' expr:onmouseout='"javascript:showsbtext(\"sbtxt" + data:post.id + "\",0);"' expr:onmouseover='"javascript:showsbtext(\"sbtxt" + data:post.id + "\",10);"' target='_blank' title='Yahoo!'><img alt='Yahoo!' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj63qlitN4Di6lt0kTM0UAfnriZxPQeLF5PMzfyC4blLXE8FtxkR5J-dfTlA7sXqMjUyv-3crwyNXSxedPQUbCUYtMaN0uUQXoXrW8PqMrtg64KJ5E4AVTA7dEe-d6uWx_Wv5TqBBLljdM/s400/Yahoo.png'/></a>



<a expr:href='"http://www.newsvine.com/_tools/seed&save?u="+ data:post.url + "&title=" + data:post.title' expr:onmouseout='"javascript:showsbtext(\"sbtxt" + data:post.id + "\",0);"' expr:onmouseover='"javascript:showsbtext(\"sbtxt" + data:post.id + "\",11);"' rel='nofollow' target='_blank' title='Newsvine'><img alt='Newsvine' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgrinNBsJLfIkQ629Q1e26R9LpOEuirsdpqxRefKca-kjZzPXwhPCRiLztIkBFvU2gfGZE3pGrvUUZJUQfayXUVhOAQaMPa12ndEFQZYTPZNoSyMUxDX4g6VvUI3SmwxYqj2-1DUCGtWZg/s400/newsvine.png'/></a>



<a expr:href='"http://reddit.com/submit?url=" + data:post.url + "&title=" + data:post.title' expr:onmouseout='"javascript:showsbtext(\"sbtxt" + data:post.id + "\",0);"' expr:onmouseover='"javascript:showsbtext(\"sbtxt" + data:post.id + "\",12);"' target='_blank' title='Reddit'><img alt='Reddit' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhXXnFIssF8h68UE3jYEtj4CzbOkbZlvzQ24KLFoOT-f2vRhAGae-kM_hIVRySDxZrDcOFIZmiUSM9ScvPH8fpDw-K7gXOo_P33SdlF7yf-VCFO1-lvG3jb-sgSRs6Wxyijoxfqi6jEQQY/s400/Reddit.png'/></a>

</div><!-- please don't remove this credit! --><div class="tbzcredit"><a href="http://tipsbloggerzacky.blogspot.com/2010/01/memperkenalkan-tbz-bookmarking-widget.html" target="_blank">Get this widget!</a></div>

</div>



8. save template, dan lihat hasilnya

semoga berhasil

READ MORE - Membuat icon bokmarks

Tampil Dengan Template Baru...




Setelah lama Udhi Gak pernah ngurek2 ne blog, akhirnya udhi jadi makin rindu ama blog udhi yang kebagian PR....
Yach, mesti kagak ade PRnya juga Kagak apa2..(UDhi ngambek nech,,).. Oya.. sebenarnya udhi mau cerita apaan sech????
"lama tenggelam, Muncul dengan perubahan,,,"
ini yang jadi inspirasi Udhi, Liat tuch template baru Udhi, cakep khan.... Ini sech template curian, yang udhi curi dari bang del, habis pusing nyari kagak dapat2 yang kayak punya bang del, ya udah udhi curi aja!!! (semoga bang del kagak marah).
Buat temen2 yang singgah diblog Udhi, Udhi mohon dengan sangat masukkan dan kritikannya tentang template udhi yang ini ye...!!!
sekian dulu sobad,,, ane mau maem dulu...
oy, kira2 ini melanggar hukum blogging kagag??? udhi kan nyuri tampilan blognya orang???
READ MORE - Tampil Dengan Template Baru...

Menu Navigasi Horisotal


Sambil nongkrong dikampus iseng - iseng buka blog, eh ada komentar dari salah satu sobad Udhi, yang minta dibuatin tampilan menu kayak punya udhi....

Berhubung karena temen UDHI yang bernama compiequ sempet minta dibuatin tab menu kayak punya udhi, sekarang Udhi kasi tutorialnya, he....
sebelumnya udhi minta maaf telat mostingnya, tapi gak apa2 yang terpenting sekarang udhi udah postingin....

OK langsung kita mulai aja>> MEnuju TKP
Ikutin langkah dibawah ini!!

1. Sobad mesti download dulu java scrip yag udah Udhi simpen khusus buat sobad semua, Sobad downloadnya DISINI aja

2. Buka scrip tadi dengan menggunakan notepad, terus copy keseluruhan isinya dan paste tepat diatas </HEAD>

3.copy kode dibawah ini dan letakkan diatas kode ]]></b:skin>


4. cari kode seperti dibawah ini
<div id='header-wrapper'>
..........................
..........................
..........................
<div>

Kalau udah ketemu, copy and paste kode dibawah ini dibawah kode tadi!!
<div id='nav'>
<b:section class='header-tabs' id='header-tabs' preferred='yes' showaddelement='no'>
<b:widget id='LinkList1' locked='true' title='Top Tabs' type='LinkList'/>
</b:section>
</div>

6. Setelah itu, masuk ke TATA LETAk -> Page elemen
Klik edit pada top tabs, seperti pada gambar dibawah

Maukkan elemen yang ingin sobat tampilkan, Misalnya Tips Blogging, Free download dan lain - lain sesuai dengan kreasi sobad masing - masing


semoga bermanfaat......




READ MORE - Menu Navigasi Horisotal
Return top