2012年9月19日水曜日

Facebookページの追加タブページで縦スクロールできなくなったら

2012年9月18日(火)。
3連休明け初日。事前に外出デーと決めており、なんとか3件のミーティングをこなした。
外出の合間と帰宅後の時間を使って、運営を手伝っているFacebookページのコンテンツの更新をした。
更新は、5分で終了する予定だったが、思わぬトラブルで半日無駄にした。記録のためと、同様のトラブルに合う方のために、簡単に記録しておく。

Facebookページ更新の背景情報を少しだけお知らせすると…
ボクは、個人として、会社として、クリエイターや組織をサポートする活動をしている。
そうした活動のひとつとして、「広報ウーマンネット写真部」の運営を手伝っている。
カメラマンの杉浦さんと広報ウーマンネットの主宰者、伊藤さんを応援しつつ、活動を続けることでボク自身もメリットが生まれている。

Facebookページ「広報ウーマンネット 写真部」

第5回写真部のイベント企画を推進していて、この3連休に、会場・日程・内容がほぼ確定した。連休明けの今朝は、あとボクがFacebookページに第5回写真部の告知ページ(部活内容と申込みページ一体となったページ)をテキストを流し込んで、公開するだけだった。

5分で終了する予定の作業というのは、第4回写真部の告知ページのテキストを第5回写真部のものに差し替えるだけ。外出前に片付けられるはずだった。
それが、今朝、テキストの差し替えを終えて、ブラウザで変更後のページを表示すると


こんな感じ。

これだけ見てもよく分からないだろうが、画面下のほうが表示されていない。
本来、このページは、前半(上半分)が「第5回写真部 開催概要」のブロックで、後半(下半分)が「申込みフォーム」になっているはずなのに、前半部分しか表示されていない。
以前に制作した第4回までの告知ページでは、画面スクロールを必要とする縦長のページには、ブラウザにスクロールバーが現れて、下のほうも読むことができた。それが、今朝の段階では、画面の上下スクロールが効かずに、ページの上部しか表示されない状態だった。

解決方法を探って、ググっても、なかなか思うようなページがヒットしなかった。
最終的に参考になったのは、下記のような「縦スクロールバーを(消したいのに)消せない」という、直面していたのとは真逆(ボクは、むしろ縦長のページを読むためにスクロールバーを表示させたかった)の解説ブログだった。

【参考】 Facebookページの縦のスクロールバーを消すコードが変わってた

FB.Canvas.setSize() というタグを FB.Canvas.setAutoGrow() に入れ替えてみたら、アッサリ解決した。要するに、Facebookアプリで利用するタグ(関数のコード)が変わった、ということらしい。

これで無事解決。更新したページで画面スクロールをすると、ちゃんと、下のほうに申込みフォームが表示された。



Facebookページを運営したりする人以外は、同様のトラブルに合った人以外は、まったく役に立たない、記事でごめんなさい。自分自身の記録のためもあってポストしておく。