TUTORIAL : Youtube Video at Sidebar

بِسْمِ ٱللّٰهِ ٱلرَّحْمٰنِ ٱلرَّحِيمِ
 Assalamualaikum w.b.t

Haii gaisss :) so, harini terajin pulak rasanya nak buat tutorial pasal music video yang ada kat sidebar aku tu alaa yang ada lagu kpop apink tue (sekarang ni dah tukau lagu GFriend). Actually, aku letak lagu tu berserta dengan video dia sebab aku nak men'comel'kan lagi blog aku ni hahaha almaklumlah design baru kan pink gitu~~ baru rasa nak nak comel comel kejap hahaha. So, tutorial ni bagus untuk korang jenis nak men'comel'kan blog engkorang macam aku ni hahahaha. Btw, aku dapat tutorial ni daripada SINI.

1. Log in blogger  >  Dashboard  > Layout > Add Html/Javascript
2. Copy code bawah ni,
<div class="widget-content">
<iframe width="336" height="169" src="URL VIDEO YOUTUBE EMBED" frameborder="0" allowfullscreen></iframe>
<style>
.label-size{
margin:0 2px 6px 0;
padding: 3px;
text-transform: uppercase;
border-radius: 3px;
float:left;
text-decoration:none;
font-size:10px;
color:#666;
}

.label-size:hover {
border:1px solid #6BB5FF;
text-decoration: none;
-moz-transition: all 0.5s ease-out;
-o-transition: all 0.5s ease-out;
-webkit-transition: all 0.5s ease-out;
-ms-transition: all 0.5s ease-out;
transition: all 0.5s ease-out;
-moz-transform: rotate(7deg);
-o-transform: rotate(7deg);
-webkit-transform: rotate(7deg);
-ms-transform: rotate(7deg);
transform: rotate(7deg);
filter: progid:DXImageTransform.Microsoft.Matrix(
                    M11=0.9961946980917455, M12=-0.08715574274765817, M21=0.08715574274765817, M22=0.9961946980917455, sizingMethod='auto expand');
zoom: 1;
}

.label-size a  {
text-transform: uppercase;
float:left;
text-decoration: none;
}
.label-size a:hover  {
text-decoration: none;
}
</style>
</div>
<div class="clear"></div>
<span class="widget-item-control">
<span class="item-control blog-admin">
<a class="quickedit" href="//www.blogger.com/rearrange?blogID=8193278726666811965&amp;widgetType=HTML&amp;widgetId=HTML15&amp;action=editWidget&amp;sectionId=sidebar" onclick="return _WidgetManager._PopupConfig(document.getElementById(&quot;HTML15&quot;));" target="configHTML15" title="Edit">
<img alt="" height="18" src="http://img1.blogblog.com/img/icon18_wrench_allbkg.png" width="18" />
</a>
</span>
</span>
<div class="clear">
</div>

3. Pastekan code diatas kedalam ruangan Html/Javascript tadi. (pastikan di sidebar ye)

BIRU: width dan height boleh ubah (pastikan width untuk video ni korang kecik sikit daripada width sidebar korang ye)
MERAH: Url video youtube embed.

4. Lepas dah tukar semua tu, bolehlah save.

Kalau ada benda nak tanya, boleh komen atau shout je kat tagboard aku :)
Terima kasih kerana membaca entry ini :))
Bye bye ^^

3 comments:

  1. mantap nih, kirakira mempengaruhi SEO gak ya ?

    ReplyDelete
  2. macam menarik je..mesti cuba ni..thanks for sharing..

    ReplyDelete
  3. ooo mcm tu rupanya.. bagus info nie..
    salam perkenalan..

    Jalan2 sini.. Jom baca

    Blog Ahmad hasif> site.

    ReplyDelete

Powered by Blogger.