Cách thêm file word , PDF , Google Drive Shared Item vào bài viết

Chắc hẳn nhiều bạn đang không biết làm cách nào để hiển thị file word hay PDF trên bài đăng , bài viết này sẽ giới thiệu ngắn gọn phương pháp đơn giản nhất để các bạn thực hiện.

Do Blogger chưa hỗ trợ tính năng thêm file trực tiếp lên bài đăng nên các bạn buộc phải chèn trực tiếp vào trong HTML của bài viết. Để hiển thị bài viết ở chế độ HTML , các bạn vào mục chỉnh sửa ( hình cây viết ) và chọn Chỉnh Sửa HTML , sau đó một đoạn code sẽ hiện lên màn hình tương ứng với bài viết của bạn.


Các vị trí được dấu là những vị trí có thể chèn code

Các bạn tìm vị trí muốn chèn dựa trên các câu văn bạn nhập lên bài viết, mỗi đoạn sẽ được mã hoá thành script bắt đầu bằng <div> và kết thúc bằng </div> ,các bạn chèn đoạn code sau vào ngay phía sau  </div> , file sẽ hiển thị ngay sau đoạn văn kết thúc bằng từ </div> tương ứng:
  <iframe height="500" src="https://YOURURLHERE/preview" width="780"></iframe>
Thay thế YOURURLHERE bằng liên kết đến tệp tin của bạn. Lưu ý với tập tin lưu trong Google Drive, hãy đảm bảo rằng tập tin ấy được chia sẻ ở chế độ công khai.
Các bạn có thể tham khảo ví dụ bên dưới đây:


File này thuộc sở hữu của nhóm nên mình xin ẩn link nhé !

Frame sẽ được đặt ở vị trí tương ứng nơi bạn chèn code trong HTML

Frame hiển thị file sẽ nằm sát bên trái , tương tự việc căn lề trái cho đoạn văn. Để căn giữa cho frame , thay đoạn code trên bằng đoạn code sau :

<div class="iframe-container">

  <!--iframe link is the link to the jsfiddle-->

  <iframe height="500" src="https://YOURURLHERE/preview" width="780"></iframe>

</div>

<style>

  .iframe-container {

  text-align:center;

    width:640;height:250;

  }

</style>

Các thông số height và width có thể thay đổi tuỳ vào kích thước file phù hợp. Hy vọng các bạn thấy bài viết hữu ích và  thực hiện thành công trên blog của mình.
Hẹn gặp các bạn ở các bài viết blog tip kế tiếp của mình nhé. 


Đăng nhận xét

0 Nhận xét