Hafiz Zulkafly
Memaparkan catatan dengan label Tutorial. Papar semua catatan
Memaparkan catatan dengan label Tutorial. Papar semua catatan

Tutorial : New Follower Widget (Classic Template/Blogskins)

Khamis, Januari 26, 2017

Assalamualaikum & Salam Sejahtera.

Terima kasih kepada yang bertanya. Tutorial INI dah tak valid. So harini nak kasi tutorial baru macam mana nak letak follower widget untuk pengguna Classic Template / Blogskins. 


1. Template 

2. Copy and Paste code bawah ni

<div><script type="text/javascript" src="https://apis.google.com/js/plusone.js"></script>
<div id="followers-iframe-container"></div>
<script type="text/javascript">
    window.followersIframe = null;
    function followersIframeOpen(url) {
      gapi.load("gapi.iframes", function() {
        if (gapi.iframes && gapi.iframes.getContext) {
          window.followersIframe = gapi.iframes.getContext().openChild({
            url: url,
            where: document.getElementById("followers-iframe-container"),
            messageHandlersFilter: gapi.iframes.CROSS_ORIGIN_IFRAMES_FILTER,
            messageHandlers: {
              '_ready': function(obj) {
                window.followersIframe.getIframeEl().height = obj.height;
              },
              'reset': function() {
                window.followersIframe.close();
                followersIframeOpen("https://www.blogger.com/followers.g?blogID\x3d<$BlogID$>\x26colors\x3dCgt0cmFuc3BhcmVudBILdHJhbnNwYXJlbnQaBjIyMjIyMiIGMTExMTExKgZmZmZmZmYyBjAwMDAwMDoGMjIyMjIyQgYxMTExMTFKBjIyMjIyMlIGMTExMTExWgt0cmFuc3BhcmVudA%3D%3D\x26pageSize\x3d21\x26origin\x3dPASTE URL BLOG SINI/");
              },
              'open': function(url) {
                window.followersIframe.close();
                followersIframeOpen(url);
              },
              'blogger-ping': function() {
              }
            }
          });
        }
      });
    }
    followersIframeOpen("https://www.blogger.com/followers.g?blogID\x3d<$BlogID$>\x26colors\x3dCgt0cmFuc3BhcmVudBILdHJhbnNwYXJlbnQaBjIyMjIyMiIGMTExMTExKgZmZmZmZmYyBjAwMDAwMDoGMjIyMjIyQgYxMTExMTFKBjIyMjIyMlIGMTExMTExWgt0cmFuc3BhcmVudA%3D%3D\x26pageSize\x3d21\x26origin\x3dPASTE URL BLOG SINI/");
  </script></div>
</div>
</div>
<div class='clear'></div>

3. Code yang di-bold tu boleh ganti dengan url blog korang. 

4. Save and preview.


Aku tak saran korang usik code dia sebab aku sendiri rasa code dia complicated. Tapi kalau nak usik juga terpulang. Kepada yang buat tapi tak menjadi boleh contact through ask.fm aku ye.


Sekian.
Follow my blog with Bloglovin

Tutorial : New Twitter Widget

Khamis, Disember 29, 2016

Assalamualaikum & Salam Sejahtera


Berminat nak letak widget twitter dalam blog, tapi taktau cara dia? Ok meh sini aku nak tolong ajar cara mudah yang korang cuma perlu copy paste sahaja. Macam mana preview widget tersebut? 





<center><div style="width:230px; border:4px double #eee;" ><a class="twitter-timeline" data-width="230" data-height="300" data-theme="light" href="LINK TWITTER KORANG"></a><script async src="//platform.twitter.com/widgets.js" charset="utf-8"></script></div></center>

Copy code atas ni and paste Layout > Add a Gadget > HTML/JavaScript.

Gantikan mana yang dibold tu mengikut citarasa korang. Yang untuk light tu boleh ganti ke dark.  Yang aku merah tu kena make sure sama ya. Satu lagi sebagai nota tambahan, kalau twitter korang protected, dia takkan keluar apa apa ye. So make sure unprotect korang punya twitter ye. Sekian


Wasalam.

