Tampilkan postingan dengan label tips Bloger. Tampilkan semua postingan
Tampilkan postingan dengan label tips Bloger. Tampilkan semua postingan

cara meringkas alamat url / link

B
anyak sekali Situs yang menawarkan jasa untuk memperpendek / meringkas url / link yang kita miliki, tujuannya agar tidak terlalu sulit untuk diingat. dari perusahaan internet terbesar sendiri menawarkan jasa ini yang sering di sebut dengan Google url Shortener, situs lain yang menyediakan jasa ini adalah AdF.ly , ini yang sering saya gunakan, karena selain dapat meringkas url, situs ini juga menawarkan kerjasama dalam menghasilkan beberapa Dolar, dari mereka yang mencari alamat situs lewat link yang kita miliki.


cara pendaftaran ke situs ini sangatlah mudah dan gratis, dan langkah untuk meringkas url kita pun tidak begitu sulit, tinggal Copy Paste saja. AdF.ly juga memberikan kita menjadi seorang publisher ( pihak yang mempublikasikan suatu halaman, dan advertiser ( pihak yang memiliki halaman untuk di promosikan ).
kita juga bisa mendapatkan banner dengan berbagai pilihan ukuran sesuai yang kita inginkan, seperti di bawah ini





Gambar melayang di pojok Halaman

sekali lagi postingan untuk mempercantik Blog, Tapi masih saya ingatkan untuk efisiensi acces blog anda akan berkurang karena semakin banyak Gambar ataupun animasi yang akan ditampilkan. seperti biasa kta perlu menambahkan kode -kode pada bentuk mentah halamn Blog kita.
pertama yang harus kita lakukan adalah meletakkan gambar ataupun animasi Gif pada sebuah situs hosting. sebagai contoh kita gunakan situs Photoserver.ws, upload gambar kalian disana dan pilih url ada direct link-nya.


kedua login ke Blog anda masing - masing dan pilih tata letak Edit HTML, pada area penulisan script cari kode ]]></b:skin>
lalu Copy dan paste kode di bawah ini diatas kode ]]></b:skin>

berikut code sript-nya :


selanjutnya cari code

</body>
copy dan paste code sript dibawah ini diatas code </body>
berikut code-nya

ganti xxx.blogspot.com dengan alamat Blog anda
dan Gantikan alamat gambar atau animasi dengan alamat gambar yang tadi anda upload
simpan Template anda dan selesai
untuk posisi bisa anda ubah sesuai keinginan
jika berhasil baca Hamdallah jika blom berhasil maka anda belum beruntung, semoga bermanfaat.


Membuat Efek Marquee ( text Bergerak )

Kadang-kadang untuk mempercantik halaman Blog, tips berikut sangat banyak dilirik oleh para blogger. Marquee adalah kode html yang berfungsi untuk memberikan efek ke banyak arah gerak sesuai dengan keinginan. Adapun efek adalah gerakan horizontal ke kiri dan kanan, aataupun kiri ke kanan, dan efek gerak vertikal ke atas dan bawah.

mari kita coba bersama-sama: Kode efek marquee adalah seperti sampel ini  
<marquee> xxx </ marquee>
Dimana, <marquee> adalah Kode untuk menggerakkan text, sementara xxx adalah isi teks yang akan beri efek gerak dan </ marquee> adalah penutup kode

dengan kode di atas saja, sebenarnya sudah mampu memberikan efek gerak, tetapi arah yang dihasilkan umumnya dari kiri ke kanan secara horizontal.

kita masih bisa memodifikasi gerakan dengan arah gerak yang lain, perhatikan contoh berikut :


Efek dari kanan ke Kiri
kodenya adalah :

Hasilnya :
Gerak dari Kanan Ke kiri


Efek Dati Kiri ke Kanan
Kodenya adalah :

Hasilnya :

Gerak dari Kiri ke Kanan

Efek gerak kanan kiri sesui ukuran Bidang
kodenya adalah :


Hasilnya :

Efek Gerak Kanan Kiri

Efek gerak Vertikal Ke atas
kodenya adalah :


hasilnya :
Gerak Vertikal ke Atas
kita dapat menambahkan langkah untuk menghentikan efek gerak ketika teks didekati oleh mouse, dan bergerak lagi ketika mouse pointer meninggalkan teks:
perhatikan kode dibawah ini :

