このコーナーでは、テンプレートのカスタマイズについて、実際のサンプルページを元に紹介していきます。

今回は、コピーライト欄を利用して全ページの最下部にページ上部へのリンクを設置する方法をご紹介します。コピーライト欄は、全ページ共通ですので応用すると色々なことに利用できます。

http://cafe0808.ocnk.net/



ページトップ画像を作成する

画像サイズは下記のように作成して下さい。

横幅

自由
※サンプル：100ピクセル

縦幅

自由
※サンプル：20ピクセル

画像の保存形式は、GIF、JPG、PNG形式のいずれかで保存して下さい。


サンプル画像 ※メルマガ掲載のため縮小表示

　
画像ファイルをアップロードする

管理画面→デザイン管理→画像専用管理画面をクリックして下さい。

コンテンツフォルダをクリックし、作成した画像をアップロードして下さい。

赤枠部分が、アップロード箇所、青枠部分にアップロードされた画像が表示されます。

　
キャッチフレーズ欄にアンカーを設置する

キャッチフレーズ欄にアンカーを設置します。
この位置がコピーライト欄からのリンク先となりますので、必ず設定して下さい。
キャッチフレーズ欄に下記のようなhtmlタグを記載して下さい。
※nameの名称はご自身で変更していただいても結構です。

<a name="pagetop"></a>


編集後、「設定処理を完了する」ボタンをクリックして下さい。

　
コピーライト欄にリンクを設置する

コピーライト欄に、ページ上部へのリンクを設置します。
画像を利用いただいても、テキストのみでも結構ですが、必ず<a href="#pagetop">～</a>のアンカータグは設定して下さい。
※下記の例では、画像を利用しております。画像を利用される場合は、必ず画像URLをhttps://のようにhttpに「s」を付けて記載し共用ドメインURLをご利用下さい。

<div style="margin: 5px 0px;"><a href="#pagetop"><img src="https://cafe0808.ocnk.net/data/cafe0808/image/pagetop.gif" width="100" height="20" alt="Page Top" border="0" /></a></div>


編集後、「設定処理を完了する」ボタンをクリックして下さい。

div
について

<div style="margin: 5px 0px;">～</div>
画像の上下に余白を入れるために記載です。
必要なければ削除して下さい。

a
について

<a href="#pagetop">
STEP3にて設定していただいたnameの名称を「#名称」の形で<a>タグのリンク先に設定して下さい。

img
について

画像挿入用の記載です。
テキストをご利用いただく場合は、必要ありません。

画像URLを記載いただく際には、必ずhttps://～のようにhttpに「s」を付けて、共用ドメインURLにて記載して下さい。※独自ドメインの方も共用ドメインで記載下さい。

記載例）
https://cafe0808.ocnk.net/data/cafe0808/image/pagetop.gif


このようにキャッチフレーズ欄やコピーライト欄は全ページ共通ですので、応用することで、各ページ共通で画像やメニュー等を挿入することも可能です。


　
なお、お問い合わせは下記ページからお願い致します。

https://www.ocnk.net/contact/index.php

Copyright (C) 2004-2006 OCHANOKO-NET All Rights Reserved.