静的サイトジェネレーターとGitリポジトリでブログ
Pagent
なにげなくカレンダーを見ていて、10月が「October」なのにひっかかった。
Octopus(タコ)は足が8本で、万国共通のはず。
高校のとき化学の時間に習ったテトラ(テトラポッドのテトラで4)、ペンタ(ペンタゴンのペンタで5)などの倍数接頭辞でも、オクタ(8)、ノナ(9)、デカ(10)だったはず。
不思議に思い検索してみたら、ローマ暦では1年が3月から始まるので、3月から数えて8番目ということで「October」なのだとか。
10月 - Wikipedia
11月、12月も同様に、3月から9番目で「November」、10番目で「December」。
疑問が解けてすっきりした。
使い勝手はそれ程でもないが、ユーザー情報を記録しないのが魅力的な検索エンジンの一つに「DuckDuckGo」がある。
このDuckDuckGoで自分のブログの記事がインデックスされているか検索したところ、最上部に「WayBack Machine Internet Archive」というのが表示されていた。
サイトを訪れてみると、ウェブアーカイブサービス、いわゆる魚拓サービスらしい。
魚拓サービスには日本では「ウェブ魚拓」、海外では「Archive.is」や「Peeep.us」などがあり、それぞれ便利に利用させてもらっているが、この「Wayback Machine」は非営利団体の「Internet Archive」により運営されているそうだ。
これまで全然知らなかったが、検索したところそれなりに有名なサービスのようで、日本の国立国会図書館のサイトでも紹介されていた。
Internet Archive“Wayback Machine” | 世界のウェブアーカイブ|国立国会図書館インターネット資料収集保存事業
「Wayback Machine」は以前は、クローラが勝手に収集したページを保存するのみで、保存されたページの公開も数カ月待たないといけなかったらしいが、現在ではトップページ右下の「Save Page Now」から任意のページのアーカイブをリクエスト出来るようになっている。
試しに使ってみたところ、公開もすぐにされるようだった。
Internet ArchiveのWayback Machineが大幅にサービスをリニューアル | すちゃらかコーダー
「ウェブ魚拓」や「Archive.is」などと較べて長所があるのかないのか、まだなんとも分からないが、上部の検索バーでSearchも出来るので、他の魚拓サービスで探しているページのアーカイブが見つからなかった時などに利用するのには役立ちそうだ。
Twitterで、フォローしている人のプロフィールページに行くと、これまでの「〜さんにツイートする」の横に「〜さんにダイレクトメッセージを送る」というアイコンが新たに追加されていた。
ダイレクトメッセージ(DM)は使わないし邪魔でしかない。
Twitterはここ最近、要らないことばかりやってくれる。
以前Twitterの文字を強制的に小さくするのに使ったFirefoxのアドオン「Stylish」でダイレクトメッセージのアイコンを非表示にした。
Stylishで「新しいスタイルを書く」をクリック、
@namespace url(http://www.w3.org/1999/xhtml);
@-moz-document domain("twitter.com")
{
.ProfileTweet-text {
font-size: 14px !important;
line-height: 20px !important;
}
.DMButton {
display: none !important;
}
.dm-nav {
display: none !important;
}
}
とし、名前を「ツイッターシンプル」などで保存する。
上の例では.dm-nav
の設定も加え、ツールバーに表示されていた封筒のアイコンと未読DM数の表示も非表示にした。
これで、たとえDMを送られても、気が付くことすら無しに過ごせる。
ーー
(関連記事)
Firefoxのアドオン「Stylish」で快適ウェブ閲覧
ツイッターの外観(文字サイズ)変更とDM非表示
Octopressの記事投稿日が「Sep 4th, 2014」のような英語式の日付け表記になっていたので、日本語式に変更した。
「Octopress」フォルダ内の_config.yml
でdate_format: "ordinal"
となっているところをdate_format: "%Y年%-m月%-d日"
に変更したら、「2014年9月4日」という表記になった。%-m
、%-d
と-
を付けることで、ひと桁の月日の先頭に入っている「0」を抜くことが出来る。
アーカイブページでの表記は相変わらず英語式のままだが、カスタマイズのやり方が分からないので、これは我慢することに。
(参考記事)
Octopress の記事を org-mode で – Quickhack Diary
php: Smartyのdate_formatで前のゼロを表示しない方法 « 仙人の心得
(追記)
Bootstrapのテーマを入れていると上記のやり方で日付け表記を変更できたが、Octopressのデフォルトのテーマでは変更が反映されないようだ。
ブログサービスによっては、そのブログ内でアクセスの多い記事を集計する機能があったりするようだ。
サイトを訪れた人にどのページがよく読まれているかを客観的に示すことが出来て良さそうなのだが、そういう機能の無いブログサービスも多い。
外部サービスではACR WEBというところの「アクセスランキング」が有名みたいだが、FC2でも同様のサービスが提供されている。
FC2ならすでに持っているアカウントで利用出来るので、Seesaaで書いているブログではこれを利用している。
サイドバーにブログパーツを設置することも出来るのだが、あまりサイドバーにごちゃごちゃ配置したくないし、携帯からだと表示出来ないようなので、別途独立した記事を用意してそこへ上位5位までを書き写すことにした。
書き写しは手動でやらないといけないが、それほど頻回に順位が入れ替わるわけではないし、これなら携帯からでも見てもらえる。
FC2の集計結果ページは公開・非公開を選択出来る。
初期状態ではページのランキングがURLで表示されるが、「URL置換設定」で「タイトル置き換えを行う」を選択すると記事タイトルを自動的に取得してくれる。
困ったのは同じタイトルの記事が複数表示されてしまったこと。
これはスマートフォン用のページが別ページとして存在していることや、記事のコメントの部位を指定するURLが別ページと認識されてしまっていることが原因らしい。
上手く統合出来たら良いのだが難しいようなので、スマートフォン用ページとコメント部位指定のURLは「URL除外設定」で除外している。
「FC2アクセスランキング」では他にも「リンク元ランキング」や「移動先ランキング」が利用できて、自分でも見ていてなかなか楽しい。
「リンク元ランキング」ではGoogle検索によるアクセスが、http://
で始まるものとhttps://
で始まるものがそれぞれ2つずつ表示されてしまったので、Googleは除外した。
最近はほとんど見掛けなくなったが、かつては掲示板などにURLを貼るときは、先頭の「h」を抜いてttp://〜
という形で貼るのがマナーだったりした。
「怪しいURLじゃないけど、意図せずうっかり踏まないように」という配慮からかと思っていたが、「ニコニコ大百科」の解説によると、リファーをたどらせないためという目的もあったらしい。
たとえばエロサイトなどの場合、サイト運営者に2ちゃんねるからのリファーが多いと悟られると、閉鎖してしまったり、移転してしまったりということがあったらしい。
h抜きとは (エイチヌキとは) [単語記事] – ニコニコ大百科
ところでこの「ニコニコ大百科」だが、なにげに良い解説が多いのだ。
この「h抜き」の解説でも、「アドレスバーにコピペして移動する時は、hを足すのでなくttp://
を除いた部分だけコピぺすると楽である。」となっているが、確かにどのサイトでも表示されてるアドレスはhttp://
を抜いた部分が表示されているし、これで十分なんだね。
ちなみに、「h」は付いているけどハイパーリンクじゃなく平文の表示のときなんかは、そのURLが一段落で記載されていたら、右でクリックしながら選択したい部分までグイッと伸ばすより、トリプルクリックが楽。
たとえばさっきの「ニコニコ大百科」の解説ページなら、下記をカチカチカチとトリプルクリックしたら選択出来るはず。
http://dic.nicovideo.jp/a/h%E6%8A%9C%E3%81%8D
トリプルではなくダブルクリックなら単語一つを選択出来るようだ。
便利だけど知らないPCの使い方が他にもたくさんあるんだろうね。
閲覧者には少々不便なのかもしれないが、コメント内のURLがハイパーリンクになるのは好みではないので、Seesaaブログの方ではコメント内のURLがハイパーリンクにならないように(クリック出来ないように)していた。
かつては2ちゃんねるでも、URLを貼る時には先頭の「h」を抜いて記載することも普通に行われていたし。
昨日、コメントの表示を降順にカスタマイズしたら(「Seesaaブログのコメント表示を降順に」)、コメント内のURLがまたハイパーリンクになっていた。
カスタマイズで挿入したスクリプトで、コメント内URLが「clickable」に指定されているためらしい。
以前に非ハイパーリンク化した時と同様、昨日記載のコード[2]の
<% comment.body | html | tag_strip | nl2br | clickable('target="_blank" rel="nofollow"') %>
の「html」と「clickable」の部分を削除して
<% comment.body | tag_strip | nl2br %>
にしたらハイパーリンクではなくなった。
念のため元のコードを残しておきたい時は下記のようにしてもよい。
<!--<% comment.body | html | tag_strip | nl2br | clickable('target="_blank" rel="nofollow"') %>--><% comment.body | tag_strip | nl2br %>
ブログで投稿してもらったコメント数が多いと、新しいコメントを見るのにずっと下の方までスクロールしないといけない。
サービスによってはコメントを降順に表示出来るものもあるが、残念ながら現在のところSeesaaブログではこの機能は実装されていない。
なんとかカスタマイズ出来ないかと調べてみたら、下記サイトにコメントを降順に並べる方法が紹介されていた。
JavaScriptを使用するものらしい。
コメントを降順に表示させる--方法2--: ブログカスタマイズ実験室3(わいずふぁくとりい)
「コンテンツPC」の「記事」で記事のHTMLを下記のように編集。
<% content.header -%>
(★★★この箇所に下記コード[1]を挿入★★★)
<!-- Content -->
(中略)
<% if:page_name eq 'article' -%>
<% if:individual_article.accept_comment_show -%>
<div id="comments">
<a name="comment"></a>
<div class="comments-head">この記事へのコメント</div>
(★★★この箇所に下記コード[2]を挿入★★★)
<% loop:list_individual_article_children -%>
<div class="comments-body">
<div class="text"><% comment.body | html | tag_strip | nl2br | clickable('target="_blank" rel="nofollow"') %></div>
<div class="comments-post">Posted by <% if:comment.homepage %><a href="<% comment.homepage | html | tag_strip %>" target="_blank" rel="nofollow"><% comment.writer | html | tag_strip %></a><% else %><% comment.writer | html | tag_strip %><% /if %> at <% comment.createstamp | date_format('%Y年%m月%d日 %H:%M') %><br /></div>
</div>
<% /loop -%>
(★★★この箇所に下記コード[3]を挿入★★★)
<!-- ↓↓コメント入力フォームここから↓↓ -->
<% if:individual_article.accept_comment_catch -%>
<div class="comments-head">コメントを書く</div>
<form action="<% blog.page_url %>pages/user/comments2/regist/input" method="post" name="comment-form">
<div class="comments-body">
お名前: <% if:blog.ignore_setting.fill_writer %>[必須入力]<% /if %><br />
<input type="text" name="article_child__writer" size="50" value="" /><br />
メールアドレス: <% if:blog.ignore_setting.fill_email %>[必須入力]<% /if %><br />
<input type="text" name="article_child__email" size="50" value="" /><br />
ホームページアドレス: <% if:blog.ignore_setting.fill_homepage %>[必須入力]<% /if %><br />
<input type="text" name="article_child__homepage" size="50" value="" /><br />
コメント: <% if:blog.ignore_setting.fill_body %>[必須入力]<% /if %><br />
<textarea name="article_child__body" rows="10" cols="45"></textarea><br />
<input type="hidden" name="article_child__article_id" value="<% individual_article.id %>" />
<input type="hidden" name="article_id" value="<% individual_article.id %>" />
<% if:blog.ignore_setting.captcha_comment -%>
認証コード: [必須入力]<br />
<img src="<% blog.ignore_setting.page_url_captcha_comment -%>" /><br />
<input type="text" name="captcha_comment" size="50" value="" /><br />
※画像の中の文字を半角で入力してください。<br />
<% /if -%>
<% if:individual_article.accept_comment_permission_mode -%>
※ブログオーナーが承認したコメントのみ表示されます。<br />
<% /if -%>
<% if:blog.ignore_setting.banascii_comment -%>
<% /if -%>
<input name="need_confirm" type="submit" class="input-submit" value="確認する" /><input name="posted" type="submit" class="input-submit" value="書き込む" />
</div>
</form>
<% /if -%>
<!-- ↑↑コメント入力フォームここまで↑↑ -->
</div>
<% /if -%>
<% if:individual_article.accept_tb_show -%>
<div id="trackback">
(以下略)
上記HTMLの該当箇所に下記コードを挿入。
コード[1]↓
<script type="text/javascript" language="javascript">
<!--
var lc = 0;
var sarray = new Array();
function setText(s){
sarray[lc] = s;
lc++;
}
function writeText(){
var L = sarray.length;
for(i=0;L-i>0;i++){
document.write(sarray[L-i-1]);
}
}
function initText(){
lc = 0;
sarray = new Array();
}
-->
</script>
コード[2]↓
<script type="text/javascript" language="javascript">
<!--
initText();
<% loop:list_individual_article_children -%>
var s = '<div class="comments-body">';
s += '<div class="text">';
s += '<% comment.body | html | tag_strip | nl2br | clickable('target="_blank" rel="nofollow"') %>';
s += '</div>';
s += '<div class="comments-post">';
s += 'Posted by ';
<% if:comment.homepage %>
s += '<a href="';
s += '<% comment.homepage | html | tag_strip %>"';
s += 'target="_blank" rel="nofollow">';
s += '<% comment.writer | html | tag_strip %></a>';
<% else %>
s += '<% comment.writer | html | tag_strip %>';
<% /if %>
s += ' at ';
s += '<% comment.createstamp | date_format('%Y年%m月%d日 %H:%M') %>';
s += '<br /></div>';
s += '</div>';
setText(s);
<% /loop -%>
writeText();
// -->
</script>
<noscript>
コード[3]↓
</noscript>
このままだとコメントを入力する時にも下の方までスクロールしないといけないので、「コメント入力フォーム」の箇所をコード[2]の2行上<a name="comment"></a>
の直上に移動さた。
このすぐ下に<br />
を2、3個入れて、下に空白を空けた方がしっくり来る。
HTML編集の際、画面が小さいと見づらくてやりにくいので、エキスパートモードでやるか、テキストエディタを使ったほうが良いだろう。
失敗して今までのカスタマイズをおじゃんにしてしまったら辛いので、テキストファイルなどの形でバックアップも取っておいた方が無難だと思う。
なおJavaScriptを使用しているそうなので、閲覧者がNoScriptのようなアドオンを用いていたら表示に不具合があるのかもしれない。
Twitterを見ているとURLの短縮されたリンクをよく見掛ける。
140文字という字数制限のある中で文字数を節約するには便利なので、私もたまにURL短縮サービスを使ったりする。
日本語版のWikipediaのように日本語URLが使われていると、パーセントエンコーディングされていて貼り付けたときURLがとても長かったりするので。
でも短縮URLだとリンク先がなんのサイトなのか分からないので、踏むのをためらってしまう。
短縮URLはリダイレクトを使っているので実際、URLを隠蔽してフィッシング詐欺などを行う例もあるらしい。
私は短縮URLを使うときには、「(Xubuntuをアップグレードしてみた – Static)」などのように、なるべくリンク先の説明を書き添えるようにしているが、そういう人はあまり多数派ではないようだ。
短縮URLを元のURLに戻すサービスがないか調べてみたら、そういうサービスが多数あるようだった。
いくつか試した中で良さそうだったのは、「短縮URLチェッカー」(http://x-1.jp/)と「GetLinkInfo」(http://www.getlinkinfo.com/)だった。
他のサービスでは最終的なリダイレクト先しか教えてくれないところが多かったが、上記のサービスはどちらも、途中何度かリダイレクトされている場合には途中の経路も表示してくれる。
(これまで気が付かなかったが、途中何度かリダイレクトされていることも結構あるのだと初めて知った。)
さらに「短縮URLチェッカー」の方はリンク先ページの内容をプレーンテキストで表示してくれる。
たんびたんび短縮URLを展開しないといけないが、これでかなり安心してリンクをクリック出来そうだ。
サブで使うブラウザとして「rekonq」を使っていたのだが、Xubuntuを12.04から14.04.1にアップグレードしてから、ツイッターのプロフィールページで表示がずれるようになってしまった。スタイルシートがちゃんとあたっていないのだろう。
「Chromium」の方はさらにひどくて、メニューやアドレス欄でも表示が変で使い物にならない状態だったので、アンインストールした。
Ubuntuソフトウェアセンターに「dillo 3.0.3-6」というのがあった。
ずいぶん以前に少しだけ触ってみて、使いこなせなくてやめてしまった覚えがある。
入れてみたが、文字化けの治し方が分からず、やはり断念。
仕方が無いのでサブのブラウザとして、放ってあった「Midori」を使うことにした。
ただ「Midori」はブックマークから開く時シングルクリックでは開かず、ダブルクリックしないといけなかったり、フォントが気に入らなかったりということもあるので、ツイッター以外では「rekonq」も使うことになりそうだ。