DotNetNuke 対応ホスティングサービスに、「at link 専用サーバサービス」を追加
DotNetNuke.jp 掲示板は、すべての DotNetNuke ユーザーのための情報共有の場です。単に質問・回答の場ではありませんし、回答義務もございません。運営メンバーも含め、DotNetNuke を日々学んでいる状況です。質問をする場合は、まずインターネットなどで自分自身でお調べいただき、その情報を共有する事をこころがけてください。
お世話になります。
ここのサイトのトップページの一番上のあたりに、フォントサイズの大きさを変えるボタンが付いているのに気付きました。（ただ、押してみたところでは変化がなかったのですが、スキンのフォントサイトの指定あたりの関係？）
こういう場合、JavaScriptでスタイルシートを差し替えるというようなのが一般的なのかなと思っていたので、DotNetNukeだと同じことをやるのは難しいのでは？と考えていたのですが、どうやっているのでしょうか？
私もこの方法をいろいろ試していたのですが、 「とりあえず動く」レベルのことができたのでご報告します。 方法は大きく分けて下記の2つです。 1.ブックマークレットを使って、テキスト(or画像)にJavaScriptをリンクさせる 2.JavaScriptをスキンに書き込み(orリンク)、CSSを切り替える
1.ブックマークレットを使う リロードすると元に戻ってしまうのが難点ですが、一番手軽です。 HTMLモジュールに －－－－－－－ <a href=" (function(){var e,i;e=document.getElementsByTagName('*');for(i=0;i<e.length;i++){e.item(i).style.fontSize='16px'}})()">【拡大】</a> －－－－－－－ 等と記述するだけで終了です。
2.CSSの切替スクリプトを使う CSSの切替をさせ、それをクッキーに保存させるのには、styleswitcher.js （http://alistapart.com/stories/alternate/）をダウンロードしてきて使っています。 これをヘッダーにリンクさせるか、スクリプトを直接スキン用HTMLのBodyに書き込んで、 切替用のCSS（文字サイズだけを記載したもの）とともに、スキンパッケージとして アップロードします。 次にヘッダーに切替用のCSSを代替スタイルシートとしてリンクさせます。 （私はascxファイルがいじれないので、とりあえずページ設定の ｢ページヘッダータグ｣に書き込んでみました。 －－－－－－－ <link rel="alternate stylesheet" type="text/css" href="/DotNetNuke/Portals/0/Skins/testskin/big.css" title="big"> <link rel="alternate stylesheet" type="text/css" href="/DotNetNuke/Portals/0/Skins/estskin/middle.css" title="middle"> <link rel="alternate stylesheet" type="text/css" href="/DotNetNuke/Portals/0/Skins/estskin/small.css" title="small"> －－－－－－－ 実際にボタン（？）となる部分には、HTMLモジュールに下記のように記述します。 －－－－－－－ <a onclick="setActiveStyleSheet('big'); return false;" href="#">【大】</a> <a onclick="setActiveStyleSheet('middle'); return false;" href="#">【中】</a> <a onclick="setActiveStyleSheet('small'); return false;" href="#">【小】</a> －－－－－－－
これで、とりあえずは動きます。 開発者の方からみると、かなりまどろっこしい方法かもしれませんが･･･。 アクセシビリティーの向上は、今後かなり大きなテーマです。 他に良い方法を見つけられた方は、ぜひ教えていただきたくお願いします。
kyo-koさん、どうもありがとうございました。
実際に試してみてからお礼をしようと思っていたのですが、色々とあって遅くなってしまいました。
で、やってみたところ両方ともうまく動きました。
１については、要はスタイルシートの切り替えによる制御ではなく、Javascriptでページ内の要素をループで回して一律に大きくしてしまうという方法のようですね。細かく制御するには不向きですが、文字の大きさを変える程度であれば個人的にはこれで十分ではないかという気もします。CSSを複数用意したりする必要もないですし、Cookieで全ページ対象にすると意図しないところレイアウトが崩れたりしそうなので、特定のページだけピンポイントにというのもよいかもしれません。
２が一番ポピュラーな方法でしょうか。なくしてしまったようですがこのサイトでやっていたのも恐らく同じタイプのやり方かと思います。
個人的にはフォントサイズの変更なんていうのはブラウザのメニューで変更すればよく、確実に使えるかどうかわからないJavascriptでやるようなものではないと思っているのですが、クライアントからの要望によっては対応しないといけないわけですし、フォントサイズの他にも色を変えたりというのにも使えそうなので、どうやっているのか知りたかったというのがありますので大変勉強になりました。あと、スタイルシートを差し替える場合はCSSレイアウトであれば大きさや色だけでなく、配置なども変更できるということになりますので、他の用途にも使えそうですね。
ところで、２の方法はこのままだと各ページに同じような設定を書いていかないといけませんのでメンテナンスが少し面倒です。そこで、最近憶えたこともあってモジュールにする作業をしているところです。設定パラメータなどはちょっと考えないといけませんが、とりあえず動くというレベルのものはできています。メインとなるコードは私が書いたものではないですし、欲しい人がいれば完成後に公開しようかと思っていますが、使ってみたいという人はいらっしゃいますでしょうか？モジュール作成＆VB初心者ということで質は期待してもらっては困りますが、それでもよければどこか（たぶん私のサイト）で配布したいと思います。