ホームページ リニューアルっ☆

延び延びになっていた、ジュビカンテ アンサンブルのホームページリニューアル。
やっとこモバイル対応にしました。

screenshotスマホで見るメンバーが多いのと、自分もタブレットで見たいので、レスポンシブデザインで作り直すことにしました。

FC2でもjQueryが使えるなんて、いつの間にやら進化してるのね~。
Yahooショッピングも進化してほしいなぁ…。

ほとんどのページが内容は同じ。変更点は以下の通り。


◆jQueryでデータを取得して表示

今後の練習予定のところは、Googleカレンダーから予定のデータを取得して、練習日程を抜き出して表示させるように変更。
これまでは、Googleカレンダーを貼り付けるだけだったけど、スマホで見るとなると操作がしにくいかもしれないので、登録済みの日程と場所だけを表示させるようにしました。

日時だけでなく、曜日もカッコ付きで表示させたかったので、別の質問ページも参考に制作。
表示させたい箇所には、
<div id=”view”></div>
と入れるだけで表示できた~♪

タブレットでは表確認できたから、スマホでもいけてるかな。

 


◆Google+ バッジの追加

ついでに、トップページのサイドナビに、Google+のバッジを追加。
widthを可変にしたかったけど、Googleの仕様ではできないみたい…残念。

Google+自体も、ページも更新しなくてわ。

 


◆参考サイト

レスポンシブデザインの基本テンプレート

jQueryでGoogleカレンダーの予定を取得して自分のサイトに表示する

コメントを残す

以下に詳細を記入するか、アイコンをクリックしてログインしてください。

WordPress.com ロゴ

WordPress.com アカウントを使ってコメントしています。 ログアウト /  変更 )

Google フォト

Google アカウントを使ってコメントしています。 ログアウト /  変更 )

Twitter 画像

Twitter アカウントを使ってコメントしています。 ログアウト /  変更 )

Facebook の写真

Facebook アカウントを使ってコメントしています。 ログアウト /  変更 )

%s と連携中