株式会社ドリル Home > アメブロカスタマイズ > アメブロカスタマイズの基本 > 【アメブロカスタマイズ】JavaScriptについて知っておこう

【アメブロカスタマイズ】JavaScriptについて知っておこう

たまにクリックで応援して頂けると、励みになります。
⇒《人気ブログランキング》

2013 01 08 1911

こんにちは、ドリル 鈴木です。
今回はアメブロカスタマイズでもよく使われる「JavaScript」について解説したいと思います。 

 

ただし、難しい説明はWikipediaや専門書を読んで頂ければ良いので、ここではアメブロカスタマイズでJavaScriptを利用するにあたって必要と思われる事柄について説明したいと思います。

 

それでは、スタートです。 

アメブロxワードプレス連動ツール アメプレス
アメブロビズ3 集客の為のアメブロビジネステンプレート Ameblo Biz3

 

JavaScriptとは

JavaScriptとはプログラム言語になります。
主にウェブブラウザに実装され、動的なウェブサイトの構築やウェブアプリケーション構築に用いられます。

 

最近では、スマートフォンのウェブブラウザでも動作する事、JQueryという高度な機能を簡単に使う事の出来るライブラリの普及によって、活躍の場を広げています。
ちなみに、ライブラリとは機能を部品化したものを複数まとめたものです。
他のプログラムから呼び出す事によって、利用する事が出来るのもです。

 

これ以上詳しい事は「Wikipedia – JavaScirpt」をご覧下さい。
アメブロカスタマイズでは必要ないかと思うので、ここでは省略します。

 

JavaScriptを使うとアメブロで何が出来るの?

アメブロでJavaScriptを使う事によって、出来る事はとても沢山あります。
わかりやすい所ですと、フッターをつけたり、サイドバーの検索フォームに見出しを付けたり、バナーを複数の好きな箇所に表示させたり。
記事の上に読者登録ボタンを設置したりも「JavaScript」を利用します。

 

つまり、表示されている物のデザインを変えるのであればCSSで出来ますが、なにもない所に表示させる事は出来ません。
しかし、JavaScriptを利用するとなにもない所に自由に表示させる事が出来るのです。
また、画像をスライドさせたり、動かしたりと言った事も可能です。
 

JavaScriptを利用する事によって、元々のアメブロよりリッチなデザインや内容にする事が出来るのです。

 

アメブロでJavaScriptを利用するには

アメブロでも簡単にJavaScriptを利用する事ができます。
まずは、管理画面の「フリープラグイン」を開いてください。
メニューからは「ブログを書く」→「プラグインの追加」→「フリープラグイン」になります。 

2013 02 15 1618 

 

アメブロではここにJavaScriptを記述する事が出来ます。
逆に言うと、ここにしか記述する事が出来ません。
記事の中やフリースペース、プロフィールには記述できませんので注意してください。

 

フリープラグインにJavaScriptを記述する際は、外部のJavaScriptを読込む方法と直接プログラムを記述する2種類の方法があります。
参考に「【アメブロカスタマイズ】サイドバーの読者登録ボタンを上に移動させよう – 読者登録ボタンをもっと目立つ位置に」の「プラグインの追加を行い読者登録ボタンの位置を変更する」の所を見てください。

 

ここに記述されている

<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>

は外部のサイトに置かれているJavaScriptファイルを読込んでいます。
ここではGoogleが提供しているJQueryのJavaScriptファイルを読込んでいる意味になります。

 

また、その下に記述させている

<script type="text/javascript">
jQuery(function($) {
  $('.readerMenu .readerHeader').before($('.readerRequestArea'));
});
</script>

が直接プログラムを記述する方法です。
この場合、必ず「<script>」のタグでくくる必要があります。
これを記述しないと全く動かないので、注意してください。

 

特に、フリープラグインの箇所は入力文字数に「半角3800文字相当まで」という制限があります。
ですので、沢山記述する場合は一つのファイルにまとめて、外部サーバにアップロードし、フリープラグインの箇所で読込む様にする事をオススメします。

 

まとめ

JavaScriptはプログラム言語です。
その為、未経験の方がゼロから自分で作成しようとすると、とても難しいです。

 

しかし、ありがたい事にJQueryという強力なライブラリーと無料で提供されている多くのプログラムがあります。
これを利用する事によって、未経験でもアメブロをオリジナルのリッチな内容にする事ができます。
使い方も多くの場合はコピー&ペーストで可能です。 

 

ただし、多くの有用なプログラムが英語によって提供されています。
その為、「どうしても使い方がわからない」 という場合も出てくるかも知れません。
しかし、よく使われているプログラムは大抵日本語のブログでも解説されているので検索してみてください。

 

それでも見つからないと言う場合は、メールまたはコメントでご連絡下さい。
出来る限り解説させて頂きます。

 

以上、鈴木でした。

 

たまにクリックで応援して頂けると、励みになります。
⇒《人気ブログランキング》









[`yahoo` not found]
[`livedoor` not found]
[`buzzurl` not found]

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です