[メモ]Concrete5のマルチアップロードでError: 401

どないなっとんねん!怒るでしかし!!

という冗談はさておき、Concrete5のファイルマネージャーは非常に便利です。
強力なファイルの検索はもちろんの事、複数のファイルをセットにまとめて、スライドショーで利用したり、一度に複数のファイルをアップロードしたり…etc

で。

特定の条件でマルチアップロードが動かなくなります。

こんなふうに。

理由としては下記の様にいくつか考えられますが、どれも該当しなかったので。

  • /filesとそれ以下のすべてのディレクトリの権限が755になってない
  • /filesとそれ以下のすべてのディレクトリの所有者がapache以外になってる
  • ファイルサイズがphp.iniに書かれているサイズよりも大きい

じゃー、なんなのさって話で。

リリース前の段階って事で、普段納品前は、サイトの閲覧権限を「管理者」のみに設定してクライアントに確認してもらってるんだけど、諸事情で基本認証かけたんですよ。

そう!
聡明な皆様ならもう、お気づきですね!「この先は、言わなくてもわかりますよね?」とは言いませんが。

基本認証がどうやら邪魔しているらしく。
つまり、concrete5ではベーシック認証なんかかけなくても、管理画面から簡単に公開非公開選べるんだから、それでやれ、という事だと受け取っておきます。

[Concrete5]メールフォーム送信時にページの先頭に移動してしまう問題

前回の記事同様、Concrete5についているフォームブロックには結構不満があってですね。

送信ボタン押した時に、ページの先頭に行っちゃうんですよ。

例えば「お問い合わせ」っていうお問い合わせ専門のページを作って、コンテンツ部分はフォームのみしか存在しないっていう場合は、ページの先頭に戻ってもウインドウ上にはフォームのエリアが見えているから、エラーがあった場合や、確認画面、完了画面も見えるから言う程問題じゃないんですが、
縦1000pxくらいの紹介コンテンツがあって、「申し込みは以下のフォームから」みたいなフォームを含むページの場合、送信ボタンをクリックした後にページの先頭に戻ってしまうと「あれ?これ送信できたのかな?」って思って改めてそこまでスクロールして見てもらわなきゃいけないという、ユーザに負担をかけるユーザビリティ的に非常に粗悪なものになってしまう訳です。

で、どうしたもんかなーと考えたあげく、フォームブロックのカスタムテンプレートではどうにもなりませんでした。
というのも、submitボタンクリックした時点で、フォームのID取得のためにURL内に「#」が使われてて、フォーム部分へスクロールするためのhtml側の「#」が重複して使用出来ないっていうのがあって、もう私諦めようと思いました。
お客さんには説明して、「フォームだけは別ページにしてもらえませんか」って懇願して、許してもらおうと思ったんですが、
今をときめくjavascriptちゃんなら!javascriptちゃんならきっとなんとかしてくれるッ!と思い、試してみました。

