賢 威 の HTML 版 をシリウスのテンプレートにする 方 法 OK 川 上
賢 威 のシリウス 化 の 手 順 賢 威 の HTML 版 をダウンロード ファイルの 解 凍 シリウスの 立 ち 上 げ 新 規 サイトの 作 成 任 意 のテンプレートを 選 ぶ シリウスのサイトデータへファイルをコピー HTML の 編 集 テンプレートのエクスポート テンプレートからサイトを 作 成 してデータをアップロードするとき 個 別 に js images フォルダーをレンタルサーバーにアップロードする 必 要 があります サイトを 作 るときの 注 意 点 シリウスの 全 機 能 は 使 えないので 手 打 ちで 対 応 することがあります イチから HTML を エディターで 作 るよりましですが 最 初 に 無 料 のテキストエディターを 紹 介 します あなたが WEB サイト 編 集 に 対 応 したものがあればそちらをお 使 いください エディターはメモ 帳 でもできますが Terapad が 編 集 しやすくておすすめです 下 記 のサイトから 無 料 で 入 手 ができます http://www.forest.impress.co.jp/library/software/terapad/
賢 威 HTML 版 を 用 意 する 賢 威 をサポートフォーラムからダウンロードします
シリウスを 立 ち 上 げます 新 規 作 成 を 押 して 新 しいサイトを 立 ち 上 げます サイトの 全 体 設 定 を 押 して 任 意 のテンプレートを 選 びます
次 に 賢 威 の JS や CSS Images のフォルダーをシリウスに 登 録 します 保 存 先 はサイトデータの 保 存 場 所 にします 画 像 をクリックします 画 像 フォルダーを 開 くをクリックします 現 在 編 集 しているテンプレートの 画 像 データが 保 管 されているフォルダーが 表 示 され ます
下 のフォルダーから 一 つ 上 のフォルダーに 移 動 します こちらが 一 つ 上 の 階 層 です
賢 威 HTML 版 を 解 凍 したファイルのうち CSS,images,js をシリウスの 画 像 格 納 庫 よりひ とつ 上 の 階 層 にコピーします ここからちょっと 難 しくなります シリウスに 戻 ってサイトオプションの 文 字 コードを UTF-8に 設 定 します
次 に HTML を 編 集 します <!-- 通 常 モードここから --> 下 記 の 部 分 を 差 し 換 えます 上 は 差 し 替 え 前 の 状 態 です
以 下 は 差 し 替 え 前 のコンテンツです <% texttitle1 %> <% textbody1 %> <% texttitle2 %> <% textbody2 %> <% texttitle3 %> <% textbody3 %> <% texttitle4 %> <% textbody4 %> <% texttitle5 %> <% textbody5 %> <% texttitle6 %> <% textbody6 %> <% texttitle7 %> <% textbody7 %> <% texttitle8 %> <% textbody8 %> <% texttitle9 %> <% textbody9 %> <% texttitle10 %> <% textbody10 %> 以 下 差 し 替 えます <% texttitle1 tag_replace(h3,h2) %> <% textbody1 %>
<% texttitle2 tag_replace(h3,h2) %> <% textbody2 %> <% texttitle3 tag_replace(h3,h2) %> <% textbody3 %> <% texttitle4 tag_replace(h3,h2) %> <% textbody4 %> <% texttitle5 tag_replace(h3,h2) %> <% textbody5 %> <% texttitle6 tag_replace(h3,h2) %> <% textbody6 %> <% texttitle7 tag_replace(h3,h2) %> <% textbody7 %> <% texttitle8 tag_replace(h3,h2) %> <% textbody8 %> <% texttitle9 tag_replace(h3,h2) %> <% textbody9 %> <% texttitle10 tag_replace(h3,h2) %> <% textbody10 %> 差 し 替 え 分 はここまで
差 し 換 えたイメージがこれです 今 現 在 トップページを 編 集 していますがカテゴリーとエントリーに 同 じようにコピペ して 保 存 します
賢 威 の HTML を 移 植 する ダウンロードした 賢 威 HTML 版 のインデックスを 立 ち 上 げます 賢 威 のトップページの 部 分 をコピーします <!-- メインコンテンツ--> <main> <div class="main-conts"> ここから 上 全 部 をコピーします グローバルナビを 使 わないときはグローバルナビを 消 します テンプレート 作 成 の 時 は 使 わないという 手 もあります
次 にシリウスの HTML 編 集 画 面 に 戻 ります 37 行 目 の<% if:sitemode(normal) %>から 上 を 消 します
そして 先 ほど 賢 威 でコピーした 部 分 を 貼 り 付 けます こちらは 賢 威 のヘッダー 部 分 を 貼 り 付 けた 直 後 です 次 に</head>の 直 前 に 下 のコードを 入 れます <% pagestyles %> <% headtag %> <% rssfeedlink %> <% googlesitemaptag %> <% mobilelinkdiscovery %> こんな 感 じにしまます <% pagestyles %> <% headtag %> <% rssfeedlink %> <% googlesitemaptag %> <% mobilelinkdiscovery %> </head> このプロセスでシリウスの 重 複 コンテンツ 登 録 などが 反 映 されます
次 にサイドバー 以 下 をコピーします 賢 威 のインデックスページ(トップページ)にある341 行 目 </div>から 下 をコピーし ます </main> </div> <!-- メインコンテンツ--> <このレポートは 賢 威 7をインポートしていますが6の 場 合 はサイト 本 文 の</main>よ り 一 こ 前 の</div> から 下 をコピーしてシリウスに 貼 り 付 けます HTML のタグは 始 まりと 〆 の 組 み 合 わせになっています <div class="example"></div> <div></div> <main> </main> レイアウトが 崩 れる 場 合 は</div>が 多 かったり 少 なかったりするので</main>の 上 に 加 えてみてください > <!-- メインコンテンツ-->の </div>から 下 をコピーして そして 文 字 コンテンツを 入 れ 替 えていきます シリウスのボディーより 下 に 貼 り 付 けます シリウスは120 行 目 の <% texttitle10 tag_replace(h3,h2) %> <% textbody10 %>の 下 に 貼 り 付 けます
こちらが 貼 り 付 けた 後 です
次 にシリウスに 貼 り 付 けたコンテンツをシリウスの 独 自 コマンドに 差 し 換 えたりして テンプレートとして 汎 用 的 に 使 えるように 整 形 します ヘッダー 部 分 賢 威 税 理 士 事 務 所 ( 下 記 に 差 し 替 え) <% pagetitle %> キーワード 1,キーワード 2,キーワード 3 ( 下 記 に 差 し 替 え) <% metakeywords %> 京 都 東 京 の 会 計 事 務 所 賢 威 税 理 士 事 務 所 のホームページです 税 金 に 関 するご 質 問 はお 気 軽 に 何 でもご 相 談 ください ( 下 記 に 差 し 替 え) <% metadescription %> <header id="top" class="site-header"> <div class="site-header-in"> <div class="site-header-conts"> <h1 class="site-title"><a href="./"><img src="images/logo.png" alt=" 賢 威 税 理 士 事 務 所 " width="415" height="40"/></a></h1> </div> </div> 超 重 要 <img src="images/logo.png" alt=" 賢 威 税 理 士 事 務 所 " width="415" height="40"/> logo.png を 差 し 換 えてもいいです その 時 大 事 なことは alt=" 賢 威 税 理 士 事 務 所 " の 賢 威 税 理 士 事 務 所 の 部 分 を<% pagetitle %> に 差 し 換 えることです 差 し 換 えたタグはこちらです <img src="images/logo.png" alt="<% pagetitle %>"width="415" height="40"/> ロゴを 画 像 にするときは 必 ずタイトルを 入 れないと H1 タグ 指 定 がなされません タイトルを 文 字 で 出 すときは 文 字 にするときは <img src="images/logo.png" alt="<% pagetitle %>"width="415" height="40"/> <% pagetitle %>にします
書 き 換 え 前 <h1 class="site-title"><a href="./"><img src="images/logo.png" alt=" 賢 威 税 理 士 事 務 所 " width="415" height="40"/></a></h1> 書 き 換 え 後 <h1 class="site-title"><a href="./"><% pagetitle %></a></h1> ヘッダーの 部 分 はここまで フッターの 部 分 でいじるところは <div class="copyright"> <p><small>copyright 2015 賢 威 税 理 士 事 務 所 All Rights Reserved.</small></p> </div> </footer> <!-- サイトフッター--> 2015 賢 威 税 理 士 事 務 所 を 下 記 に 変 えます <% thisyear %> <a href="<% pagedepth %>"><% sitetitle %> <div class="copyright"> <p><small>copyright <% thisyear %> <a href="<% pagedepth %>"><% sitetitle %>All Rights Reserved.</small></p> </div> </footer> <!-- サイトフッター--> ここではあくまでテンプレートを 作 るのが 目 的 なので サイドバーやフッターはいじりません とりあえず 全 部 消 して オリジナルをとっておいて 必 要 な 時 に 加 筆 するのもアリです 個 別 のサイトを 作 るときに 編 集 します 使 うものそうでないものは 用 途 によって 変 わりますので 各 々 編 集 願 います
カテゴリーページを 作 ります トップページをそのまま 使 うのがおすすめです 賢 威 を 解 凍 したフォルダーの 中 に カテゴリーとエントリーページ サイトマップはメインコンテンツ 以 外 のところにある 画 像 や JAVA のリンクについてソースを 参 照 してオリジナルのテンプレート 作 るのもア リです どちらにするかはお 任 せします 以 下 カテゴリーの 関 連 ページを 表 示 するシリウスの 独 自 コマンドです <% texttitle10 tag_replace(h3,h2) %> <% textbody10 %> の 下 に 入 れたほうがいいですが 本 文 中 で 一 つ 一 つ 手 入 力 もアリです 僕 は 手 入 力 にしています
<!-- メインコンテンツここから --> <div id="contents"<% pagecolumns %>> <div id="main"<% pagecolumns %>> <% pagenavigation %> <% freespace1 %> <% texttitle1 tag_replace(h3,h2) %> <% textbody1 %> <% texttitle10 tag_replace(h3,h2) %> <% textbody10 %> </div> <!-- メインコンテンツここまで -->
出 来 上 がったテンプレートはエクスポート 任 意 のフォルダーを 指 定 して 保 存 します
賢 威 テンプレートのシリウスに 移 植 する 作 成 方 法 は 以 上 になります 次 にテンプレートを 使 用 して 最 初 にサイトをアップロードするときの 注 意 点 です
サイト 作 製 の 注 意 点 最 初 にサイトデータをアップロードするときに JS フォルダーと images フォルダーを 個 別 にレンタルサーバーにアップロードします アップロードするフォルダの 場 所 は シリウスの 画 像 をクリック 画 像 フォルダーを 開 くをクリックします
現 在 編 集 しているテンプレートの 画 像 データが 保 管 されているフォルダーが 表 示 され ます 下 のフォルダーから 一 つ 上 のフォルダーに 移 動 します
こちらが 一 つ 上 の 階 層 です
この images と js のファイルをサイト 生 成 先 のファイルにコピーして シリウスの FTP で 転 送 します 後 はサイト 生 成 して 初 めてファイルを 転 送 するときに 左 側 のオレンジの CSS ファイルは 転 送 しません 注 意 点 は 以 上 になります 今 回 は 賢 威 ですは Infoplate なども 同 じ 要 領 でシリウスのテンプレートにすることが 出 来 ます わからないことがありましたら info@placechange.info までご 連 絡 願 います
シリウス 独 自 コマンド カテゴリーリスト <!-- カテゴリーリストここから --> <% categorylisttitle tag_insert(h3) %> <div class="category-list" id="categorylist"> <% AQEntries %> <div class="category-list body"> <div class="category-list title"><a href="<% permalink %>"><% pagetitle %></a></div> <% pagethumbnail tag_insert(div class="thumbnail") %> <% pagebody tag_strip str_replace(,) oneline shorten(200,true) tag_insert(p) %> <div class="category-list more"><a href="<% permalink %>">» 続 きを 読 む</a></div> </div> <% /AQEntries %></div>