Hướng dẫn tạo trang Drive Google to Direclink cho Xenforo

longruoi

MasterCorporal
Thành viên BQT
Tham gia
19/04/2015
Bài viết
263
Được Like
216
Tình hình là host mình ít dung lượng nên chủ yếu là dùng lưu trữ ngoài để chia sẻ file, mình hay dùng Drive Google để chia sẻ vì dung lượng lưu trữ cũng khá (15GB), mà chia sẻ cái file thì link rất chuối, phải thêm vài bước sau khi click vào link thì người dùng mới tải được. Nên phương án mình chọn là lấy link trực tiếp. Tìm trên mạng thì cí nhiều trang chuyển sang link trực tiếp, tuy nhiên cũng rắc rối....
Phương án nghĩ tới là tự tạo trang chuyển link của riêng mình, và vấn đề gặp phải là chẳng ai chia sẻ code. Tính mình là không ai chia sẻ thì mình nghiên cứu và chia sẻ. :rolleyes:

Sau 1 thời gian nghiên cứu, mình đã được kết quả cũng tạm xem là được. Và tất nhiên là mình chia sẻ liền :cat14

Trước tiên là cái Demo:



24549832282_533214f848_o.jpg


Đầu tiên các bạn cần tạo template d2d (cái này các bạn lấy tên gì cũng được, nhưng phải nhớ để lát nữa đưa vào pages, ở đây mình chọn d2d là viết tắt của drive_link to direct_link chi dễ nhớ).

Nội dung template:

Mã:
<xen:require css="d2d.css" />
<div id="d2d">
<div class="linkinator">
<h1>Công cụ lấy link trực tiếp Google Drive</h1>
<br>
<form>
<input type="text" length="85%" value="Nhập link cần chuyển" class="link"></input>
<button> Chuyển <a class="fa fa-refresh"></a></button>
</form>
<br>
<p class="results"></p>
<h11><br>Chỉ dùng cho file ở chế độ <b>công khai</b>.<br><br> Dán link vào khung bên trên, sau đó nhấn nút chuyển để lấy link download trực tiếp.<br> <br>Chúc các bạn vui vẻ.</h11>
</div>

Tiếp tục tạo template d2d.css với nội dung:

Mã:
@import url(http://fonts.googleapis.com/css?family=Titillium+Web|Abril+Fatface);

.body {
  background-color: #ffffff;
  font-family: 'Roboto', sans-serif;
}

.linkinator {
  width: 85%;
  margin: 0 auto;
}

h1 {
  font-family: 'Roboto', serif;
  font-size: 2.5em;
  color: #12b0b0;
  text-shadow: 0px 1px 1px red;
}

h11 {
  font-size: 1.5em;
  color: #12b0b0;
  text-shadow: 0px 1px 1px white;
}

button:hover {
      box-shadow: 0 4px rgb(94, 53, 87);
      top: 2px;
}

button:active {
      box-shadow: 0 0 rgb(94, 53, 87);
      top: 6px;
}
.results {
  display: none;
  border: 1px solid @primaryMedium;
  background-color: white;
  color: #12b0b0;
  padding: 1em;
  text-align: center;
}

Xong các bước chuẩn bị template.

Kế đến là phần pages hiển thị.

Các bác vào Admin CP > Applications >Node Tree > Create Node > pages
Tại tab đầu Basic Information:

  • URL Portion: D2D
  • Tiêu đề: Direct Links Google Drive
Mấy tùy chọn bên dưới để mặc định, riêng dòng Display in the node list thì tick chọn nếu muốn hiển thị ( mình thì không chọn cho nó đẹp, vì mình để link trên Navibar)

Xong chuyển qua tab Page Options, tại ô template HTML các bạn điền:

HTML:
<xen:include template="d2d" />
<script type="text/javascript" src='http://vtplus.xyz/tools/directlink.js'></script>

Bên dưới Optional Components: có 3 lựa chọn, các bạn muốn hiển thị thêm gì thì tick vào đó.

Xong save lại và hưởng thành quả. Link trang của bạn sẽ là: doman/pages/d2d

P/s: Cơ bản bên trên là hoàn thành rồi. Mình đính kèm file directlink.js cho các bạn, các bạn nên tải về và upload lên host và thay đường dẫn trong thẻ template HTML cho phù hợp, phòng khi mình xóa file trên host các bạn không dùng được nữa.

Chúc các bạn vui vẻ.
 

Hướng dẫn sử dụng

XenForo 1 XenForo 2
Translate by PVS

Dịch vụ XenForo của VNXF

Mr. Tuấn

Mobile/Zalo: 0988 488 096

Telegram: bluekpro

Email: [email protected]

Nhà Tài Trợ

Mút Xốp Không Gian
pallet Thịnh Phát
Top Bottom