jQueryとPurlライブラリを読み込む

Purlは以下からダウンロードをします。
GitHub – allmarkedup/purl: [NO LONGER MAINTAINED] A JS utility for for parsing URLs and extracting information out of them.

<script type='text/javascript' src='jquery.js'></script>
<script type='text/javascript' src='purl.js'></script>

JavaScriptコード

以下のコードにて全てのaタグにGETパラメータを付与します。
外部リンクにはパラメータは不要なため、内部リンク（http://～から始まるドメイン名および相対パス）にのみ付与する処理をしています。

jQuery( function( $ ) {

　//GETパラメータが無い場合は処理終了
  if (location.search == '') {
    return;
  }

  //GETで取得する値
  var req_params = $.url(location.href).param();
  var reg = new RegExp("^(https?:)?\/\/"+document.domain);

  $('a').each(function(){
    var url = $(this).attr('href');
    if(typeof url !== "undefined") {
        if (url.match(reg) || url.charAt(0) === "/") {
            //内部リンク時の処理
            var parsed = $(this).url();
            var old_params = (parsed.attr('query') == '') ? {} : parsed.param();
            var new_path = parsed.attr('path') + '?' + $.param($.extend(old_params, req_params));
            $(this).attr('href', new_path);
        }
    }
  });
});

すでにリンク先に指定のパラメータがある場合も想定されるため、
既存のパラメータにマージする処理をしています。

以下のサイトを参考にさせていただきました！
jQuery クエリパラメータを全リンクに付加

jQuery必須。

