2017 101234567891011121314151617181920212223242526272829302017 12

スポンサーサイト 

上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。
トラックバック(-) | コメント(-)

ALPSLAB slide の FC2ブログでの設置方法 

では、ALPSLAB のサービス ALPSLAB slide を用いて、FC2ブログの記事に地図を貼り付けるまでの手順を説明してみます。

FC2ブログのテンプレートに ALPSLAB slide の JavaScript を埋め込む


FCブログの管理者ページで『テンプレートの設定』を選択します。
Image hosting at Photobucket


『ダウンロードしたテンプレートの一覧』のうち、現在設定されているテンプレート名前のある行の『編集』を選択します。
Image hosting at Photobucket


テンプレートHTML編集の画面で<head>タグと</head>タグの中間の行に ALPSLAB slide のJavaScriptの呼び出し用のhtmlタグを挿入します。
Image hosting at Photobucket

<script type="text/javascript" src="http://slide.alpslab.jp/scrollmap.js"></script>
実際に挿入するHTMLタグはこの部分になります。


テンプレートHTMLを保存するため『更新』を選択します。
Image hosting at Photobucket


以上でテンプレートの設定は完了ですが、テンプレートを変更しない限り、一回だけの手順になります。


ALPSLAB base から目的地の緯度・経度情報を取得する


ALPSLAB base で目的地の地図を表示します。
Image hosting at Photobucket


ALPSLAB base で表示した地図の下部にある『緯度経度』欄から緯度・経度情報をコピーします。
Image hosting at Photobucket


FC2ブログの記事で ALPSLAB slide の地図を埋め込む


FC2ブログの管理者ページで記事を編集し、ALPSLAB slide の地図表示用のHTMLタグを記入します。
Image hosting at Photobucket
このとき、DIV要素にはさまれた部分には、先ほど取得した緯度・経度情報をそのままペーストします。

<div class="alpslab-slide">35/39/31.212,139/42/15.632</div>
実際に挿入するHTMLタグはこんな感じになります。


[関連リンク]


[関連記事]


[ 2007/06/17 12:06 ] blog | TB(0) | CM(0)   ブックマークに追加する
コメントの投稿













管理者にだけ表示を許可する
Profile

ウニモグ

Author:ウニモグ
About - このブログについて
Credits - 利用素材などの記載
Contact - フォームによるお問合せ

Recent comments
Monthly Archives
ブロとも申請フォーム


上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。