[TinHoc-Web] @Blogspot05 - Chèn hình ảnh, video lên khung bình luận

CÁCH 1: Dán (Paste) link trực tiếp trong mục bình luận.

1. Đăng nhập vào trang blogger cần chỉnh - Chọn Thiết kế - Vào phần Bố cục (layout)
2. Nhấp "Thêm tiện ích" trong khung sidebar (bên phải hoặc bên trái khung bài đăng) hoặc trong khung footer ở phía dưới giao diện bố cục.
3. Nhấp chọn tiện ích HTML/JavaScript, để trống tiêu đề, chép hết đoạn code bên dưới xong lưu lại
<script type="text/javascript">
const img = /\b(http(?:s)?:\/\/\S+(?:png|jpe?g|gif|bmp|svg|tif)\S*)\b/gi,
ytb = /(http:|https:)?\/\/(www\.)?(youtube.com|youtu.be)\/(watch)?(\?v=)?(\S+)?/gi;
for (var cmts = document.getElementsByClassName("comment-content"), i = 0; i < cmts.length; i++) {
var a = cmts[i].innerHTML;
if (img.test(a))
for (var c = a.match(img), j = 0; j < c.length; j++) a = a.replace(c[j], "<img src='" + c[j] + "'/>");
if (ytb.test(a))
for (var d = a.match(ytb), k = 0; k < d.length; k++) a = a.replace(d[k], "<div class='embed'><iframe width='490' height='276' src='https://www.youtube.com/embed/" + d[k].split("=")[1] + "' frameborder='0' allow='accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture' allowfullscreen=''></iframe></div>");
cmts[i].innerHTML = a
}
</script>
4. Vào lại blog chính để kiểm chứng thành qủa vừa làm xong

CÁCH 2: Dán (Paste) link trực tiếp trong mục bình luận nhưng phải thêm cú pháp ...

1. Cách làm khá đơn giản và nhanh chóng như sau. Các bạn chép hết đoạn code bên dưới rồi chèn trước thẻ đóng </body>
<!-- chen anh video comment -->
<!-- chen anh video comment -->
<b:if cond='data:view.isPost'>
<!-- chỉ áp dụng cho trang bài viết -->
<script type='text/javascript'>
//<![CDATA[
function replaceText(){if(!document.getElementById){return;}
bodyText = document.getElementById("comments");
theText = bodyText.innerHTML;
theText = theText.replace(/\[img\].*?'.*?\[\/img\]/gi, "");
theText = theText.replace(/\[youtube\].*?'.*?\[\/youtube\]/gi, "");
theText = theText.replace(/\[img\]/gi, "<div style='clear:both'></div><img class='bsw-imgs' src='");
theText = theText.replace(/\[\/img\]/gi, "'/><div style='clear:both'></div>");
theText = theText.replace(/\[youtube\]http:\/\/youtu.be/gi, "<iframe width='100%' height='400' src='http://www.youtube.com/embed");
theText = theText.replace(/\[youtube\]http:\/\/www.youtube.com\/watch\?v=/gi, "<iframe width='480' height='390' src='http://www.youtube.com/embed/");
theText = theText.replace(/&amp;feature=/gi, "?rel=0' '");
theText = theText.replace(/\[\/youtube\]/gi, "?rel=0' frameborder='0' allowfullscreen></iframe>");
bodyText.innerHTML = theText;
}replaceText();
//]]>
</script>
</b:if>
2. Lưu lại thế là xong
3. Đến đây mỗi khi muốn chèn hình ảnh vào khung bình luận chỉ việc chép link và đặt như sau
[img]Link-ảnh-chèn[/img]
CÁCH 3: Dùng template premium Gmag làm trang tin tức cá nhân có bình luận

Việc sử dụng mẫu theme này có thể giúp cho trang tin tức của các bạn trở nên phong phú và sinh động, ngoài ra giup nâng tầm blog lên một tầm cao mới


😋 Nhưng ưu điểm vượt trội của template GMag-Thiết kế theo giao diện Responsive hoàn toàn
-Tải trang cực mượt và nhanh
-Tối ưu SEO
-Có thể chuyển sang canh trái tự động
-Những đặc điểm khác các bạn có thể tự khám phá thêm nhé

Trang Demo
https://gmag-templateify.blogspot.com/

Hướng dẫn cài đặt theme
https://docs.templateify.com/2020/02/gmag-magazine-blogger-template.html

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

Nhận xét

Bài đăng phổ biến từ blog này

#Ngẫm-2#

#Ngẫm-1#

[TinHoc-Web] @Livestream01 - Kết hợp nhiều webcam