フリーページ機能では、HTMLとCSSを用いて、オリジナルのページを作成することが可能です。

今回は参考として、「リンク集」のページを作ってみようと思います。

コントロールパネルへログインし、【デザイン設定】画面からカスタマイズする【テンプレ−トセット】を選択します。
その中から「フリーページ」のテンプレートを選択します。


変更前のソース
{include file="main_header.part"} {include file="main_menu.part"} {if $page == 1}<br /> {if $login.admin} <table width="100%" cellspacing="0" cellpadding="0" border="0"> <tr> <td id="container"> <h2> このページはサンプルです。 </h2> このページはGrouptubeのフリーページの為のサンプルとなります。 <br> {ldelim}if $page == 1{rdelim}<br> ・・・・<br> ・・・・<br> ・・・・<br> {ldelim}/if{rdelim}<br> {ldelim}if $page == 2{rdelim}<br> ・・・・<br> ・・・・<br> ・・・・<br> {ldelim}/if{rdelim}<br> のように$page == **の数字を変えていくことでページを追加することができます。<br> URLもhttp://***.grouptube.jp/（テンプレートに書いた数字）でアクセスできます。 <br> <br> ページの作成にはHTMLの知識と、Smartyについての簡単な知識が最低限必要となりますが、<br> これを機会に是非カスタマイズにチャレンジしてください！ </td> </tr> </table> {/if} <br /> <br /> {/if} {include file="main_footer.part"}

初期状態では、サンプルのページが入っています。
SNSに管理者ユーザーでログインして、
http://お客様のSNSのURL/1 を確認してみてください。
※サンプルページは管理者ユーザー以外が閲覧できないよう制限がかかっています。


まずはサンプルページの内容を消しましょう。


変更後のソース
{include file="main_header.part"} {include file="main_menu.part"} {if $page == 1}<br /> <table width="100%" cellspacing="0" cellpadding="0" border="0"> <tr> <td id="container"> </td> </tr> </table> {/if} {include file="main_footer.part"}

これで先ほど見たサンプルページはなくなっていることがご確認できましたでしょうか？


続いてページのタイトル部分を付けてみます。

<td id="container">　と　</td>　の間に

と記述してください。

変更後のソース
{include file="main_header.part"} {include file="main_menu.part"} {if $page == 1}<br /> <table width="100%" cellspacing="0" cellpadding="0" border="0"> <tr> <td id="container"> <h2> リンク集 </h2> </td> </tr> </table> {/if} {include file="main_footer.part"}

ページにタイトルがつきました。


次はリンクリストの部分です。
今回は以下のサイトにリンクをします。

・ Grouptube（http://grouptube.jp）
・ 株式会社paperboy&co.　（http://www.paperboy.co.jp）

今回はtableタグとaタグを用いてリンク集をつくってみます。
先ほど挿入したページタイトルのHTMLタグの下に以下のように記述してください。



変更後のソース {include file="main_header.part"} {include file="main_menu.part"} {if $page == 1}<br /> <table width="100%" cellspacing="0" cellpadding="0" border="0"> <tr> <td id="container"> <h2> リンク集 </h2> <table width="100%" cellspacing="0" cellpadding="0" border="0" class="table_list"> <tr> <td><a href="http://grouptube.jp">Grouptube</a></td> <td>SNS構築サービスグループチューブのサイトです</td> </tr> <tr> <td><a href="http://www.paperboy.co.jp">株式会社paperboy&co.</a></td> <td>グループチューブを運営している株式会社paperboy&co.のサイトです</td> </tr> </table> </td> </tr> </table> {/if} {include file="main_footer.part"}

これでリンク集の完成です。


先ほどのサンプルページを残しておく場合や、2ページ以上付けたい場合は

{if $page == "2"} ・・・{/if}
{if $page == "3"} ・・・{/if}
　・
　・
のように追記していきます。
アクセスするURLは

http://（お客様のSNSのURL）/2
http://（お客様のSNSのURL）/3

のように、$page == "**"の**の部分がそのままURLとして反映されます。
なお、**には数字以外記入できませんので、ご注意ください。

カテゴリ：デザインカスタマイズ