22 Oktober 2014

Penanda Pos Automatik Untuk Blog

Tiada ulasan:
 
Demo di sini


Cara Pemasangan


Langkah 1: 'Log in' ke dalam 'Blogger dashboard' anda --> pergi ke 'Layout' --> 'klik Add a Gadget', dan cari 'widget' HTML/JavaScript

Langkah 2: Klik pada tombol 'add' yang berbentuk + untuk membuka konfigurasi 'widget' HTML/JavaScript


Langkah 3:Di dalam konfigurasi 'widget' HTML/JavaScript tersebut,'copy' dan 'paste' kod yang diberikan dibawah ini

<script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="//cdn.jsdelivr.net/jquery.marquee/1.3.1/jquery.marquee.min.js" type="text/javascript"></script>
<style>
#headlines {
overflow:hidden;
position:relative;
line-height:25px;
background:#34495e; /*Background Color*/
height:45px;
padding:0 0 0 135px;
}
#headlines h3 {
color:#fff;
font-family:Oswald, sans-serif;
font-size:17px;
font-weight:400;
text-transform:uppercase;
margin-left:-115px;
margin-top:10px;
position:absolute;
}
#headlines .right_arrow {
padding:0 38px 0 110px;
display:block;
background:url(//lh6.googleusercontent.com/--o4encAx1Tc/VApRPFfbQFI/AAAAAAAALd4/kf0T7CNSvY0/s41/arrow.png) no-repeat right center;
height:46px;
line-height:46px;
position:absolute;
left:0;
top:0;
}
#ticker_post {
position:relative;
margin:0;
margin-left:20px;
height:50px;
width:auto;
}
.marquee {
width: 980px; /* Width of the area where the inputs are shown*/
overflow: hidden;
line-height: 45px;
}
.js-marquee a {
font-family:Oswald, sans-serif;
font-size:15px; /* Text size*/
color: #FFF; /* Color of text */
padding-bottom: 20px;
text-decoration: none;
}
.ticker_separator {
color:#FFF; color: #FFF; /* Color separator entries */
margin:0 10px;
}
</style>
<div id='headlines'>
<h3>Recent</h3>
<div class='right_arrow'></div>
<script>
var blog_url = "http://namablogdimiliki.blogspot.com";
var numero_post = 10; // Number of entries to display
</script>
<script type="text/javascript" src="http://yourjavascript.com/946415552/ticker.js"></script></div>
<div style='clear:both;'></div>
<script>
$(window).load(function() {
$('.marquee').marquee({
direction: 'left', // Address of the marquee, use left or right
duration: 25000, // speed
pauseOnHover: true,
duplicated: true
});
});
</script>

Langkah 4 Ubahsuai perkataan yang berwarna merah kepada nama blog anda contohnya seperti http://simpleminima.blogspot.com.

Perkataan yang diwarnakan hijau pula adalah penerangan untuk memudahkan anda melakukan pengubahsuain yang lain.Setelah berpuas hati,klik Save


Langkah 5 Setelah selesai menentukan kedudukan widget tersebut,klik Save arrangement dan akhir sekali klik View Blog untuk melihat hasilnya


Setelah selesai mengikut arahan yang diberikan,anda akan dapat melihat widget Automatic Ticker tersebut di blog anda.

*Jika pos di blog anda adalah kurang dari sepuluh sila ubah jumlah nombor pada Number of entries to display.

Tiada ulasan:

Catat Ulasan

TERIMA KASIH UNTUK KOMENKOMEN TERBARU

 
© 1986. Aideal Fitri - fitri1986 Malaysian Blogger