山田
ブログリーダー

プロジェクト3‐1:”Wikister”を作成!

今回のまとめ

今回は、粕田埋蔵(かすたまいぞう)のブログカスタマイズ講座の第3‐1回として、”Wikister”というプラグインについて説明したいと思います。


17/02/20 山田メール(朝目が覚めると猫になっていた。)


学習系Webアプリ”Wikister”

はい、xdomainajax.jsでWikipediaのページを取得しようと思ったんですが、これは流石にできませんよね。笑

ローカルでは取得できたんですが、仕方がないのでブックマークレットとインラインフレームを使う事に。

まあ、考えてもみれば分かる事だったんですが、当然Wikipediaでは実行できず、更にスマホChromeでも実行できなくなりました。

今はスマホからの方がアクセスが多いので、PC版でしか動作しないWebアプリを作りまくっても意味がないんですが、ちょっとコンセプトを見直す事にしました。


画像で一言「朝目が覚めると猫になっていた。」


17/02/21 山田メール(暗証番号は0299、”ニクキュー”って憶えてください。イエーーー、ジャスティス!)


もともとのコンセプト

もともとのコンセプトは、”Wikipediaのページの知識度を評価して、勉強しながらお宝ページを探す”というコンセプトだったんですが、対象をWikipediaからブログにする事にしました。

判定する要素はHTMLで指定できるようにしてあります。

できればWikiでやりたかったんですが、FC2Wikiくらいでしか動作しないと思います。

今、小遣い稼ぎWikiでチェックしてみたら、星8つになりました。笑

山田ブログは、何も指定していない状態で星2つです。

Wikipediaくらいになると、10以上になります。


画像で一言「暗証番号は0299、”ニクキュー”って憶えてください。イエーーー、ジャスティス!」


17/02/22 山田メール(とりあえず箱にでも入って状況を整理するか。)


”Wikister”の仕組み

仕組みは簡単なんですが、Wikiへのリンクを重複なくカウントして平方根+1を計算しています。

ちょっと平方根のグラフが見つからなかったんですが、大体4つのリンクで星3つに、100以上で星11以上になります。

これをWikipediaを探検しながらやりたかったんですが、あちらでは実行できないのでブログバージョンを作ってみた訳です。笑

スマホでも実行できないので、xdomainajax.jsで直に広告を読みこんでもよかったんですが、スクリプトが長くなるので広告ページをHTMLファイルにしてインラインフレームで読みこむ事にしました。


画像で一言「とりあえず箱にでも入って状況を整理するか。」


17/02/23 山田メール(落ちつくな~。)


pスライダーにタイトルを追加

はい、ディスプレイに表示される内容を括っているタグか、その親タグにtitle属性がある場合、タイトルとして表示するようにしました。

どちらにもtitle属性がある場合は、ディスプレイに表示される内容自体を括っているタグ側のtitleが優先されます。

そう言えば以前に「タイトルを伏せられると何の事か分からなくなる」という話をしましたし、pスライダーにも追加する事にしました。

面倒な作業になるかと思ったんですが、JavaScriptとCSSを数行書きかえるだけで済みました。


グラサン侍改め粕田埋蔵(かすたまいぞう)「”山田デバッグルーム”更新中!」


画像で一言「落ちつくな~。」




関連記事
スポンサーサイト

プロジェクト2‐1:”占いの館”を作成!

今回のまとめ

今回は、粕田埋蔵(かすたまいぞう)のブログカスタマイズ講座の第2‐1回として、”占いの館”というプラグインについて説明したいと思います。


17/02/08 山田メール(しまった!見つかったか?)


占いの館

奥様向けに作ってみたんですが、どうですかね~。

ベースになっているのはタロットです。

仕組みを説明すると、pスライダーに散らばった占い師(キャラクター)それぞれに12通りのアルゴリズムがあって、日付と選択したキャラクターの順番によって占い結果がかわります。

開始リンクの下に”シャッフル”というチェックボックスがあると思いますが、チェックを外して同じ日に同じ順でキャラクターを選択して占うと同じ結果が出るようになっています。

シャッフルのチェックを外して、キャラクターを選択せずに占うと必ず0(The Fool[正位置])が出ます。

同じキャラクターは2回選択できません。

また、全てのキャラクターを選択する必要もありません。

これ、データベースを作るのが大変だったんですよ。笑


画像で一言「しまった!見つかったか?」


17/02/09 山田メール(悪いがズラからせてもらうぜ!このお宝は渡せね~な)


一部の解釈を削除

占い開始リンクとpスライダーは、上部オーバレイメニューに移動しました。

占いスペースは、個別ページ末のトイカジノ2の上にあります。

