JimdoホームページにあるExcelファイルをダウンロードする

今回はdropboxを使用します。

あらかじめDropboxのアカウントを取得してそこにExcelファイルを格納しておきます。

Jimdoにマイマップを貼り付ける

下の地図のマークをクリックすると掲示板の写真と住所が出てきます。

作成方法は後日掲示します。

Jimdoに音楽データを組み込む

Jimdoに動画をアップするにはYOUTUBEを利用する方法がありますが、知人から音楽データを載せられないかとと尋ねられました。

以下のようにすることで可能になります(Dropboxを使っていることが前提です)。

1.Dropboxに音楽データをmp3の形式でアップする。

2.音楽データのファイルを表示させ、右側の共有ボタンをクリックする。

3.共有設定の画面が出るので「リンクを作成」→「リンクをコピー」をクリックする。

4.表示されたURLをコピーする。

5.音楽データを貼り付けるJimdoのサイトを表示して「コンテンツの追加」の「</>ウイジェット/HTML」を開く。

6.以下のようにaudioタグを使って「</>ウイジェット/HTML」に音楽データを指定する。

 <audio src="DropboxでコピーしたURL" controls="controls">

</audio>

DropboxでコピーしたURLの最後のid=0となっていたら、0を1に変更する。

下のようなアイコンが出て三角をクリックすると音楽が再生されます。

 

フリー音源の再生


テストのコンテンツを検討するページを作る

作成に時間がかかるコンテンツや検討したいコンテンツを公開しないで自分のページで検討する方法の例をお知らせします。

1.検討用のナビゲーションの項目を作り、非表示にします。

2.非表示にしたナビゲーションに対して左の編集ツールバー「設定」の「パスワード保護領域」から「新規パスワード保護領域を追加する」をクリックして下に出たナビゲーションの検討用のナビゲーションにチェックを入れます。

3.パスワードを設定して「保存」をクリックします。

 

編集モードでは検討用のナビゲーションはナビゲーション名に訂正線が表示され、閲覧モードでは検討用のナビゲーションは表示されなません。

 

1.ナビゲーションを追加し、それを非表示に設定する。

 

 

 

 

 

 

 

 

 

「設定」から「パスワード保護領域」をクリックする。

3.検討用のナビゲーションをパスワードで保護します。

画像の一部を他の場所にリンクする(クリッカブルマップ)

テスト

上の図の「日本橋」の部分をポイントすると指のアイコンに変わります。

そこをクリックすると日本橋~てくてく~日光(http://nikkowalk.jimdo.com/)に飛びます。

今回はJimdoの独自スタイルで作成されています。

1.アップする画像をペイントなどで開きリンクを設定する部分(今回は長方形とします)の座標(左上のx、y、右下のx、y)をエディタなどでメモしておきます。

2.次に1.の画像を自分のサイトにアップします(レイアウト→独自レイアウト→ファイル、で画像をアップします)。

3.アップしたファイルを右クリックして画像のURLをコピーします。

4.画像を設定する場所で「コンテンツを追加」から「文章」を設定し、「HTMLを編集」を選び以下のコードを入力します。

<p><img src="3.でコピーしたURL" alt="画像" usemap="#top" /></p>

<p><map id="top" name="top"> 

<area coords="44,197,75,262" shape="rect" href="リンク先のURL" />

 </map></p>

※"画像"は任意、

※#topのtopは任意の半角英数で入力

※"44,197,75,262"は1.で確認した座標

 

詳しくはpl kyoさんのサイトを!

画像の編集ができるようになった

Jimdoのニュース

http://jp.jimdo.com/2016/06/28/photo-editor/

でフォトエディターに関する記事が出ているので詳しくはこちらへ。

画像をアップロードするると下の写真のように画像の左下に「画像を編集」というツールバーが出る。

「画像を編集」をクリックすると

効果

強調

フレーム

Overlays

方向

斬り抜き

Color

シャープ

フォーカス

Vignette

テキスト

が選択できる

1.効果はさらにSignatureとClassicと分けられこの2つ、はさらに12種類の色調を選択できるる。

2.強調は5種類の選択肢がある。

3.フレーム以下も多くの編集ができるようになった。

Jimdo管理画面が変わった

2015年7月31日にJimdoの管理画面を表示したらデザインが変わっていた。せっかく講習用のテキストを7月に作ったばかりなのに・・・・・

ホーム(トップページ)の新着情報はこんなふうに作っています

このサイトは独自レイアウト使用しています。

画面右の設定ツール「レイアウト」→「独自レイアウト」→「css」

を開き、76行目に以下のソースを記載します。

 

/*  長文をコンパクトに表示

----------------------------------------------- */

.scroll

{

background-color: #ffff;

overflow: auto;

height: 150px;

margin: 10px;

padding: 20px;

border: 3px solid #ccc;

border-right: 3px solid #fff;

border-bottom: 3px solid #fff;

border: 3px solid #ccc;

border-right: 3px solid #fff;

border-bottom: 3px solid #fff;

}

/*ここまで*/

 

次にスクロールボックスの文章の「HTMLを編集」を開き文章の頭に

<div class="scroll">

と入力して、文章の最後に

</div>

と入力します。

サイト内の目的のコンテンツにリンクを貼る

縦に長い画面の中のコンテンツにジャンプしたいときがあります。

たとえばこのページの「ホーム(トップページ)の新着情報はこんなふうに作っています」

部分にジャンプする場合は以下のようにします。

タイトル「ホーム(トップページ)の新着情報はこんなふうに作っています」は「見出し」ではなく、「文章」で作っています。「ホーム(トップページ)の新着情報はこんなふうに作っています」を「HTMLで編集」で開き、文章の最初のところに

<p><a name="abc"  id="abc"></a></p>

と入力します(abcはわかりやすい文字列に自分で決めます)。

ホーム(トップページ)の新着情報はこんなふうに作っていますの文字列を選択して編集画面の「リンク」をクリックして、「内部リンク」の下のテキストボックスの▼をクリックして目的のページ(この場合は「ホームページJIMDOほか」を選択して「リンクを設定」をクリックします。

次に「HTMLで編集」をクリックして

「……7d8bcc/" title="ホームペ……」の「/」と「"」の間に#abcと追加し、「保存」をクリックします。

プレビュー画面にして「ホーム(トップページ)の新着情報はこんなふうに作っています」をクリックして画面の一番上にリンク先に飛んでいることを確認します。

 

流れる文字を表示する

ホーム画面の一番上のコンテンツの文字が流れて表示されています。この方法をご紹介します。こんな感じ↓

ようこそ皆さま! 気ままにパソコンのことを書いてみます。

「+コンテンツを追加」→「…その他のコンテンツ」→「</>ウィジェット/HT...」を開きます。

以下のタグを入力します。


<font color="red" size="5"><marquee>ようこそ皆さま! 気ままにパソコンのことを書いてみます。</marquee></font>

 

<marquee>をマーキータグといいます。

<font color="red" size="5">・・・・フォントの色を赤にしてサイズを5としています。

<marquee>と</marquee>の間に自分で決めた文章を入力します。

終了タグ</font>と入力します。