1.スキン編集で画像を変更する

2012-02-03T11:12:00+09:00

とりあえず、ヘッダ画像の変更をしてみましょう。

ヘッダ画像やメニューバーや、タイトルバーなどの変更は、
管理画面の[blue][スキン編集][/blue]をクリックして、出てきた画面の下側で変更できます。

同じ大きさのJPG画像を用意し、同じファイル名で登録すると上書き保存されます。
　 [JPG画像]

2.スキン編集画面でソースコードを変更する

2012-02-03T10:55:00+09:00

続いて、管理画面の[blue][スキン編集][/blue]をクリックし、変更したいスキンファイルを選択します。

ここでは、サイト名となるタグや、<h1>タグなどを変更してください。<br><br>おもに変更するファイルは以下の通りです。<br><br>[red][トップ階層] /index.shtml[/red] (PC用トップページ)<br>[red][スキン階層] /skin/skin.html[/red] (PC用スキンHTMLファイル)<br>[red][/mobi/階層] /mobi/mobi.html[/red] (携帯用トップページ)<br>[red][スキン階層] /skin/mobi.html[/red] (携帯用スキンHTMLファイル)<br>[red][/mobi/階層] /mobi/smobi.html[/red] (スマホ用トップページ)<br>[red][スキン階層] /skin/smobi.html[/red] (スマホ用スキンHTMLファイル)<br> <br>初めてみるHTMLソースコードは難しいかもしれませんが、ソースコードの中にある[green]『携帯・スマホ対応の国産CMS 「AD-EDIT3」』[/green]の部分を[green]『○○のサイト』[/green]など自分のサイト名に書き換えてください。<br><br>あと、ページフッタ部分の<br>[green]Copyright ©2008-2011 NorenzPRO Ltd. All Rights Reserved.[/green]<br>の部分も<br>[green]Copyright ©2012 ○○○○○○ All Rights Reserved.[/green]<br>のように書き換えて保存しましょう。<br>　 <a href="http://www.adedit.net/design/file/00400.jpg">[JPG画像]</a> </article> <article> <h1>3. HTMLファイルを作って、独自スキンをアップするには</h1> <p>2012-02-03T10:30:00+09:00</p> ページレイアウトを変更するには下記を変更し、FTPでアップロードします。<br><br>・トップページ（管理画面のヘルプ参考）<br>　/index.shtml<br>・スキンHTMLファイル（トップ以外の全ページ共通）<br>　/skin/skin.html<br>・スキンCSSファイル（全ページ共通）<br>　/skin/style.css<br><br>※携帯サイトのスキンファイルは、<br>管理画面の[blue][モバイル設定][/blue]で行ってください。<br> </article> <article> <h1>SSI技術を利用したトップページのイメージ図</h1> <p>2012-02-03T10:13:00+09:00</p> AD-EDITでは、トップページにおいては、[red]ServerSideInclude (SSI)[/red]の技術手法を利用しています。<br>SSIを利用するためには、ファイルの拡張子が、[red]*.html[/red]ではなく、[red]*.shtml[/red]であることが必要です。<br>トップページのデザインを行うには、[red]「SSIとはどんなものか」[/red]ということをきちんと理解する必要があります。<br> <a href="http://www.adedit.net/design/file/00250.gif">[GIF画像]</a> </article> <article> <h1>スキンHTMLファイルを使用したコンテンツページのイメージ図</h1> <p>2012-02-03T10:15:00+09:00</p> D-EDITでは、トップページ以外のコンテンツページはCGIにて出力されます。<br>CGIからブラウザへ出力される際に、[red]スキンHTMLファイル[/red]を読み込んでから、ページを完成させ、ブラウザへ出力します。 <a href="http://www.adedit.net/design/file/00200.gif">[GIF画像]</a> </article> <article> <h1>4. トップページを２カラム→３カラムへするには</h1> <p>2012-02-03T10:06:00+09:00</p> トップページを２カラム→３カラムへするには、 index.shtmlのソースコードを下記のように変更してみてください<br><br><div class="MainContent"><br>　<br></div><br><br>↓　↓　↓<br><br><div class=MainContent"><br>　<div class="CenterBox"><br>　<br>　</div><br>　<div class=RightBox><br>　右カラム<br>　</div><br></div><br> </article> <article> <h1>5. スキンファイルをダウンロードして利用する</h1> <p>2012-01-19T10:36:00+09:00</p> まだまだ公開したてなのでスキンファイルが少ないですが、<br>４色程度公開してますので下記よりダウンロードしてご利用ください。<br><br><a href="../skinset/">スキンファイルをダウンロード</a><br><br>そのうち何種類か公開しますので、それまでお待ちください。<br>m(_ _)m </article> <article> <h1>6. スキンファイルは複数設置可能</h1> <p>2012-01-19T10:36:00+09:00</p> スキンファイルは複数使えます。<br>ですからコンテンツカテゴリ毎に色分けされたスキンファイルを用意して、<br>各コンテンツに異なるスキンを割り当てていくことも可能です。<br><br>もちろん、SEO対策でページタイトルを分けるなどといった作業も<br>スキンファイルを複数設けることで設定が可能になります。 </article> </main></body></html>

デザイン変更方法

1.スキン編集で画像を変更する

2.スキン編集画面でソースコードを変更する