Changes between Version 12 and Version 13 of pne-xhtmlcss/upgrade

Show
Ignore:
Author:
ogawa (IP: 203.143.101.162)
Timestamp:
07/03/08 19:55:29 (9 years ago)
Comment:

#2642:バージョンアップ時の注意点を部分的に修正

Legend:

Unmodified
Added
Removed
Modified
  • pne-xhtmlcss/upgrade

    v12 v13  
    11= XHTML+CSS化 バージョンアップ時の注意 =  
    22 
    3 OpenPNE2.12(以下2.12)はXHTML+CSS化でテンプレートの書き方が大幅に変わっています。 
    4 ここでは、OpenPNE2.10(以下2.10)からの2.12にバージョンアップする際の注意点をご紹介します。 
    5 XHTML+CSS化については[wiki:pne-xhtmlcss XHTML+CSS化プロジェクトWiki]をご覧ください。 
     3OpenPNEのバージョン2.12ではXHTML+CSS化によりPC版のHTML、CSSの内容が一新されました。ここでは、OpenPNEのバージョン2.10から2.12へバージョンアップする際に注意が必要な点をご紹介します。 
     4 
     5XHTML+CSS化については[wiki:pne-xhtmlcss XHTML+CSS化プロジェクトWiki]をご覧ください。 
    66 
    77[[TOC(inline,heading=目次,depth=2)]] 
    88 
    9 == 2.10から2.12にかけての変更点 ==  
     9== OpenPNE2.12での変更点 ==  
    1010 
    11 === PC版のテンプレートが全て書き換えられている ===  
    12 XHTML+CSS化のためPC版の全てのテンプレートファイルを新しく書き直しました。そのため、テンプレートの書き方が2.10までと全く違っています。 
     11=== テンプレートファイルの書き直し === 
     12PC版の全てのテンプレートファイルが一から書き直されています。そのためテンプレートの書き方が2.10までと全く違います。 
    1313 
    14 === 2.10まで使用していたCSSファイルの削除、2.12用CSSファイルの追加 === 
    15 2.10まで使用していたCSSファイルを削除して新しいCSSファイルを作成しました。2.10までのテンプレートをそのまま使用すると、CSSファイルが存在しないために表示やレイアウトが崩れてしまいます。 
     14=== CSSファイルの書き直し === 
     152.10までのバージョンで使用されていたCSSファイルが削除され、2.12用に新しいCSSファイルが追加されています。そのため2.10までのテンプレートをそのまま使用すると、表示やレイアウトが崩れてしまう可能性があります。 
    1616 
    1717 【参考】Ver2.10まで使用されていたCSSファイル:: 
    2020   browser:OpenPNE/branches/stable-2.12.x/public_html/xhtml_style.php 
    2121 
    22 === 配色設定・配色設定の反映部分の変更 === 
    23 2.12で配色設定を用途別に統一したため、配色設定項目が削減されて配色が反映される部分も変更されています。配色設定を変更されている場合、2.10と2.12で見栄えが大きく変わってしまう恐れがあります。 
     22=== 配色設定が反映される部分の変更 === 
     23管理画面から設定できるPC版の配色設定の項目が用途別に統一されたため、一部の配色設定項目では色が反映される部分が変更されています。配色設定を変更されている場合、2.10と2.12で見栄えが大きく変わってしまう可能性があります。 
    2424 
    2525 
    2626== バージョンアップ時に影響する設定項目一覧 == 
    27 管理画面から変更が行える以下の項目はXHTML+CSS化の影響を受けます。バージョンアップ後に必ず確認してください。 
     27管理画面から変更が行える以下の設定項目はXHTML+CSS化の影響を受けます。バージョンアップ後に必ず確認してください。 
    2828 
    2929=== 配色・CSS変更 === 
    3030 カスタムCSS:: 
    31    CSSの変更により各パーツのclass指定が全て変更されたため、2.10までのCSSが反映されない箇所が多くあります。CSSの書き換えが必要です。 
     31   HTMLの構造が一新されているため、2.10までのCSSが反映されない箇所が多くあります。CSSの書き換えが必要です。 
    3232 カラーコードの設定:: 
    33    XHTML+CSS化と同時に配色設定の見直しが入ったため、カラーコードの設定項目が減っています。また、各カラーコードの設定の反映箇所も一部変更されています。詳細は[wiki:pne-xhtmlcss/upgrade#配色設定の変更内容一覧 配色設定の変更内容一覧]をご覧ください。 
     33   XHTML+CSS化と同時に配色設定が見直されたため、カラーコードの設定項目が統一され項目数が減っています。また、各カラーコードの設定の反映箇所も一部変更されています。詳細は[wiki:pne-xhtmlcss/upgrade#配色設定の変更内容一覧 配色設定の変更内容一覧]をご覧ください。 
    3434 プリセットカラー:: 
    35    配色設定の見直しが入ったため、プリセットカラーも全て変更されています。2.10までのプリセットカラーをお使いの方はバックアップをとることをお勧めします。 
     35   配色設定の見直しに伴いプリセットカラーも全て変更されています。2.10までのプリセットカラーをお使いの方はバックアップをとることをお勧めします。 
    3636=== HTML挿入 === 
    3737 全ての設定項目:: 
    38    各パーツのclass指定やテンプレートの書き方がすべて変更されているため、2.10までのHTMLでは表示が崩れてしまう可能性があります。HTMLの書き換えが必要です。 
     38   HTMLの構造、CSSのスタイル指定が一新されているため、2.10までのHTMLでは表示が崩れてしまう可能性があります。HTMLの書き換えが必要です。 
    3939=== テンプレート挿入 === 
    4040 全ての設定項目:: 
    41    テンプレートの書き方がすべて変更されているため、2.10までのテンプレートでは表示が崩れてしまう可能性があります。テンプレートの書き換えが必要です。 
     41   HTMLの構造、CSSのスタイル指定が一新されているため、2.10までのテンプレートでは表示が崩れてしまう可能性があります。テンプレートの書き換えが必要です。 
    4242=== バナー設定 === 
    4343 任意HTMLで表示する:: 
    44    テンプレートの書き方がすべて変更されているため、2.10までのテンプレートでは表示が崩れてしまう可能性があります。[[br]]また、サイドバナーは2.10までデフォルトで中央揃えになっていましたが、2.12では左揃えになっています。2.12の仕様にあわせてレイアウトの調整が必要になる可能性があります。 
     44   HTMLの構造、CSSのスタイル指定が一新されているため、2.10までのHTMLでは表示が崩れてしまう可能性があります。[[br]]また、サイドバナーは2.10までデフォルトで中央揃えになっていましたが、2.12では左揃えになっています。2.12の仕様にあわせてレイアウトの調整が必要になる可能性があります。 
    4545=== お知らせ・規約設定 === 
    4646 【PC版】 h_homeのお知らせ:: 
    47    テンプレートの書き方がすべて変更されているため、HTMLタグを使用している場合は2.10までのHTMLでは表示が崩れてしまう可能性があります。HTMLの書き換えが必要です。 
     47   HTMLの構造、CSSのスタイル指定が一新されているため、2.10までのHTMLでは表示が崩れてしまう可能性があります。HTMLの書き換えが必要です。 
    4848=== フリーページ管理 === 
    4949 対象ブラウザがPC版のフリーページ全て:: 
    50     テンプレートの書き方がすべて変更されているため、2.10までのテンプレートでは表示が崩れてしまう可能性があります。テンプレートの書き換えが必要です。 
     50   HTMLの構造、CSSのスタイル指定が一新されているため、2.10までのテンプレートでは表示が崩れてしまう可能性があります。テンプレートの書き換えが必要です。 
    5151=== スキン画像変更 === 
    5252 カスタマイズ設定:: 
    53    テンプレート内での画像の表示方法が変更されている場所もあります。[[br]]規定のサイズと大きく異なる画像を設定している場合、レイアウト崩れの原因となる可能性もありますのでご注意ください。 
     53   テンプレート内での画像の表示方法が変更されている場所もあります。[[br]]規定のサイズと大きく異なるサイズの画像を設定している場合、レイアウト崩れの原因となる可能性もありますのでご注意ください。 
    5454 
    5555== 配色設定の変更内容一覧 == 
    56 2.10と2.12の配色設定の比較一覧です。 
     562.10と2.12の配色設定の比較です。 
    5757 
    5858 * 「使用方法」はカスタムCSSを用いて2.12で2.10の配色設定を使用する方法です([wiki:pne-xhtmlcss/upgrade/colorcode 2.12からのバージョンで2.10の配色を使用する方法の一覧]) 
    59  * 「-」と表記されている項目はそのバージョンに存在しません 
     59 * 「-」と表記されている項目は2.12には存在しません 
     60 
    6061|| 項目名(2.10) || 項目名(2.12) || 変更内容 || 使用方法 || 
    61 || 見出し・セル罫線 || - || 項目の削除。「1. 線の色 」の設定が使用される。inputタグの線色は配色設定から除外 ||[wiki:pne-xhtmlcss/upgrade/colorcode#c1 詳細] || 
    62 || テーブル外枠 || - || 項目の削除。「1. 線の色 」の設定が使用される ||[wiki:pne-xhtmlcss/upgrade/colorcode#c2 詳細] || 
     62|| 見出し・セル罫線 || - || 項目の削除。「1. 線の色」の設定が使用される。inputタグの線色は配色設定から除外 ||[wiki:pne-xhtmlcss/upgrade/colorcode#c1 詳細] || 
     63|| テーブル外枠 || - || 項目の削除。「1. 線の色」の設定が使用される ||[wiki:pne-xhtmlcss/upgrade/colorcode#c2 詳細] || 
    6364|| メッセージメニュー枠線 || - || 配色設定から除外 ||[wiki:pne-xhtmlcss/upgrade/colorcode#c3 詳細] || 
    6465|| テーブル背景1 || 4. 枠色 || 影響範囲の拡大。詳細→[http://www.openpne.jp/openpne-edit_colo#4 SNS配色設定対応表] || || 
    6667|| セル背景1 || 7. ボックスの背景 || 影響範囲の拡大。詳細→[http://www.openpne.jp/openpne-edit_colo#7 SNS配色設定対応表] || || 
    6768|| セル背景2 || - || 項目の削除。「7. ボックスの背景」の設定が使用される ||[wiki:pne-xhtmlcss/upgrade/colorcode#c7 詳細] || 
    68 || 紹介文下部罫線 || - || 項目の削除。「1. 線の色 」の設定が使用される ||[wiki:pne-xhtmlcss/upgrade/colorcode#c8 詳細] || 
     69|| 紹介文下部罫線 || - || 項目の削除。「1. 線の色」の設定が使用される ||[wiki:pne-xhtmlcss/upgrade/colorcode#c8 詳細] || 
    6970|| テーブル背景2 || - || 項目の削除。「4. 枠色」の設定が使用される ||[wiki:pne-xhtmlcss/upgrade/colorcode#c9 詳細] || 
    7071|| 見出し背景 || 5. 見出し背景 || 変更なし || || 
    71 || 9面パネル罫線 || - || 項目の削除。「1. 線の色 」の設定が使用される ||[wiki:pne-xhtmlcss/upgrade/colorcode#c11 詳細] || 
     72|| 9面パネル罫線 || - || 項目の削除。「1. 線の色」の設定が使用される ||[wiki:pne-xhtmlcss/upgrade/colorcode#c11 詳細] || 
    7273|| テーブル・項目背景1 || - || 項目の削除。「7. ボックスの背景」の設定が使用される ||[wiki:pne-xhtmlcss/upgrade/colorcode#c12 詳細] || 
    7374|| テーブル・項目背景2 || 6. 説明領域背景 || 影響範囲の拡大。詳細→[http://www.openpne.jp/openpne-edit_colo#6 SNS配色設定対応表] || || 
    8990[wiki:pne-xhtmlcss/tips OpenPNE2.12でできる見栄えの変更] 
    9091 
    91 2.12のCSSの構造やカスタマイズ例が紹介されています。2.10で行っていたCSSのカスタマイズを2.12で行う場合はこちらを参考にしてください。 
     922.12のHTMLの構造やカスタマイズ例が紹介されています。2.10で行っていたCSSのカスタマイズを2.12で行う場合はこちらを参考にしてください。 
    9293 
    9394[[WikiInclude(DIRECTORYNAVI)]]