Dropboxの公開ディレクトリ（Public）から取得するリンクでは外部ファイル化できず…。
先日、このブログで使っているソースコードを見やすくするするためのツールの変更を行うために、外部からの読み込みファイルをDropboxに設置したのですが、上手く読み込むことが出来なかったのでメモしときます。
シンタックスハイライター(Syntax Highlighter)というのを使ってたんですが、この度 Prism.jsに変更しました。
<div class="box">ソースコード書くやつね！</div>それは良しとして、これ使うのにCSSとJSファイルを読み込む必要があるのですが、また新しく無料のサーバーとか申し込むのもなんだかな～と思い、Dropboxの共有ディレクトリにフィルをアップして、公開リンクを取得してheadに設定しました。
しかしながら、一向に反映されず表示できない。
調べてみると、Dropboxから取得したリンクはそのままでは利用ができないらしく、加工の必要があるとか…。
普通にリンク生成させて設定するとこんな感じ。
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="https://www.dropbox.com/s/xxxxx/prism.css?dl=0">
<script src="https://www.dropbox.com/s/xxxxx/prism.js?dl=0" defer></script>
</head>
これだとうまくいかないので、www.dropbox.comとなっている箇所をこちらに変えます。
www.dropbox.com → dl.dropboxusercontent.com
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="https://dl.dropboxusercontent.com/s/xxxxx/prism.css?dl=0">
<script src="https://dl.dropboxusercontent.com/s/xxxxx/prism.js?dl=0" defer></script>
</head>これで正常に外部ファイルとして読み込むことができました。
以前はこんな設定必要なかったような気がするのだけど…。
0 件のコメント:
コメントを投稿