Tutorial : Remove Powered By Blogger

Sabtu, Disember 24, 2016

Assalamualaikum & Salam Sejahtera

Kalau korang scroll bawah sekali pada blog korang atau tengok di layout blog akan nampak satu widget attribution Powered by Blogger. Okay sini aku nak share dua cara mudah untuk buang widget tersebut.


Cara Satu.

1. Template > Edit HTML > CTRL + F code bawah ini ;

<b:widget id='Attribution1' locked='true' title='' type='Attribution' visible='true'>

2.  Gantikan perkataan true kepada false kemudian save.

3. Pergi ke Layout > Attribution Gadget > Edit > Remove > Save.




Cara Dua

1. Template > Edit HTML > CTRL + F code ni ]]></b:skin>

2. Copy code bawah ni, paste di ATAS code ]]></b:skin> tadi.

#Attribution1 {
display:none!important;
}
3. Save


Boleh pilih salah satu cara sebab dua dua berkesan. Kalau tak berkesan, do inform me okay.

Sekian.

Tutorial : Social Icons

Selasa, November 29, 2016


Assalamualaikum & Selamat Sejahtera



First of all, ini bukan tutorial aku. I took from that website. Cuma ada few codes yang aku ubah ikut citarasa aku. Hahaha. Sekadar nak berkongsi dengan korang if any of you guys are looking for this. Macam mana social icons ni?


Thats it. So here is the codes ;

1. CSS Code.
<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css" />

cari code <head> and paste code atas ni bawah code <head> and then save.


2. Add Gadget > HTML/JavaScript, and paste code bawah

<style>
#socialicons {
    text-align: center;
}
#socialicons .icon{
    color: black;
    display: inline-block;
    font-size: 20px;
    text-align: center;
    margin: 0 6px 5px;
}
#socialicons .icon:hover{
    color: blue;
}
</style>

<div id="socialicons">
<a class="icon" href="LINK"><i class="fa fa-twitter"></i></a>
<a class="icon" href="LINK"><i class="fa fa-facebook"></i></a>
<a class="icon" href="LINK"><i class="fa fa-instagram"></i></a>
<a class="icon" href="LINK"><i class="fa fa-google-plus"></i></a>
<a class="icon" href="LINK"><i class="fa fa-heart"></i></a>
<a class="icon" href="LINK"><i class="fa fa-pinterest"></i></a>
<a class="icon" href="LINK"><i class="fa fa-youtube"></i></a>
<a class="icon" href="LINK"><i class="fa fa-tumblr"></i></a>
<a class="icon" href="LINK"><i class="fa fa-rss"></i></a>
<a class="icon" href="mailto:LINK"><i class="fa fa-envelope"></i></a>
</div>


3. Edit semua bold code, save and Siap


Tell me if its not working okay, InshaAllah i'll try to help :)


Sekian.

Tutorial : Show/Hide Navigation While Scrolling on a Web Page

Ahad, Jun 05, 2016


Assalamualaikum.

Tutorial ni di request oleh unknown dekat cbox. Memandangkan dia tak tinggal link blog dia maka aku panggil anon. Jangan marah k. Hahaha. Original code by this PAGE. Aku cuma edit sikit mengikut citarasa aku sendiri, and special thanks to Wanaseoby sebab share link dengan den.

Untuk live preview maaf tiada. Tapi buat masa terdekat boleh tengok macam mana navigation dekat blog wana dan blog den berfungi macam tu lah live preview nya.


1. Layout > Add a Gadget > HTML/Javascript  (Gadget bawah header recommended)


2. Paste code berikut.

<style>
#sebelum {
padding:10px;
}

#selepas {
width:100%;
background:#eee;
display:none;
position:fixed;
top:0;
left:0;
z-index:999;
opacity:1;
padding:0px;
text-align:center;
}
.navisatu a {
padding:5px;
border:1px solid #eee;
background:#fff;
text-decoration:none;
color:#777;
margin:5px;
letter-spacing:1px;
font-family: 'Pontano Sans', sans-serif;
font-size:11px;
color:black;
text-align:center;
}

