Labels

[Blogger] Sử dụng GoogleDrive làm host lưu trữ CSS và JavaScript cho Blogspot


Chào các blogger, ở các bài viết trước tôi đã giới thiệu cho các bạn cách lưu trữ css và js thông qua google site hoặc firebase. Và ở bài viết này sẽ có thêm một lựa chọn nữa cho bạn đó là lưu trữ thông qua GoogleDrive.

Với googledrive khi tạo tài khoản ta được cấp cho 15GB dung lượng lưu trữ miễn phí và con số đó là quá lý tưởng để lưu trữ js và css.

Trước tiên bạn tạo 1 folder trên googledrive và đặt chia sẻ ở chế độ công khai nhé. Làm như hướng dẫn trong ảnh




Tiếp theo bạn có thể upload các file .css hoặc .js của mình vào folder đó
Để lấy link chia sẻ bạn chuột phải vào file và chọn "Nhận liên kết có thể chia sẻ được"
Liên kết sẽ có dạng như sau 
https://drive.google.com/open?id=0B6D-cttKJcP2cW93TEJfQVBxbHM

Phần in đậm là id của file bạn tiến hành thay liên kết thành như sau
https://drive.google.com/uc?export=download&id=0B6D-cttKJcP2cW93TEJfQVBxbHM

Khi đó thì có thể nhúng vào blogger dưới dạng
<script src='https://drive.google.com/uc?export=download&amp;id=0B6D-cttKJcP2cW93TEJfQVBxbHM' type='text/javascript'/>
hoặc với css
<link href='https://drive.google.com/uc?export=download&amp;id=0B6D-cttKJcP2cW93TEJfQVBxbHM' rel='stylesheet'/>

** Khắc phục với google host
Do google host đã ngừng hoạt động nên hiện tại có rất nhiều thủ thuật trên các trang mạng vẫn còn link nhúng dạng 
<script src="https://googledrive.com/host/0B6D-cttKJcP2cW93TEJfQVBxbHMtype='text/javascript'/>
hoặc
<link href='https://googledrive.com/host/0B6D-cttKJcP2cW93TEJfQVBxbHM' rel='stylesheet'/>

Bạn tiến hành thay https://googledrive.com/host/ thành https://drive.google.com/uc?export=download&amp;id= là được, nhưng với điều kiện là file css hoặc js đó phải còn lưu trên drive của người chia sẻ.

Để tải file css hoặc js của người đó về bạn có thể chỉnh liên kết thành 
https://drive.google.com/uc?export=download&id
ví dụ
https://drive.google.com/uc?export=download&0B6D-cttKJcP2cW93TEJfQVBxbHM

Và cuối cùng để tiện cho các bạn đỡ phải mất công ngồi chỉnh liên kết tôi đã soạn 1 đoạn batch nhỏ giúp tạo link nhúng nhanh chóng

File .bat có nội dung như sau


:: Author - Hoang Hung
@echo off
title Export Link Embedded
color 0f
mode con: cols=80 lines=20
 
rem input: https://drive.google.com/open?id=0B6D-cttKJcP2cW93TEJfQVBxbHM
rem output js: <script src='https://drive.google.com/uc?export=download&id=0B6D-cttKJcP2cW93TEJfQVBxbHM' type='text/javascript'/>
rem output css: <link href='https://drive.google.com/uc?export=download&id=0B6D-cttKJcP2cW93TEJfQVBxbHM' rel='stylesheet'/>
 
:main
cls
echo.&echo ------------------------------------------------------------------------------
echo                                  [1] : Javascript
echo                                  [2] : CSS
echo                                  [X] : Exit
echo ------------------------------------------------------------------------------&echo.
choice /c 12X /m "Your Choice: "
if %errorlevel% == 3 goto:eof
if %errorlevel% == 2 goto:css
if %errorlevel% == 1 goto:javascript
 
:javascript
echo.&set /p link=Enter your link: 
for /f "tokens=2 delims==" %%a in ("%link%") do set id=%%a
echo | set /p out="<script src='https://drive.google.com/uc?export=download&id=%id%' type='text/javascript'/>" | clip
call:done
goto:main
 
:css
echo.&set /p link=Enter your link: 
for /f "tokens=2 delims==" %%a in ("%link%") do set id=%%a
echo | set /p out="<link href='https://drive.google.com/uc?export=download&id=%id%' rel='stylesheet'/>" | clip
call:done
goto:main
 
:done
echo.&echo SUCCESSFULLY ! Ctrl + V to paste 
timeout 3 >nul
exit /b

Sau khi lấy được liên kết chia sẻ (https://drive.google.com/open?id=0B6D-cttKJcP2cW93TEJfQVBxbHM) bạn chạy file bat và chọn kiểu nhúng (css, js) sau đó dán link vào và ngay lập tức link nhúng được xuất ra clipboard bạn chỉ cần dán nó vào template của blog thôi :) rất nhanh chóng

Chúc bạn thành công !
Bạn được tự do bày tỏ quan điểm nhưng nghiêm cấm spam
  • Chèn ảnh theo mẫu [img]link[/img]
  • Chèn video Youtube theo mẫu [youtube]link[/youtube]
  • Chèn code theo mẫu [pre]code[/pre]. Lưu ý: mã hóa code trước khi bình luận