タロットの説明文はWikipediaから引用しています。

しっかし、タロットは解釈がネガティブですね。

悪い結果が多すぎます。笑

”流産”などの表現があったので、一部の解釈を削除してあります。


画像で一言「悪いがズラからせてもらうぜ!このお宝は渡せね~な」


17/02/10 山田メール(撒いたか?)


BGサウンドを追加

BGサウンドとタロット一覧を追加しました。

BGサウンドは、お馴染みの”魔王魂”さんのものを使わせていただいています。

タロット画像には山田ブログのキャラクター達の色相を変更したものを使っています。

正位置、逆位置合わせて全部で44パターンあります。

一度手抜き画像をアップしてしまったので、上書きが大変でした。

後で思ったんですが、トランプの時みたいに1つの画像にして部分表示にした方が良かったかもしれませんね。


画像で一言「撒いたか?」


17/02/11 山田メール(この港から国外に逃亡だ!(”The宝箱4” ~このティッシュだけは渡さない~))


pスライダーの広告表示位置

PC版pスライダーのスポンサー広告をhoverで拡大表示に変更しました。

もともと、”おしゃべり河童君”に広告を入れる方法を考えていたんですが、そっちに入れるならpスライダーに入れた方がいいかと思って。

JavaScriptは上書きしてありますが、CSSの方もアップデートがあるので、お手数ですが利用したい方は説明書の方を再度ダウンロードしてください。

pスライダー配布ページは、小遣い稼ぎWikiの方にもあります。


グラサン侍改め粕田埋蔵(かすたまいぞう)「まとめにしか登場してない...笑」


画像で一言「この港から国外に逃亡だ!(”The宝箱4” ~このティッシュだけは渡さない~)」




関連記事

プロジェクト1‐1:”おしゃべり河童君”を作成!

今回のまとめ

今回は、粕田埋蔵(かすたまいぞう)のブログカスタマイズ講座の第1‐1回として、”おしゃべり河童君”というプラグインを例にプラグイン作成の流れを説明したいと思います。


17/01/31 山田メール(シリーズ2作目にして、ついに主役に躍りでた宝箱)


”おしゃべり河童君”作成の流れ

遊園地のアトラクションに通りかかるタイミングでしゃべりだす人形ってあるじゃないですか。

GitHubでサウンドデータが手に入ったのでオルゴールを作っても良かったんですが、クリスマス向けのゲームで1度作っているので、サンプルとしてページを移動するごとにサイドメニューの河童アイコンに様々なメッセージをしゃべらせてみたいと思います。←テストで動作は確認してあるんですが、実際に設定はしてありません。

この関数にはidを2つ渡すんですが、1つ目は追記に書きこむ優先idで、2つ目はサイドメニューかテンプレートに書きこむ全体idになります。

idの中には、◆区切りでサウンドファイルを複数指定できて、河童アイコンにカーソルを乗せるとランダムに選んだサウンドを再生します。

色々とやっていますが、スクリプトは10行くらいで済んでいます。


画像で一言「シリーズ2作目にして、ついに主役に躍りでた宝箱」


17/02/01 山田メール(どんな困難も乗りこえる。そこに宝箱があるから)


配布について考える

次は、配布について考えてみましょうか。

こういう一言メッセージって、けっこう人気が出るんですよ。笑

もともと配布を前提に書いてあるので、スクリプトはそのままでいいんですが、個別ページごとに設定ができるので、そこだけで1つのコンテンツになりますから、広告を入れたりしてもいいかもしれませんね。

ユニクロのCMみたいな言い方になりますが、山田はいつもxdomainajax.jsを使っています。笑

スクリプトの読み書きができる人からしたらほとんど意味がないんですが、一応簡単なBAN設定もあった方がいいと思います。

とまあ、毎回そうしているとアップデートが大変になりますから、この辺りの機能はpスライダーにまとめます。


画像で一言「どんな困難も乗りこえる。そこに宝箱があるから」


17/02/02 山田メール(そして現れた最強の敵)


プラグインの組み込み

このプラグインは少し単純すぎますが、プラグインの中にもプラグインを組みこめるようにしておくと利用者に自由にカスタマイズを楽しんでもらう事もできるようになります。

プラグインを組みこめるようにする簡単な方法に、JavaScriptのtypeofがあります。

例えば、ifの中でtypeofを使ってymd_plugin1が存在するかどうかを確かめれば、”あれば実行、なければスルー”という処理ができます。

そこで、ymd_plugin1はこちらでは用意せずに利用者に作ってもらえば、こちらが作ったスクリプトの中に利用者が書いたスクリプトを組みこめる訳です。

