Jimdoで独自デザインのサイトを構築した時の注意点覚え

ASP型のWebサイト構築サービス、Jimdoで独自デザインのサイトを構築することがあったので、注意点などをまとめておきます。

Pro版です。Free版でできない機能があったらごめんなさい。
構築時点では公式ガイドに記載がなかったので自分で試行錯誤しましたが、Jimdo自体が発展途上のサービスのため今後変更される場合があります。Jimdo公式ガイドの情報を優先してください。

1.画像について

サイトパーツの画像

  1. 独自デザイン設定部分からアップロードした場合、ファイル名の _(アンダースコア)は -(ハイフン)にリネームされる。
  2. 独自レイアウト用にUPした画像ファイルをCSSから読み出す時、パスは同一階層になる
    つまり url(../images/body_bg.jpg) → url(body-bg.jpg) になる。
  3. 独自レイアウト用にUPした画像をコンテンツ内の「文章」ブロックのHTMLエディタから直接記述して読みだす場合は、パラメータ付きのURLを使わないとうまく表示されないっぽい。
    自分はアップロード画像のリストの画面からFirebugで調べてコピペした

ただしパラメータが変更されて将来的にリンク切れになる可能性もあるかもしれない。あくまでも未検証

まず静的HTML+CSSである程度作ってからJimdoに組み込む場合は、これらを考慮しておかないと手間が増える。
(特に自分は画像ファイル名にアンダースコアを使うのに慣れているのでついつい。。。)

↑この方法だと、約10か月後に一部セッションパラメータの期限切れが発生。やめたほうがいい。(2012.10.19追記)
おすすめの方法は、メインサイトの置いてある外部サーバなどにパーツ用ディレクトリを作って、そこから呼び出した方がいい。外部サーバを持ってなければ、flickrとか。。。?

2.CSSについて

  1. 外部CSSは1枚にまとめる必要がある
    (headをいじって別の場所のファイルを読み込む事も出来るかもしれないが面倒なのでやらない)
  2. 自分で書いたCSSは、Jimdoデフォルトの/app/cdn/min/group/web.css?******* で上書きされる。
    これがけっこうやっかい。
    たとえば。。。

    • img要素にdisplay: block;の指定がかかる  背景画像以外でimgを使いたい時もあって困ったので →p img {display: inline !important;} で強制的にもとに戻す。
      またはHTML編集で<img (略) style=”display: inline;” /> で乗り切る
    • Jimdo管理画面の「スタイル」で指定されたフォント指定が優先されるため、自分で書いたCSSのfont-family指定はだいたい効かない。
      Verdana, Geneva, Arial, Helvetica, sans-serif といった指定になる。
      これによってWin環境(特にIE)の場合に半角英数に欧文フォントが優先適用される→クライアントより「数字や記号の文字が小さい」という指摘→MS Pゴシックとメイリオが優先適用されるよう、自作CSSを調整した

雑感

Jimdoは非常に癖があるうえにASPって理由で避ける人もいるかと思うのですが、更新とローンチまでの速さを考えたらメリットはけっこうあります。
今回は既にメインサイト以下複数サイトを持っているお客様ということもあり、手軽さを優先した結果Jimdoが選ばれました。
(これが1つ目のサイトってことになるとまた選択は変わってきたんだろうと思います)

今回のお客さんがかなりデザインにこだわる方だったので、仕様的に実現できない部分などがいくつもあって少し我慢していただいた部分もあるのですが。。。
今後の要望として、もう少し各コンテンツにclassやidを自由に付けられるようになったら、制作者としては嬉しいんですけどね。
(まぁでも、多くのJimdoターゲット層にはそこまで要らないのでしょうが)

コメントをどうぞ

メールアドレス (必須・公開されません)
コメント本文

  • スパム・迷惑コメント投稿防止のため、メールアドレスの入力が必須ですが、公開はされません。何卒ご協力のほどお願いいたします。
  • 投稿いただいたコメントは管理者のチェック後掲載しておりますので、即時には反映されません。
  • 記載内容に関する批判や間違いの指摘などはそのまま掲載する方針ですが、投稿内容と無関係な誹謗中傷、一方的な罵詈雑言の場合は削除させていただく可能性があります。
  • 通常業務の合間にコメントチェックをしておりますので、すべてのコメントへのお返事が出来ない場合もございます。あらかじめご了承ください。
  • 管理人個人への連絡等は、コメント欄ではなくコンタクトフォームをご利用ください。

書籍を執筆しました

WordPress 標準デザイン講座【Version 4.x対応】


翔泳社さんより、2015/02/27発売しました。2年経ちますのでもう賞味期限切れだとは思いますが、一応実績として...

寄付歓迎(・ω<)☆

当ブログの記事があなたの役に立ったら、気が向いたらでいいのでドネーションいただけると更新の励みになります!
気が向いた方はこちらから

ブログ内検索