.navidua a {
padding:7px;
background:#eee;
text-decoration:none;
color:#777;
margin:5px;
letter-spacing:2px;
text-transform:uppercase;
font-family: 'Pontano Sans', sans-serif;
font-size:14px;
color:black;
text-align:center;
}
</style>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script>
<center><div id="sebelum">
<div class="navisatu">
<a href="">NAVIGATION 1</a>
<a href="">NAVIGATION 2</a>
<a href="">NAVIGATION 3</a>
<a href="">NAVIGATION 4</a>
</div></div></center>

<div id="selepas"><div class="navidua">
<a href="">NAVIGATION 1</a>
<a href="">NAVIGATION 2</a>
<a href="">NAVIGATION 3</a>
<a href="">NAVIGATION 4</a>
</div></div>

<script>
    $(document).ready(function() {
        var headerTop = $('#sebelum').offset().top;
        var headerBottom = headerTop + 10; // Sub-menu should appear after this distance from top.
        $(window).scroll(function () {
            var scrollTop = $(window).scrollTop(); // Current vertical scroll position from the top
            if (scrollTop > headerBottom) { // Check to see if we have scrolled more than headerBottom
                if (($("#selepas").is(":visible") === false)) {
                    $('#selepas').fadeIn('fast');
                }
            } else {
                if ($("#selepas").is(":visible")) {
                    $('#selepas').hide();
                }
            }
        });
    });
</script>


3. Edit mana yang patut. Kemudian save dan selesai.


Aku dah cuba simplified kan coding tu dengan guna istilah yang lebih mudah. Nah serba sedikit penjelasan bagi istilah aku guna ;

Sebelum : Bila buka blog korang . Dia berada di kedudukan asal / original
Selepas : Bila scroll blog ke bawah dia akan lekat pada top blog.
Navisatu : Untuk navi dikedudukan asal
Navidua : Untuk navi bila dia dah lekat dekat atas.

Okay kalau tak paham tanya, and sorry agak berterabur sebab dah lama tak bagi tutorial. Bye.


Tutorial : Download Video Di Facebook Guna Smartphone

Isnin, April 04, 2016

Assalamualaikum.

Dalam entry sebelum ni. Aku ada ajar macam mana nak download video dekat facebook guna PC korang kan? So kali ni aku nak ajar download video di facebook menggunakan smartphone korang.


1. Buka Play Store dan cari app "MYVideo Downloader for Facebook". Jumpa sila install.




2. Dah siap install boleh buka app tersebut dan login seperti biasa.




3. Selesai sesi login. Cari video yang korang nak download. Kemudian klik pada video tersebut dan klik button download.




4. Korang boleh check progress download. Bila dah settle dia akan masuk ke downloaded.




5. Untuk pengetahuan korang. Korang jugak boleh download video yang korang dah like, video yang korang dah share or saved and etc. Dengan cara swipe app tersebut dari kiri ke kanan untuk ke menu, dan klik pada my video.






6. Semua video yang korang dah download tadi akan dia save dalam gallery korang atau album atau video atau sama waktu dengannya.


Settle dan selamat menonton.


Sekian.

Tutorial : Muat Turun Video Di Facebook Menggunakan PC.

Ahad, April 03, 2016

Assalamualaikum.


Cara mudah download video di facebook menggunakan PC anda. Cara ni tak memerlukan korang untuk download apa apa software tambahan. Mungkin ada orang dah tahu cara ni atau mungkin ada orang punya cara lain. Aku sendiri baru belajar method ni and terus nak kongsi dengan korang.


1. Log in Facebook. 

2. Cari video yang korang nak download.

3. Right click pada video yang ingin didownload. Kemudian pilih show video URL




4. Copy video URL yang telah dipaparkan atas video tersebut.




5. Tukar kan yang dihighlight merah itu dari www ke m sahaja. Macam gambar rajah dibawah.



TO



6. Hit enter. Kemudian anda right click pada video tersebut dan anda akan lihat option Save Video as. Rename file and save!





Semudah kicap ABC kan? Mohon klik pada gambar untuk proses tumbesaran. Haa apa lagi. Sila lah download segala video facebook yang selama ni korang nak download sebanyak yang korang nak. Hehehe. Later aku akan update macam mana nak download video difacebook guna smartphone pulak ye.