1人で全ての機能を作るより、(広告ネットワークを作っておいて)利用者にプラグイン作成を許可した方が早く多くの人に配布する事ができます。


画像で一言「そして現れた最強の敵」


17/02/03 山田メール(さあ、鼻をかみなさない。(涙腺崩壊必至))


HTMLで設定ができるようにする

ブログを書いているという事は、だいたいHTMLくらいは使えるでしょうから、HTMLで設定ができるようにしてあげると利用者にとって使いやすくなります。

やり方は簡単なんですが、idを付けてdisplayをnoneにしたdivタグの中に設定を書きこめるようにするだけです。

スクリプト側では初期値は必要になりますが、ifの中でgetElementByIdを使ってidが存在するかどうかをチェックして、あったらinnerHTMLを変数に代入します。

初期値が必要になるのは、if文で確認するので、なかったらなかったでスルーするからです。

別のやり方もあるかもしれませんが、利用者にとっては分かりやすい方法だと思います。


グラサン侍改め粕田埋蔵(かすたまいぞう)「ぶっ、出番なし!」


画像で一言「さあ、鼻をかみなさない。(涙腺崩壊必至)」




関連記事

SEOテクニックを毎日実践:訪問者にとって有益な情報を考える!

今回のまとめ

今回は、SEOテクニックを毎日実践シリーズの第5回として、訪問者にとって有益な情報について考えてみたいと思います。


17/01/27 山田メール(よく来ました、勇者よ。話せば長くなるのですが、私はあなたの母...)


訪問者にとって有益な情報

やっぱり、稼げるようにしてあげる事って難しいんですよ。

本当にHTMLの説明から始める事になると、どう説明してあげればいいか考えてしまいます。笑

まあ仕事と考えれば、その段階から分かりやすく説明してあげられるようにならなくてはなりませんね。

さて、本題の”訪問者にとって有益な情報”についてですが、当然自分が得意な事でなくてはなりません。

不得意な分野について「まあ、そんなもんなんじゃないの~?」とか言っていたって、こち亀の両さんに法律について意見を聞いたような感じになってしまうので、訪問者の役に立つことはありませんから。笑

でも、確かに得意分野って聞かれると困ってしまいますよね。

パッと思いつくのが、ブログカスタマイズです。

山田ブログは、FC2ブログ公式テンプレート”basic_white”を使っていますが、まあ改造しまくってあります。笑

jQuery本体級のスクリプトがゴロゴロ転がっているので。笑

ただ、ブログカスタマイズの話を始める前に、”ポイントサイト利用者にとってのメリット”と”自分のカスタマイズのいい所”については説明しておかなくてはなりません。

このブログはポイントサイト紹介ブログ(←初耳ですが、笑)なので、ポイントサイト利用者にとってメリットがなかったら意味がありませんし、他のカスタマイズブログと比べて見所がなかったら、訪問者にとって有益な情報になりません。


画像で一言「よく来ました、勇者よ。話せば長くなるのですが、私はあなたの母...」


17/01/28 山田メール(...さあ、これで鼻をかみなさい...)


カスタマイズのメリット

稼いでいる人の特徴として、”ポイントサイトの事を悪く言わない、ポイントサイトが好きな事”があります。

まあ、心理学的には”好き”と”詳しい”は同じ事らしいので、当然の結果なのかもしれませんが。笑

ただ、どうしても”ポイントサイトを好きになれない”という人もいると思うので、そういった人達にお勧めしたいのがポイントサイトのSNS的利用法です。

要するに、ポイントサイトを利用している人達と知りあって一緒にブログを楽しもうという考え方です。

アメーバブログなどではよく見かけるんですが、ポイントサイトを利用したい奥様達の間で紹介しあったりしていますよね。

ポイントサイトの事を好きじゃなくても、そういった環境に置かれれば、人間関係があるのでブログも読むようになりますし、会話をするので情報もどんどん入ってきますから、嫌でも詳しくなります。笑

では、なぜブログカスタマイズが必要かと言うと、これがSNS的利用法だからです。

ブログは言ってみれば家のようなものですし、SNS的と言っても連絡はブログのコメントなどになりますから、家に人を招待するのと同じ事なので、それなりにきれいにデザインしておく必要があります。

といった所が、ポイントサイト利用者にとってのブログカスタマイズのメリットになります。


画像で一言「...さあ、これで鼻をかみなさい...」


17/01/29 山田メール(...何か問題でも?)


自分のカスタマイズのいい所

まあ、自分のブログのいい所を自分で探すのは恥ずかしいので、タイプについての話をしたいと思います。

ブログをカスタマイズしている人にも、オシャレにデザインする人から自分の好きなものを並べる人まで様々なタイプがあると思います。