jQuery(document).ready(function($) {
	$("#check_link").click(function(e) {
		e.preventDefault();
		if($("#checkbox_doui").get(0).checked) {
			location.href = $(this).attr('href');
		} else {
			alert("チェックボックスをチェックして下さい");
		}
	})
});
document.write('
 チェックをするとボタンクリック可能です　アンカーテキストを記載');

みなさまはいかがいかがお過ごしでしょうか？

私は今年は
自分と向き合う時間をつくっています。

仕事をしているとどうしても目先の事で忙しくなり、
じっくり考える時間が出来なくなってしまいます。

出来る限り効率的に、
かつファン作りや集客もしっかりやっていきたい物です。

さて、本日はセミナー講師をしたい方やすでにされている方や、
これから集客を始めていきたいと思っている方におすすめの
動作マーケティングについてのお話をしたいと思います。

「動画で自分の価値や情報を伝える」という選択肢があると
影響力を及ぼせる範囲が、非常に広がります。

例えばですが、地方に住んでいて、パン教室のお仕事にされている方が、
「自宅で出来るパン作り動画講座」を作れば、
全国のパン作りをしたい方に情報を届ける事が出来るようになります。

なかなか集客ができる都会に出ていけない方も
自宅や近隣で活動する事が多い方も
「距離」と「時間」と言う制約を外すことができるのです。

動画講座を作ることで、
参加メンバーのフォローに回る事が出来、手厚く対応する事が可能にもなります。

動画講座のメリットを以下にまとめてみました。

全国どこにいても受講可能

やはり地域が遠いとハードルがどうしても高くなります。

遠くにいる人にも、自分の言葉で情報を伝えられるメリットがあります。

セミナーに通うための、交通費・宿泊費が不要

通常遠方から参加する場合は、移動のための電車・新幹線や飛行機代がかかりますし
懇親会などもある場合だと宿泊をしないと帰りの便が無い事も多いです。

私自身も半年以上、毎月飛行機で通った経験があるので
この辺の費用は結構痛いです。

動画は何度でも見ることができます

一度聞いただけでは実践出来ない事も多々あります。（自分の場合はですが・・）
何度も繰り返し聞ける事で、自分の中の腑に落とす事が可能です。

一緒に頑張れる仲間と出会えます

動画コンテンツにコメントが書き込めると、その中で交流が生まれてきます。
コミュニティが生まれれば、自然と人は集まってきます。

これから動画講座を始めたい方へ

Wixビデオを使用する事で簡単に動画のHDストリーム再生、有料配信、定期購入などが可能になります。
インストラクターの方の口座や料理教室のレッスン動画など、様々に活用が可能です。

wixビデオは、ホームページ作成サービスのWix.comが提供しているサービスです。

動画のアップロード方法

動画を直接アップロードも可能ですし YouTube、Vimeo、Facebook から追加も出来るようにになっています。

スマートフォン対応の動画プレーヤー

やはり今はスマートフォンからのアクセス対策が非常に重要です。
スマートフォンで見やすいコンテンツだと、何度もリピートして見れますね。

HD画質のストリーム配信

HD画質のため、画質が重要なコンテンツもしっかりと配信が可能です。

有料配信に対するコミッションは一切なし

通常、有料配信可能なサービスは、何パーセントかはプラットフォームに支払う必要があります。
しかし、Wixビデオをあればコミッションは一切無しとの事。
これは太っ腹ですね。

ライブストリーミングや 360 度動画にも対応

ライブストリーミング対応する事でリアルな今を共有できたり、
360動画にも対応する事で最先端の動画コンテンツ作りが可能です。

最後に

まだ動画コンテンツなんて自分には早い、
「動画コンテンツって言っても何のテーマでやろう…」
とお悩みになる方もいらっしゃると思います。

そんな時は自分の「好き」を載せたらいいなと思っています。

例えば、パン作りが好きで、それをやっていきたい場合。
本当に色々なテーマがあると思います。
例えば、子供と作るパン作り、とか
恋人、奥さん、旦那さんに作ってあげる、とか
お皿の選び方とか
保存の方法とか、
何が好きなのか？パン作りの中でも何に興味が向いているのか？は、
表現して、人に見せると、
どんどんはっきりしていきます。

そうして自分のカラーを出していった時に
この人のレシピを作ってみたいな、とか
この人の話を聞きたいな、って
どんどん興味が沸いてくるんです。

パン作りにかぎらず、占いだったり、ファッションだったり、プログラミンだったり
なんでも同じです。

そして一つのテーマに絞れない場合は、
最初から絞らなくて良いです。

なんとなくぼんやり面白そう、やってみたいな、
これだったら出来そう、って思った事から
発信していって良いんです。

もっと、自分を表現して良いんです。

発信していきましょう。

こんなことみんな知ってるし〜

これくらいみんな分かってるだろ〜

って思っている事ほど、

実は他の人にとっては

へ〜〜〜〜〜〜〜〜〜！！

って感動する事があるんです。

ぜひ挑戦してみてくださいね

グリッド要素をフィルタリングできるIsotopeが便利だったのでブログでもシェア。

使い方

↑グリッド配置の際に、いい感じに配置されます。

↑幅を指定して配置可能

↑縦配置も可能

↑横配置も可能

1.jQueryとプラグインを有効にします。

使用するには、まずjQueryとIsotopeプラグインを有効にします。

4.コンテンツを設置

プラグインを有効にしたいグリッド要素を作成します。
親要素に「.grid」、その子要素となる各要素に「.grid-item」というクラス名を与えています。

  
...
  
...
  
...
  ...

4.CSS

CSSでグリッド要素の見た目を調整します。

.grid-item { width: 25%; }
.grid-item--width2 { width: 50%; }

プラグインのオプションを指定

$('.grid').isotope({
  // options
  itemSelector: '.grid-item',
  layoutMode: 'fitRows'
});

これで設定は完了です。

動作デモ

実際の動作はぜひサイトからご確認ください。
http://isotope.metafizzy.co/

商用利用の場合には有料になるとの事なので、ライセンスにはご注意ください。

やり方は簡単で、Facebook上に説明してくれているページがありました。

Facebook公式のやり方

ブックマークレットを共有する

詳しくは上記公式サイトを御覧ください。

以下のサイトを参考にさせていただきました。感謝！

https://rakuzanet.jp/facebook-share-shortcut.html

Macでスクリーンショットを撮る再にはSkitchをいつも使っていましたが、2系にバージョンアップしてから非常に使いづらくなってきたので、使えるアプリをシェアします。

Monosnap

スクリーンショットを作成し、文字や矢印を追加できます。
Switchではできなかった、Blurをかける事も
ビデオを撮影も出来る便利なソフトです

Windows版、Mac版、iPhone版、iPad版がそれぞれダウンロードできようようになっています。

興味のある方はぜひダウンロードしてみてください

https://monosnap.com/welcome

約500万件のGmailアドレスとパスワードが漏えい、流出元は別サイトか

もし自分のアカウントが漏えいしていたら大変です。
漏えいしているかチェックする方法が無いかと思い探していたら「Check to see if your Gmail Account was Hacked」と言うサイトで
流出しているかチェック出来るようになっていましたので情報をシェア。

使い方は簡単。
フォームに自分のメールアドレスを入力するだけでチェックが可能になっています。

以下のメッセージが表示されればハッキングされた対象に入っていないとの事です。

Everything looks OK
From the early information we have, your email is NOT in the list of hacked gmail accounts.

情報漏えいは自分が気を付けていても防ぎようが無いので怖いですね＞＜

こちらの対策も行ってみてはいかがでしょうか。

自分の個人情報がどこから流出したかが丸わかりになる、Gmailの機能が凄い！個人情報漏洩対策として、個別に設定してみよう。

以上、自分のGmailアカウントが漏えいしているかチェック!500万人分が流出中!!でした。

本日面白いjQueryプラグインを見つけたのでご紹介します。

jQueryプラグイン「GridList」

2次元のグリッド要素をドラッグ&ドロップで整理でき、動的にサイズ変更や位置調整が可能なライブラリになっています。

デモ

実際の動きはぜひデモを見てみてください。

http://ubervu.github.io/grid/

新しい見せ方をする事で使いやすいページを作る事が出来るかもしれませんね。
ダウンロードは下のリンクからどうぞ。

JSで通知ポップアップを出すライブラリ「PNotify」をご紹介。

サイト内でアラートや通知を表示する際に、画面の隅に表示する今時のライブラリです。

↑デザインは色や画像の追加など簡単に出来るようになっているので、サイトに合わせて設定しやすくなっています。

スタイルはBootstrap / jQuery UIを組み合わせて簡単に組み込めるようになっています。

興味のある方は下のリンクからデモをご確認ください＾＾

FlashとJavaScriptを使用してクリップボードにテキストをコピーさせるライブラリ「ZeroClipboard」をご紹介。

サイトにはデモがあり、クリップボードにコピーが出来る様子が簡単に確認する事が出来ます。

興味ある方はダウンロードして使ってみてください