CÁCH CHÈN VIDEO YOUTUBE VÀO SIDEBAR CỦA BLOGGER

CÁCH CHÈN VIDEO YOUTUBE VÀO SIDEBAR CỦA BLOGGER
1. Đăng nhập vào Blog

2. Vào Bố cục (Layout)

3. Chọn Thêm Tiện ích (Add Widget)

4. Tạo 1 tiện ích HTML/Javarscip và chèn đoạn code phía dưới vào

[css]
<div class="widget-content">

<iframe width="336" height="169" src="http://www.youtube.com/embed/gEBJeqvJReg" frameborder="0" allowfullscreen></iframe>
<style>
.label-size{
margin:0 2px 6px 0;
padding: 3px;
text-transform: uppercase;
border: solid 1px #C6C6C6;
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>[/css]

Trong đó các bạn cần lưu ý đoạn mã sau

[css]<iframe width="336" height="169" src="http://www.youtube.com/embed/gEBJeqvJReg" frameborder="0" allowfullscreen></iframe>[/css]

• width=”336″ là chiều rộng của Video
• height=”169″ là chiệu cao của Video
• http://www.youtube.com/embed/gEBJeqvJReg : Link Video youtube dưới dạng mã nhúng

Các bạn chỉnh sửa chiều rộng vào chiều cao của Video sao cho cân đối vào phù hợp với độ rộng của Sidebar

CÁCH LẤY LINK VIDEO YOUTUBE DƯỚI DẠNG MÃ NHÚNG

Để lấy link video Youtube dưới dạng mã nhúng bạn làm như sau

Trong trang xem video, kéo xuống phía dưới và nhấn vào tab chia sẻ

Hướng dẫn chèn kênh youtube của bạn vào phần tiện ích Blogspot

Các bước thực hiện như sau:

B1: Vào phần Bố Cục => Chọn thêm tiện ích => HTML/JavaScript

B2: Cửa sổ cấu hình HTML/JavaScript hiện ra, tại phần tiêu đề bạn để tên "youtube", phần nội dung bạn copy đoạn mã này: 

<iframe src="http://www.youtube.com/embed/?listType=user_uploads&list=KenhYoutubeCuaBan" width="300" height="220"></iframe>

Sau đó lưu lại và xem kết quả nhé

B3: Kết quả

Code chống copy bài viết cho Blogspot

Sau đây là cách thực hiện

Đối với Blog
Các bạn đang nhập blogspot vào code ==> Mẫu(Template) => chỉnh sửa HTML ==> Tìm thẻ đóng </body> rồi copy đoạn code dưới lên trên thẻ đóng </body>

<script type="text/javascript" src="https://sites.google.com/site/bituotblog/disable-copy.js"></script>

<style>

body{

-moz-user-select: none !important;

-webkit-touch-callout: none!important;

-webkit-user-select: none!important;

-khtml-user-select: none!important;

-moz-user-select: none!important;

-ms-user-select: none!important;

user-select: none!important;

}

</style>

Nhấn lưu là ok

Đối với web site thì bạn vào code file index của web bạn rồi chỉnh sửa làm tương tự như blog

Chúc các bạn thành công !


Để lại comment nếu có thắc mắc ..