[javascript]
$(function(){
var getURL = location.href; //URLを取得
var contactScroll = $(‘#contact’).offset().top; //#contactの位置を取得
if ( getURL.indexOf( "submit_form#" ) != -1 ) { //indexOfでURL内に含まれる文字列"submit_form#"を検索して、存在した場合の処理
window.scrollBy(0, contactScroll); //ウインドウを#contactの位置までスクロール
}
});
[/javascript]

前述の様に、フォームブロックでフォームIDを取得してURLに#が使われてるなら、URLに入ってるフォームIDを逆手にとってやろうと。

↓フォームの送信ボタンをクリックしたら、URLにクッソ長いパラメータが付くのですが、共通して「cID」とか「stackID」とかが存在します。
https://www.xxxxxx.xcom/index.php?cID=1&stackID=169&bID=69&btask=passthru_stack&ccm_token=1363257182:45a7934ae05865ab764c648a45552a6b&method=submit_form#1363252323&listbeginp=

フォームのブロックに必ずつくのは「submit_form#」なので、javascriptでURL内を検索して「submit_form#」があったら「#contact」の場所までウインドウをスクロールしてやれば良いと気づいたんです!

あぁ、解決できてホント良かった!!

[concrete5]拡張フォームブロックでエラーがでる。

送信ボタンを押すとページの先頭へ行っちゃったり、確認画面→完了画面がなかったり、concrete5のフォームだけはどうにもイマイチ感が拭えない。
他の機能が優秀すぎるだけに、それだけがとても残念です。

で、上記の問題があるから、tomoacさんの拡張フォームブロックを使わせていただいてるんですが、ブロックを追加してから改めて編集しようとすると必ず編集タブとプレビューでエラーがでる…。

「write のパーミッションキーの取得に失敗しました。」
どこのパーミッションが書き込み禁止になってるかが全くわからぬ。
/packeges/form_tomoac/は全て777になってるし、つーかそもそも/packeges/form_tomoac/のパーミッションはこのエラーが出る様な問題ではない気がするし。

いったいなんなんでしょうね。

[CSSクイズ]構造を変えずにCSSだけでボックスの上下の順番を入れ替えられるのかッ!?

[html]<div id="content">
<div id="firstBox">
<p>テキストテキストテキストテキスト</p>
</div>
<div id="secondBox">
<p>テキストテキストテキストテキスト</p>
</div>
<div id="thirdBox">
<p>テキストテキストテキストテキスト</p>
</div>
</div>
[/html]

例えば上記のHTMLがあったとして。
下記の図のように、#secondBoxと#thirdBoxの位置を入れ替えたいんですよ。

で、条件としては以下。

  • 各div内のテキスト量は不定。つまり高さは可変
  • HTML構造を変えてはダメ
  • CSSはいくらでもいじっても良し

なんだかんだでね、これ結構難しい問題だと思うんですよ。
解決策がない。
CSSクイズとか表題にしてるくせにさ、答えがないんですよ。

position: absolute使うにしても、ボックスの高さが不定だからtopもしくはbottomの値が定まらないし、同様にネガティブマージン使うにしても値が決まらない。
もう#thirdBoxにheight決め打ちしちゃってoverflow: hiddenかscrollでって事も考えた。

なんかどれもこれもスマートじゃない。スマートフォン向けに作ってるのに、全然スマートじゃない!!
あ、このフレーズいいな。今度から打ち合わせとかで使おう。「それ全然スマートじゃないですよね?スマートフォン向けなのに、全然スマートじゃないですよね?」って。

閑話休題。
で、結論としては、もうCSSだけじゃ解決できないよ私。
助けてjavascript〜!

こうすることにした。※cssの部分は結構省略して書いてます。

CSS

[css]
div#content {
position: relative;
}
div#content div#secondBox {
position: absolute;
}
div#content div#thirdBox {
position: relative;
}
[/css]

javascript

[javascript]
var fitstHeight =$(‘#firstBox’).height(); //高さを取得
var secondHeight =$(‘#secondBox’).height(); //高さを取得
var thirdHeight =$(‘#thirdBox’).height(); //高さを取得

$(‘#content’).css(‘height’, fitstHeight + secondHeight + thirdHeight); //#contentに中身のボックスの高さを合計した値を与える。
$(‘#secondBox).css(‘top’, fitstHeight + thirdHeight); //#secondBoxのtopからの位置を#firstBoxと#thirdBoxの合計した値を与える。
[/javascript]

でも、結局javascriptで解決するのも、なんだかちっともスマートじゃないですね。
この部分の解決策は多分、html原理主義者か、js信徒か、css教徒の三つどもえの論争が終わらないんじゃないかなぁと思います。

「君のやり方は間違っている!俺の解決方法はこれだッ!!」って思う人はご遠慮なさらずコメント欄へどうぞ。

さくらVPSでconcrete5 その1 VPSレンタル

VPSをレンタルする

さくらインターネットのVPSをレンタルします。
https://vps.sakura.ad.jp/

理由は以下の通りです。
[メリット]

  • VPSなのでサーバのほぼ全ての権限が使える
  • 安い
  • なのに何気に高性能!(ここ重要)

[デメリット]

  • 管理は自分でやらなきゃいかん

さくらのVPSにもいろいろプランがありますが、一日のアクセスが10万を超えるような想定がない限り、1Gプランで十分です。
1Gプランなら月980円で使えます。

手順リスト

  1. はじめに
  2. VPSレンタル
  3. ドメイン取得
  4. DNS設定
  5. サーバー設定
    1. ユーザー作成
    2. SSH接続設定
    3. ファイアーウォール設定
    4. apacheのインストール
    5. ホストの設定
    6. PHPのインストール
    7. MySQLのインストール
    8. phpMyAdminのインストール
  6. メールサーバー構築
  7. Concrete5のインストール
  8. Concrete5の組み込み
    1. そもそもConcrete5ってなんだ
    2. Concrete5の中身
    3. テーマファイルの作成
    4. ブロック
    5. カスタムテンプレート
    6. アドオン
    7. Designer Contentとは
    8. ページタイプ
    9. ユーザー
    10. 権限
    11. キャッシュ設定
  9. おしまい