Book báo PR, quảng cáo sản phẩm giá rẻ
Giới thiệu Site map Chính sách Liên hệ Blog

Cách nhúng video vào blogspot, blogger

Cách nhúng video vào blogspot, blogger

Cập nhật ngày Bởi




Xin chào các bạn, hôm nay mình xin hướng dẫn các bạn cách nhúng video từ nhiều trang web khác nhau như: Dailymotion, Google Drive, Odnoklassniki (ok.ru), Vimeo, Youtube... Ngoài ra các bạn chỉ cần sử dụng một dòng code để đăng bài vào video để hiển thị! Đừng chờ đợi lâu, hãy học cách cài đặt cùng tôi dưới đây.



1. Vào Chủ đề, nhấp vào dấu  và chọn Chỉnh sửa HTML
2. Sao chép đoạn mã sau từ trên </ b: skin>
.embed-container {
  position: relative;
  width: 100%;
  height: 100%;
  padding-top: 56.25%;
  overflow: hidden;
  background: #000000;
  border: 4px solid #8000ff;
  border-radius: 4px;
}
.embed-container iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border: 0;
}
3. Sao chép đoạn mã sau từ phía trên </body>
<script type="text/javascript">
//<![CDATA[
class RSTVideoEmbed {
    constructor(element, options = {}) {
        this.playerElement = document.getElementById(element);
        this.options = {
            autoplay: false,
            ...options
        };
    }
    removeAttributes() {
        const attributes = Array.from(this.playerElement.attributes);
        attributes.forEach(attribute => {
            if (attribute.name !== "id") {
                this.playerElement.removeAttribute(attribute.name);
            }
        });
    }
    init() {
        if (this.playerElement) {
            const videoId = this.playerElement.dataset.id;
            const videoUrl = this.playerElement.dataset.url;
            const provider = this.playerElement.getAttribute("provider");
            const isAutoplay = this.options.autoplay ? "?autoplay=1" : "";
            const getProviders = {
                dailymotion: `https://www.dailymotion.com/embed/video/${videoId}${isAutoplay}`,
                googledrive: `https://drive.google.com/file/d/${videoId}/preview`,
                ok: `https://ok.ru/videoembed/${videoId}${isAutoplay}`,
                vimeo: `https://player.vimeo.com/video/${videoId}${isAutoplay}`,
                youtube: `https://www.youtube.com/embed/${videoId}${isAutoplay}`
            };
            const url = getProviders[provider] || `${videoUrl || "about:blank"}`;
            let okReferrer = '';
            if (window.location.href.includes(".blogspot.com") && provider === "ok") {
                okReferrer = ` referrerpolicy="no-referrer"`;
            }
            this.playerElement.innerHTML = `<div class="embed-container"><iframe src="${url}" width="100%" height="100%" allow="autoplay; fullscreen"${okReferrer} loading="lazy"></iframe></div>`;
            this.removeAttributes();
        }
    }
    static render(element, options) {
        return new RSTVideoEmbed(element, options).init();
    }
}
RSTVideoEmbed.render("embed-player", {
    autoplay: true
});
//]]>
</script>
4. Nhấp vào biểu tượng Lưu và rời khỏi tab Chỉnh sửa HTML
5. Chọn bất kỳ mã nào sau đây vào Bài đăng trên Blog (Chế độ xem HTML).
<div id="embed-player" data-id="x8fk3rq" provider="dailymotion"></div>

<div id="embed-player" data-id="0Bwh7cTp2lB3PRmgtODRWOENEb28" provider="googledrive"></div>

<div id="embed-player" data-id="4782018661043" provider="ok"></div>

<div id="embed-player" data-id="208621116" provider="vimeo"></div>

<div id="embed-player" data-id="nAvDh3to9oY" provider="youtube"></div>

<div id="embed-player" data-url="https://rumble.com/embed/v3ccruu"></div>

Cảm ơn bạn, hẹn gặp lại sau.


Liên quan