ブロともさんにも女性らしいオシャレなデザインをされている人は多いんですよ。

当時も話をしましたが、このブログを始めて少しした頃にディズニーブログを見に行った事があって、”※年パス週末イン”という文化(?)に衝撃を受けたんですね。

※年間パスポートを買って毎週末に遊びに行く事。

山田ブログもそんな事を言われてみたいものですが、それからブログに訪問してくれる人達をいい意味で驚かせたいと思うようになって、色々とカスタマイズを始めた訳です。

ディズニーも、そんなに遊びに行ってもまだ飽きないほどの驚きが隠されていますよね。

なので、どんなタイプのカスタマイズをしているかと言われると、”テーマパークを目指してカスタマイズをしている”が答えになると思います。


画像で一言「...何か問題でも?」


17/01/30 山田メール(...(パカッ)...何か問題でも?...何か問題でも?...さあ、さあ!)


模範例を作る

SEOブログでは、「理屈は分かったので模範例を出してください」と言うと出てこない事がよくあります。

いくら理屈を説明されても、実際の模範例を出してもらえなければ理解は深まりませんから、次回から実際に訪問者にとって有益な情報としてブログカスタマイズの話をしてみたいと思います。

この間にも、いくつかプラグインを作っているんですが、具体的には最近作ったものや商用なのでもう片方のブログで紹介できないものやスマホプラグイン、マネタイズの方法についての話になります。

ちょうど、グラサン侍を使っていなかったので、粕田埋蔵(かすたまいぞう)に改名して新コーナーを担当させたいと思います。笑


画像で一言「...(パカッ)...何か問題でも?...何か問題でも?...さあ、さあ!」



絵文字18関連ページ一覧>仕事ノート 毎日SEO

関連記事

便利メニュー
携帯版山田ブログ(タグランキング)携帯版山田ブログ 更新情報メールボックス スターターガイドお役立ちツール集 ブックマークはてなブックマーク
お薦めポイントサイト1位
モッピー!お金がたまるポイントサイト
モッピー
14年注目度No1
ポイントレート 1ポイント=1円(1コイン=0.1円) 紹介制度 2ティア(40%) 最低換金額 300ポイント(300円)~ 換金上限 なし
げん玉
お薦めポイントサイト2位
毎日お得がいっぱい げん玉
げん玉
人気No1
こちらから登録で250Pがもらえます!
ポイントレート 1ポイント=0.1円 紹介制度 3ティア(最大35%) 最低換金額 3,000ポイント(300円)~ 換金上限 一日1万円まで
ハピタス(入門系)
3位
日々の生活にhappyをプラスする|ハピタス
ハピタス
入門的ポイントサイト
こちらから登録で30Pがもらえます!
ポイントレート 1ポイント=1円 紹介制度 2ティア(最大40%) 最低換金額 300ポイント(300円)~ 換金上限 一か月3万円まで
GetMoney!(メール受信系)
☆4位☆
お小遣い稼ぎなら最強ポイントサイトGetMoney!
GetMoney!
メール受信で稼ぐなら
ポイントレート 1ポイント=0.1円 紹介制度 2ティア(50%) 最低換金額 5,000ポイント(500円)~ 換金上限 なし
ポイントタウン
チャレンジ中
ポイントでお小遣い稼ぎ|ポイントタウン
ポイントタウン
コンテンツ量No1
こちらから登録で500Pがもらえます!
忍者AdMax(自動で稼ぐ系) ブックマークレット
山田バー t検定のピタゴラスイッチ ブログクエスト ブログクエスト(バトル) トイカジノ2(ポーカー) 山田フィッシング 山田城と不気味なスリラーナイト 山田城と不思議なクリスマスキャロル 山田城 山田城と麗らかな春 pスライダー 占いの館
相互リンクについて
当ブログは相互リンク歓迎です絵文字237
ただし、相互リンクは、
お小遣い稼ぎ情報を扱っていて、
お申し込みをいただいた時点で更新を続けられているサイト様
に限らせていただきます絵文字234
※こちらから申し込みをさせていただく場合は
この限りではありません絵文字203
リンクはこちらもそういたしますので、
トップページからしていただけると嬉しいです絵文字236
なお、内容について、
法律に反していたり、
モラルが欠けていたりする場合などは、
リンクをお断りさせていただく事があるので、ご了承ください絵文字183
横断検索サポートを始めました。
相互リンクをしている必要はありませんが、
サイドメニューで使われたい方はリンクをお願いします絵文字87
一言お声掛けいただければ、
こちらからもリンクいたします絵文字179
お申し込みは、
相互リンクの輪
コメントからお願いします絵文字228
相互リンクについて!◆星2つ