TableSorterでテーブル内の項目の並べ替え

テーブル内の項目を並び替えるスクリプト"TableSorter"を、このブログ（Blogger）のひとことレビューで使おうと試行錯誤していました。


まず最初に、検索したけど実現するには厳しい思った方法。

１．Googleサイト

Googleサイトを使う方法があるけど、ページの表示が遅くなるとか。

Blogger:外部ファイル置き場をGoogleドライブからGoogleサイトへ変更

Blogger:Googleサイトの利用をやめて表示速度を改善する

この時点で中断。

２．GoogleDrive

GoogleDriveを使う方法もあったけど、GoogleDriveのWebホスティングサービスが８月末に終了するらしい。
詳しくは調べなかったけど、公開が出来なくなるみたい。
数ヶ月後に変えるのも面倒なので、ここで中断。

Google ドライブでウェブページをホストする - ドライブ ヘルプ

作成物を置く場所（全然無いけど）はDropBoxに移行しようかな。


関係ないけど、これに関連してブログの画像を貼り付けるのに使っている、Picasaというサービスも５月に終了するんだと判明。

Picasa Blog: Moving on from Picasa

Google、「Picasa」を「Googleフォト」に統合、5月1日に終了へ - ITmedia ニュース


閲覧はそのまま可能らしいのと、Googleフォトに移行すれば引き続き使えるみたい。これは一安心。

３．DropBox

検索すると、アップロードしたJavascriptをPublicで公開すれば可能らしい。
しかし、Publicに公開するのはお金がかかるようになっているのと、"リンクを共有"という方法では実現可能か不明だったので、とりあえず他の方法を探すことに。

結局のところ

自分の場合はBloggerでjQueryが使えればいいので、こちらのサイトで見つけた方法を使いました。

はてなブログで jQuery プラグインを使うなら jsDelivr から読み込もう - MoonNote

初めて知りましたが、スクリプトを使うのにファイル置き場も必要なく、かなり便利です。

そのjQueryなどを提供しているサイトがこちら

jsDelivr

このjQueryのスクリプトと、他のサイトを参考にして設置しました。
けっこう時間がかかりましたが、「ひとことレビュー」のページに上手く導入できました。


・TableSorterの導入時に、主に参考にさせてもらったサイト

jQueryの読み込み
jQuery入門 - CDNにホストされているjQueryファイルの読み込み - Webkaru

TableSorterの基本的な使い方
Tablesorterで HTMLの表をソート(並び替え)可能にする [ホームページ作成] All About

デフォルトの並べ替え、1列毎に色違いにする、特定の項目を非表示など
table並び替え（ソート）などができるようになるjQuery「tablesorter」 | salmomoのさるもも