Sekian.

Tutorial : Google Fonts

Jumaat, Januari 22, 2016


Assalamualaikum.

Harini aku nak share satu tutorial simple. Macam mana nak guna Google Font dekat blog korang. Mungkin pening mungkin tidak. Bergantung macam mana pemahaman korang. Kalau tak paham jangan malu nak tanya. Untuk Template Designer sahaja.


1. Pergi ke Google Fonts dan pilih font mana yang berkenan dihati.


2. Dah jumpa yang berkenan dihati kemudian boleh tekan button quick use. Macam gambar bawah ni;



3. Kemudian scroll sampai jumpa macam gambar bawah ni



4. Pergi ke Template > Edit HTML > Paste code no 3 (dalam gambar) bawah code <head>


5. Kemudian CTRL + F  code </head> bila dah jumpa. Paste code </link> atas code </head> yang korang cari tadi. Kemudian baru boleh save.


6. Now korang boleh copy code no 4 (dalam gambar) and paste dekat mana mana bahagian yang korang nak. Kalau nak tukar whole font blog boleh paste bawah code body { 


7. Save dan siap.

Pening sikit kan? Kalau tak paham tanya ye. In Shaa Allah mana yang boleh tolong aku cuba tolong.

Bye

Tutorial : Download Video Youtube Dengan Mudah!

Ahad, Januari 17, 2016


Assalamualaikum

Okay maybe dah ramai yang tau method mudah ni macam mana nak download. Aku saja nak share untuk mereka yang masih taktau. And this tutor boleh cuba through laptop and smartphone.


Okay first buka video yang korang nak download:-



Then delete yang dah aku highlight tu. Kemudian ganti dengan perkataan SS macam gambar dekat bawah ni:-



Kemudian enter and korang akan terus direct ke page bawah ni:-


Boleh pilih size ikut citarasa korang. Kemudian tekan download. Siap. Tutorial ni boleh pakai guna phone juga. Step yang sama macam dekat atas tu. So memasing boleh cuba. Mana mana tak paham boleh tanya. Sekian.

Bye.

Tutorial : Read More Post Blog

Jumaat, September 18, 2015


Assalamualaikum.




12 hari lepas. Sorry sebab im pretty busy awal sem ni. Bila final year ni serious semacam sikit feeling dia walaupun masih di awal semester. Nevermind, thanks by the way sebab sudi request. So macam ni caranya ;

1. Dashboard > Layout > Blog Post




2. Tukar number yang arrow tu tunjuk kepada bilangan yang korang suka and perkataan read more tu pon boleh tukar ke perkataan yang korang nak.




3. Save. Kemudian karang entry korang sampai habis. Lepas dah habis , sila pilih sampai mana je entry yang korang nak di tunjuk. Klik pada penghujung entry yang nak di display macam step 1. Kemudian tekan Insert Jump Break macam dekat step 2. Kemudian akan jadi macam ni.





4. Publish post korang. and the result will come out like this ;




5. Siap. So each post korang kena buat macam ni. Kalau tak tak jadi read more tu. So far macam ni je cara yang aku tau. Taktau kalau kalau ada cara lain.


Sekian.

Tutorial : Beli Domain di NetKL

Ahad, Ogos 23, 2015


Assalamualaikum.

Sorry bagi yang menunggu sebab janji lama dah nak ajar korang semua macam mana nak beli domain dekat NetKL. Sebenarnya ingat ingat lupa gak sebab haritu beli guna phone. So follow gambar dibawah and mana mana step tak paham jangan malu nak tanya. Inshaallah den tolong semana mampu.


1. Buka laman web NetKL

2. Klik pada Order Now




3. Domain Registration





4. Masukkan url yang korang nak. Kemudian check availability.





5. Proceed to checkout.






6. Daftar akaun dulu. Kemudian pilih payment method.




7. Settle satu step. Tunggu dapat email dari netkl kemudian follow instruction by netkl. Make sure masa daftar tu email yang sah and korang boleh buka email tersebut. Kalau ada sebarang pertanyaan boleh email ke netkl. Service yang bagus and cepat.


Step ni bagi mereka yang tak reti nak apply domain ke blog sendiri macam den so boleh pakai service pasang domain yang disediakan oleh netkl dengan harga serendah rm3 sahaja.

1. Back to homepage netkl. Kemudian tekan order now.

2. Pilih Blogging.



3. Follow macam gambar bawah ni ;



4. Masukkan detail seperti berikut.



Add to cart. Kemudian buat pembayaran. Tunggu dalam masa beberapa jam (not sure) kemudian pihak netkl akan pasangkan domain baru korang ke blogspot korang. Siap.


Sorry tutor clumsy sikit. Harap korang boleh follow slow slow. Jangan risau kalau lost ke apa ke sebab service netkl memang tak mengecewakan. Korang boleh contact diorang by email ;

Sales and Billing Department
sales@netkl.com
atau
Technical Support Department
support@netkl.com


Sekian.

Tutorial : Navigation Style #12

Selasa, Jun 16, 2015

Assalamualaikum.

Lama dah tak dapat request finally *shed tears* hahaha. Terima kasih sebab request. Atas sebab request anda , berupadate jugak lah blog ni. Navigation kali ni jenis lekat atas tu. Kekalnya ia disitu tidak kira sejauh mana korang scroll blog hingga kebawah sekali pon. Ok lupakan.




Code ;

<style>
.navigation a {
font:13pt cambria;
text-decoration:none;
letter-spacing:2.5px;
text-transform:uppercase;
color:black;
padding:0px 30px 0px 30px;
text-shadow:4px 0px transparent, -4px -0px transparent;
-webkit-transition-duration:0.5s;
-moz-transition-duration:0.5s;
-ms-transition-duration:0.5s;
-o-transition-duration:0.5s;
transition-duration:0.5s;
}
.navigation a:hover {
text-shadow:0px 0px #888, -0px 0px #888;
}

</style>
<br />
<div style="left: 0px; padding: 0px; position: fixed; text-align: center; top: 0px; width: 100%; z-index: 999;">
<div class="navigation" style="background:url(http://i.imgur.com/Y2IYZl4.png); border: 1px solid #eee; margin: 0 auto; padding: 15px 0px 20px 0px; width: 1040px;">
<a href="LINK">LINK1</a>
<a href="LINK">LINK2</a>
<a href="LINK">LINK3</a>
<a href="LINK">LINK4</a>
<a href="LINK">LINK5</a>
</div>
</div>

Copy and Paste code diatas di ;

Dashboard > Layout > Add a Gadget > HTML/JavaScript > Save.


Macam biasa, mana code yang di-bold-kan sila ubah mengikut kesusaian blog korang. Sekian.



edited
"for those yang navigation ni bertindih dengan header korang. Sila ke Template >
Edit HTML dan cari code ni body { , dah jumpa sila tambah code : margin-top:110px; bawah code yang dicari tadi. yang warna biru tu, ubah ikut citarasa korang okay"


Bye. o/


Tutorial Hidden Cbox #1

Isnin, Jun 15, 2015

Assalamualaikum

Tutorial ni amat sesuai untuk blogger yang taknak semakkan sidebar atau mungkin sidebar dah banyak benda lain so sangat amat digalakkan hide cbox korang. Macam mana rupa hidden cbox ni?


Amacam, berminat? Nahh code nya ;

<style>
.cbox {
position:fixed;
bottom:-205px;
left:10px;
padding:5px;
-webkit-transition-duration:0.8s;
-moz-transition-duration:0.8s;
-ms-transition-duration:0.8s;
-o-transition-duration:0.8s;
transition-duration:0.8s;
}
.cbox:hover {
bottom:0px;
}
</style>

<div class="cbox">
<div style="background: url(http://i.imgur.com/UKVMkFY.png); border-radius: 10px 10px 0px 0px; color: black; font: 14px cambria; height: 20px; letter-spacing: 1px; margin-left: 5px; padding-top: 4px; text-align: center; text-shadow: -1px 0 white, 0 1px white,1px 0 white, 0 -1px white; text-transform: uppercase; width: 185px;">
Shout It Out Here!</div>
YOUR CBOX CODE GOES HERE
</div>
<div style="background: url(http://i.imgur.com/UKVMkFY.png); border-radius: 0px 0px 10px 10px; height: 18px; margin-left: 5px; padding-bottom: 2px; width: 185px;">
</div>
</div>


Dashboard > Layout > Add a Gadget > HTML/JavaScript


Save. Mana mana code yang di-bold kan tu sila ubah mengikut kesusaian cbox korang okay? Sekian.

Bye o/

Tutorial : Remove Folder Picasa Dari Galeri Smartphone

Selasa, Januari 27, 2015

Assalamualaikum.




Pernah tak folder folder picasa macam ni menyemak dalam gallery or album korang? and bila buka gambar tu, nak delete takde delete punya function. Lepas tu taktau macam mana nak lenyapkan benda tu dari phone korang? Okay kepada sesiapa yang taktau macam mana cara nak remove tu meh sini den ajor kann. Follow step bawah ni slow slow deh. Harap tak memeningkan :D


 Setting > General > Account.


Pilih google.


Klik pada email anda.


Scroll sampai jumpa seperti diatas. Kemudian untick.


Keluar dan cari Application Manager


Akses ke tab All. Kemudian cari aplikasi gallery. Contoh jika anda pengguna sony , cari album. Jika anda pengguna samsung cari gallery.


Done buka semula gallery and tadaaaa.



Tutorial ni hanya untuk pengguna peranti android sahaja.  Cara cara nya juga mungkin berbeza beza mengikut brand dan juga jenis model phone anda dan juga version android anda. Kalau tak paham boleh tanya. Inshaallah mana yang saya boleh tolong saya tolong, Selamat mencuba :D

Tutorial : Navigation #11

Selasa, Jun 24, 2014

assalamualaikum.




dapat request ni lama dah . maaf buat tertunggu . navigation yang dia maksudkan tu macam yang den pakai before template sekarang . actually den adaptasi dari code tutorial yang ini ; http://hafizzulkafly.blogspot.com/2013/07/tutorial-navigation-with-hover-7.html . bila dah adaptasi maka jadinya begini ;




tutorial ni untuk pengguna template designer , simple template sahaja . yang lain den taktau jadi ke tidak . okay so nah amek codenya , paste dekat Layout > Add a gadget > HTML/JavaScript ;


<style>
.navig a{
display:inline-block;
width:80px;
background:;
padding:8px 7px 7px 7px;
color:#fff;
-webkit-transition: all 0.4s ease-in-out;
-moz-transition: all 0.4s ease-in-out;
-o-transition: all 0.4s ease-in-out;
transition: all 0.4s ease-in-out;
font:12px georgia;
font-style:italic;
text-decoration:none;
text-transform:lowercase;
letter-spacing:1.5px;
margin:3px 5px 1px 5px;
border:1px solid #fff;
border-left:none;
border-right:none;
}
</style>
<div style="width:890px; background:; text-align:center; padding:0px 5px 5px 5px; margin-left:-30px; margin-top:-90px; color:#fff;"><div class="navig">
● <a href="" title="">dashboard</a> ●
<a href="" title="">tutorial </a> ●
<a href="" title="">affiliates</a> ●
<a href="" title="">instagram</a> ●
<a href="" title="">vscogrid</a> ●
<a href="" title="">refresh</a> ●
</div></div>


ohh ya , sebelum terlupa , make sure paste dekat ruangan HTML bawah header macam yang den tunjuk dekat gambar bawah ni . kalau tidak tak jadi ;




Save and Siap . Mana mana code yang den bold-kan , make sure ubah ikut kesusaian blog korang . sebab yang den bagi tu width den punya blog . anything nak tanya tak paham , jangan segan nak tanya . boleh shout dekat ask.fm atau tinggal komen dekat ruangan komen . maaf , lama dah tak update tutor . sumpah awkward . kbai .

Tutorial : Navigation #10

Rabu, Februari 12, 2014

Assalamualaikum.

Yeah finally . Navigation dah siri ke-10 . lol . Okay dapat request dari ask.fm , tapi sorry tak publish soalan dia dekat ask.fm atas sebab sebab tertentu . Macam mana navigation kali ni ? Navigation kali ni sangat sesuai bagi blog yang tak ber-header . Macam ni navigation-nya ;




Macam tu . Dia lekat dekat atas tu . Code dia sedikit berterabur . So deal with it . HAHA .


1. Copy and Paste code bawah ni dekat Layout > Add A Gadget > HTML & JavaScript.

<style>
.btd a{
display:inline-block;
width:130px;
text-align:center;
text-transform:none;
font:12px georgia;
text-transform:lowercase;
text-decoration:none;
font-style:italic;
color:#111;
opacity:0.9;
margin:2px;
padding:5px;
letter-spacing:2px;
text-shadow:4px 0px transparent, -4px -0px transparent;
-webkit-transition-duration:0.5s;
-moz-transition-duration:0.5s;
-ms-transition-duration:0.5s;
-o-transition-duration:0.5s;
transition-duration:0.5s;
}
.btd a:hover {
text-shadow:0px 0px #000, -0px 0px #000;
}
.howon {
position:fixed;
left:0px;
top:0px;
width:100%;
background:url(http://i.imgur.com/liHPRB9.jpg);
padding:20px 10px 20px 80px;
border-bottom:6px solid #fff;
margin-bottom:10px;
box-shadow:1px 1px 1px #aaa;
z-index:999;
}
.satu {
margin-left:120px;
margin-top:48px;
background:white;
width:760px;
opacity:0.85;
border-radius:0px 15px 15px 0px;
}
</style>
<div class="howon">
<img src="http://i.imgur.com/jOtEyMH.jpg" style="width:110px; float:left; border:8px solid #fff; border-radius:100px; z-index:999;" />
<div class="satu"><div class="btd">
<a href="LINK HERE">Title1</a>
<a href="LINK HERE">Title2</a>
<a href="LINK HERE">Title3</a>
<a href="LINK HERE">Title4</a>
<a href="LINK HERE">Title5</a>
</div></div></div>


2. Save. Kemudian pergi ke Template > Edit HTML . Cari code ni ; .content-outer { jumpa code tu , paste kan code bawah ni dekat bawah code yang korang cari tadi .

margin-top:110px;

3. Save and Siap .

Mana mana code yang apis bold-kan tu , korang boleh adjust sendiri mengikut kesesuaian korang punya blog . Take it with a proper credit . Tak paham tanya . Menjadi pon bagitau . Kbai.


adios.

Tutorial : Change Album Cover in Media Player (Windows 7)

Sabtu, Februari 01, 2014

Assalamualaikum & Salam Sejahtera

Hari ni bukan nak bagi tutorial untuk blog . Tapi tutor macam mana nak letak album cover dekat media player masa korang tengah play lagu kesukaan korang . Untuk media player windows 7 sahaja kot . Sebab tak pernah try lagi dekat mana mana windows lain . Macam mana album cover tu ? Meh nak tunjuk before and after .


        


Okay . Yang kiri before . and kanan for sure after kan . Kan nampak macam menarik sikit lah kalau ada album cover . Okay macam mana nak buat ? Jom mula .

1. Cari album cover yang korang nak dekat google . Make sure nisbah album cover tersebut 1:1 kalau tidak jadi penyek , sempit and etc . Aku suggest cari yang 500 X 500 and above . Kemudian save .


2. Pergi dekat gambar album cover yang korang save tadi , and right click > copy




3. Buka media player korang . Kemudian pergi dekat album . Scroll cari mana lagu yang korang nak pastekan album cover nya tu . Dah jumpa ? Right click dekat album tersebut , kemudian paste album art .



4. Siap


Mudahkan ? Actually ramai dah yang dah tau macam mana nak buat benda ni . Tapi saja update jugak sebab takde modal nak update blog . Sila lah cuba . Kalau jadi sila bagitau and kalau tak jadi pon bagitahu lah , aku boleh tolong bagi sampai jadi . Inshaallah . Kbai .


adios.
© 2017 HAFIZ ZULKAFLY ALL RIGHTS RESERVED