hasilnya ( dekatkan mouse pada area Text yang sedang bergerak )
Dekatkan Mouse anda
dengan langkah diatas kita dapat memainkan Link yang bisa diklik oleh pengunjung :
perhatikan Kode di bawah ini :



hasilnya :
Mikrotik Router
satu lagi, kita masih dapat memberikan kode tambahan untuk memberikan latar belakang pada teks yang bergerak
cermati kode berikut :

hasilnya :
Text dengan Background Warna merah

Silahkan berikan kreasi lain yang mugkin dapat di tambahkan untuk memodifikasi efek gerak pada text, semoga dapat menghilangkan rasa bosan dalam aktifitas ngeblog anda


Membuat Menu TabView

Berikut adalah posting dari icki tentang bagaimana pembuatan tag View untuk dapat dipasang pada blog kita. ada yang bilang bagi - bagi ilmu adalah sesutau yang baik untuk dilakukan.
langsung aje ye carany ade di bawah ni !



Berikut langkah-langkahnya
1.Login ke blogger dengan ID anda
2.Lalu Klik Menu Templates
3.Klik Sub Menu Edit HTML
4.Pada Kotak Edit HTML cari Kode ]]></b:skin>
5.Lalu Copy Kode berikut dan Pastekan diatas kode ]]></b:skin>


/* tab model 2 ateonsoft.com */
div.Tabateonsoft div.TFs
{height: 30px; overflow: hidden;}
div.Tabateonsoft div.TFs a
{float: left; display: block; text-align: center; text-decoration: none; font: normal 12px arial; padding:3px 5px 3px 3px; margin:0 5px 0 0;letter-spacing:-0.07em;
background:#f0f0f0;
color: #333;
border-top:1px solid #CCCCCC;
border-right:1px solid #999999;
border-bottom:1px solid #999999;
border-left:1px solid #cccccc;
-moz-border-radius-bottomright: 10px; -moz-border-radius-topright: 10px;
}
div.Tabateonsoft div.TFs a:hover
{ background: #E8E8E8;
border-top:1px solid #999999;
border-right:1px solid #cccccc;
border-bottom:1px solid #cccccc;
border-left:1px solid #999999;}
div.Tabateonsoft div.TFs a.Active
{ background: #E8E8E8;
color: #000000;
border-top:1px solid #999999;
border-right:1px solid #cccccc;
border-bottom:1px solid #cccccc;
border-left:1px solid #999999; font-weight:bold;}
div.Tabateonsoft div.Pages
{ clear: both; overflow: hidden; height:240px; border:1px solid #EFF0F1; padding:0;background: #ffffff; -moz-border-radius:5px;}
div.Tabateonsoft div.Pages div.Page
{height: 100%;padding: 0px; overflow: hidden; }
div.Tabateonsoft div.Pages div.Page div.floor
{ font-size:11px;padding: 3px 5px; text-align:left;} 

6.Lalu letakkan kode berikut dibawah kode <head>




<script src='http://ayomaju.com/friendsharingfile/ateonsoft_tab.js' type='text/javascript'/>


7.Save Template
8.Pergi ke halaman Element Halaman
9.Klik Add Widget Element
10.Pilih Menu HTML/Java Script
11.Lalu Copy kode berikut



<form action="tabateonsoft.html" method="get">
<div class="Tabateonsoft" id="Tabateonsoft">
<div class="TFs">
<a>tab1</a>
<a>tab2</a>
<a>tab3</a>
<a>tab4</a>
</div>
<div class="Pages">
<div class="Page"><!-- Tab -->
<div class="floor">
Disini letakkan kode untuk tab 1 anda
</div>
</div><!-- end Tab -->
<div class="Page"><!-- Tab -->
Disini letakkan kode untuk tab 2 anda
</div><!-- end Tab -->
<div class="Page"><!-- Tab -->
<div class="floor">
Disini letakkan kode untuk tab 3 anda
</div>
</div><!-- end Tab -->
<div class="Page"><!-- Tab -->
<div class="floor">
Disini letakkan kode untuk tab 4 anda
</div>
</div><!-- end Tab -->
</div>
</div>
</form>
<script type="text/javascript">tabateonsoft_name('Tabateonsoft');</script>

sekarang untuk modifikasi lebih lanjut terserah sobat semua mo diganti apanya kek, semoga bermanfaat