ウェブ学のすすめ

Study of Web Design & Programing

Jimdoのデフォルトレイアウトにsmoothscrollを導入する方法

ステップ1:ヘッダー部分を編集

管理画面の「設定」>「ヘッダー部分を編集


ステップ2:smoothScroll.js

smoothScroll.jsをコピーしてscriptタグで囲んで記述欄にペーストし、「保存」をクリック
<script>
コピーしたソースコード
</script>

ステップ3:ウィジェット/html


↓トップに戻る(または中間に戻る)ボタンを置きたい場所に新規追加で「ウィジェット/HTML」を挿入

<a href="#top" style="background-color:#f60;color:#fff;font-weight:bold;text-decoration:none;padding:10px;">トップに戻る</a>

のようなコードを記述し、「保存」をクリック


ステップ4:パンくずリストの設置


↓記事欄の一番上に新規追加で「文章」を挿入

↓HOMEと書いたら文字を選択し、リンクの挿入/編集ボタンをクリック

↓内部リンクを開き、現在のカテゴリーを選択>「リンク設定

↓HTMLソース編集ボタンをクリック

↓idを追加します。

<a href="URL" id="キー">HOME</a>>ブログ

ステップ5:完成


↓デモ(記事の一番下にトップに戻るボタンがあります)
ブログ - Webgaku