まいるどWEB拍手

| 2012年4月5日 | PHP, WEB拍手 | コメント(25)

主な特徴・機能

  • jquery+ajax+phpで作成されたWEB拍手スクリプト。
  • 拍手ボタンに拍手数が表示される。
  • 拍手時はページ遷移することなくデータ送信が可能。
  • メッセージの他に任意で名前、定形文、五つ星評価などが送信可能。
  • 複数設置可能。
  • 届いたメッセージは管理画面で常時確認可能。
  • メッセージをメールで通知させることも可能。
  • 連続拍手制限やアクセス制限など設定可能。
  • 「まろやかWEB拍手」からのデータ引き継ぎが可能。

利用規約

  • 「まろやかPHP」(旧「まろやかCGI」)で配布されているCGI・PHPスクリプト(以下スクリプト)の著作権は全て作成者であるtisa(以下作者)に帰属します。著作権表示があるものは絶対に消さないでください。著作権非表示にするには事業者登録を行ってください。
  • 商用利用は可能です。商用利用を希望される方は詳細についての「商用利用について」を必ずご覧ください。
  • 改造は自由ですが自己責任で行ってください。尚、改造に関するサポートは行いません。
  • スクリプトの再配布は要相談といたします。改造したスクリプトを配布したい場合などは作者に予めご一報下さい。
  • 全てのスクリプトが、全ての環境で動作する事を保証している訳ではありません。設置がうまくいかない、不具合が発生したなどのご報告は下記コメント欄もしくはお問い合わせフォームよりご連絡ください。
  • 当サイトに著しく不利益があると判断した場合には、スクリプトの使用中止をしていただくことがあります。
  • スクリプトを利用して起こった、いかなる不利益・損害・トラブルについて作者は一切の責任を負いません。
  • この規約はフリーウェア・シェアウェアに限らず作者が手掛けた全てのスクリプトに適用されます。ただし、WordPressプラグイン、テーマはGPLライセンスが優先的に適用されるものとします。
  • この規約は必要に応じ予告なく改編・加筆することがあります。
  • スクリプトを使用した時点でこの規約に同意したと見なします。

ダウンロード

このスクリプトはシェアウェアです。
※試用版は無料でお試しいただけます。

シェアウェア料金 500円

まいるどWEB拍手 var1.31 ライセンス購入

まいるどWEB拍手 試用版


設置方法

  1. config.phpをメモ帳などのテキストエディタで開き、管理者パスワードを設定します。
  2. jsフォルダ内にあるjquery.mwhm.jsを開き、PHP設置先ディレクトリURLを変更します。初期値はhttp://homepage/cgi-bin/mwhm/になっていますので、自身のサイトのURLに変更してください。
  3. サーバーにアップロードします。構成内容は以下のとおり。
     []内はパーミッション
    mwhm/                 [755] (任意ディレクトリ)
    ├mwhm.php             [755] (メインスクリプト)
    ├admin.php            [755] (管理スクリプト)
    ├config.php           [644] (設定ファイル)
    ├jcode.php            [644] (日本語変換ライブラリ) [入手元]
    ├data/                [755or777](データ保存ディレクトリ)
    │├config.dat          [666] (機能設定保存ファイル)
    │├label.dat           [666] (ラベル保存ファイル)
    │├index.html          [644](ダミーファイル)
    │├date/               [755or777](日付別拍手データ保存ディレクトリ)
    ││└index.html         [644](ダミーファイル)
    │└id/                 [755or777](ID別拍手データ保存ディレクトリ)
    │ └index.html        [644](ダミーファイル)
    ├js/                  [755](jqueryファイル保存ディレクトリ)
    │├jquery-1.6.4.min.js [644] (jqueryファイル) [入手元]
    │├jquery.mwhm.js      [644] (「まいるどWEB拍手」メインjqueryファイル)
    │└index.html          [644](ダミーファイル)
    ├css/                 [755] (CSSファイル保存ディレクトリ)
    │└~省略~             [644](CSSファイルファイル群全9ファイル)
    └img/                 [755] (数字画像保存ディレクトリ)
     ├~省略~            [644] (画像ファイル群全7ファイル) [入手元1/入手元2]
     └index.html         [644](ダミーファイル)
    
    ※パーミッションは設置するサーバーの環境に合わせて変更してください。
    
  4. admin.phpにアクセスして正常に表示されていれば設置成功です。
  5. 拍手ボタンの設置方法は、まずhtmlなどボタンを設置したいファイルの<head>タグ内に以下を記述します。
    <script type="text/javascript" src="http://example/mwhm/js/jquery-1.6.4.min.js" charset="utf-8"></script>
    <script type="text/javascript" src="http://example/mwhm/js/jquery.mwhm.js" charset="utf-8"></script>
    

    URLのhttp://example/の部分は設置する自身のサイトのURLに変更してください。この記述はページ内にひとつだけでOKです。

  6. 同ファイルの好きな位置に以下を記述します。
    <div class="mwhm_point" id="★"></div>
    

    ★に任意のIDを指定します。半角英数字と_(アンダーバー)-(ハイフン)が使用可能です。複数設置する場合はID名が被らないように注意してください。

  7. 同ファイルにアクセスしてボタンが表示されていれば設置完了です。

更新履歴

2014-10-25 var1.31
  • 通知メールに定型文が表示されないバグ修正
  • 細かい修正
2014-04-17 var1.30b
  • 拍手限度数を超えたあと拍手すると読み込み画像が消えなくなるバグ修正
2014-04-11 var1.30a
  • 日付別拍手一覧ページの改ページが機能しないバグ修正
2013-02-17 var1.30
  • PHP呼び出し簡略化
  • 拍手ボタン新タイプ追加
  • メッセージウィンドウの閉じるボタン拡大化
  • 日付別拍手一覧をIDとホスト/IPで絞り込み表示追加
  • 細かな仕様変更・修正
2012-10-22 var1.20
  • 拍手数の表示形式設定機能を追加
  • 拍手実行中のLoading画像を追加
  • 連続拍手限度に達した場合に表示されるメッセージを追加
2012-08-16 var1.10
  • 入力欄設置スイッチ追加
  • ホスト/IPとラベルの表示切替可能に改変
  • 配色変更機能追加
  • メール送信条件を詳細化
  • その他細かい修正/変更
2012-09-19 var1.10
  • 試用版の制限追加
2012-07-05 var1.00
  • 公開

コメント

  • 初めまして。
    こちらのスクリプトを導入させていただき拍手のカウント・メッセージの受信はなんの問題もなく動作したのですが、機能設定の『送信』ボタンが暗転していてクリックができない状態になっています。

    サーバーPHPバージョン 7.4.13
    ブラウザ Microsoft Edge,Google Chrome

    設定の変更をしたいので対処法があれば教えていただけると幸いです。
    こちらの手違いによるものでしたら、申し訳ありません。

    • ご連絡遅くなりまして申し訳ありません。

      PHPバージョンをダウングレードしてご利用ください。

  • チャチャチャ - 2020年11月2日 00:57

    はじめまして。
    こちらのスクリプトを導入して数日が経ちましたが、突然、いいねボタンが表示されなくなりました。
    サーバーのPHPは7.0.33
    ブラウザはMicrosoft Edgeです。
    iOS14.1でも見れなくなりました。
    ただし、iOS13.4.1のLINE上にURLを貼ると見ることができました。
    どのように対処したらよろしいでしょうか?

    • ご利用ありがとうございます。

      jquery.mwhm.jsファイル内の「PHP設置ディレクトリURL」が正しい値になっているかご確認ください。

      • チャチャチャ - 2020年11月3日 00:53

        ご回答ありがとうございます。
        ご指摘の通り変更しておりませんでしたので修正しました。
        PCでは表示可能になりましたが、iPhoneのSafari、Chromeでは表示することができません。
        JavaScriptもONになっております。
        iOSの仕様がそうなっているのか?
        よくわからないのですが。。。tisa様の方ではiPhoneで確認できますでしょうか。。。

      • チャチャチャ - 2020年11月3日 01:14

        さらに調べてみましたら、
        iPhoneの
        Firefoxのバージョン29.1(2020.11.03現在の最新バージョン)
        Opera Touchのバージョン2.5.1
        では表示されました。

        • iPhone SEの実機で拍手ボタンの表示確認いたしました。
          ブラウザが古いjsファイルをキャッシュしている可能性があります。
          スーパーリロードしていただくか、しばらく待ってからアクセスしてください。

  • はじめまして。こちらのスクリプトを購入し、大切に使わせていただいております。

    このたび、bootstrap3のフレームワークを使ってサイトを改装したところ、Web拍手ボタンをクリックしても動作しなくなってしまいました。
    試行錯誤してみたところ、bootstrap3のリファレンスで指定されているjquaryが1.11.1であるためにWeb拍手が動かなくなっているようでした。
    改装前と同じ1.7のjquaryを指定すると問題なく動きましたので、jquaryのバージョンが関係しているのかと思います。
    1.7のjquaryではbootstrap3の機能が動かないので、可能であれば、まいるどWEB拍手を1.11.1のjquaryで動作させる方法をご案内いただければと思います。
    お手数をおかけしますが、ご検討よろしくお願い致します。

    • ご利用ありがとうございます。

      jQuery1.11.1の対応ですが、現行バージョンでは未対応の状態です。
      申し訳ありませんが、対応化の予定は今のところありません。
      上位版の「まいるどWEB拍手ぐれーと」でしたら1.11.1でも動作すると思いますので、よろしければそちらのご利用もご検討ください。

  • はじめまして私の環境でもIEでは表示可能ですがFirefoxだと表示されない模様です
    javascriptはONになっています。コンソールを見ると次のような表示になっていました
    安全なページ上で (安全でない) 混在表示コンテンツ “http://maroyaka.xyz/demo/mwhm/img/loading.gif” を読み込んでいます[詳細] jquery-1.6.4.min.js:3:31105
    安全なページ上で (安全でない) 混在表示コンテンツ “http://maroyaka.xyz/demo/mwhm/img/loading.gif” を読み込んでいます[詳細] jquery-1.6.4.min.js:3:31105
    混在アクティブコンテンツ “http://maroyaka.xyz/demo/mwhm/mwhm.php?id=slowlife1” の読み込みをブロックしました[詳細] jquery-1.6.4.min.js:4:14360
    混在アクティブコンテンツ “http://maroyaka.xyz/demo/mwhm/mwhm.php?id=slowlife2” の読み込みをブロックしました[詳細] jquery-1.6.4.min.js:4:14360
    混在アクティブコンテンツ “http://maroyaka.xyz/demo/mwhm/mwhm2.php?id=slowlife3” の読み込みをブロックしました[詳細] jquery-1.6.4.min.js:4:14360
    混在アクティブコンテンツ “http://maroyaka.xyz/demo/mwhm/mwhm2.php?id=slowlife4” の読み込みをブロックしました[詳細] jquery-1.6.4.min.js:4:14360
    getPreventDefault() の使用は推奨されません。代わりに defaultPrevented を使用してください。 jquery-1.6.4.min.js:3:3869

    あとFireFoxだとhttpでアドレスを踏んでも強制的にhttpsになってしまう模様です

    • ご報告ありがとうございます。

      差し当たりサンプルのほうをHTTPSでも表示できるようにいたしました。

      • 返信ありがとうございます。
        サンプルというのはデモページの事でしょうか?
        デモページは現状私のFirefox環境だとまだ表示できないようです
        コンソールエラーは以下の通りでした

        混在アクティブコンテンツ “http://maroyaka.xyz/demo/mwhm/css/mwhm.css” の読み込みをブロックしました[詳細] jquery-1.6.4.min.js:3:29585
        安全なページ上で (安全でない) 混在表示コンテンツ “http://maroyaka.xyz/demo/mwhm/img/loading.gif” を読み込んでいます[詳細] jquery-1.6.4.min.js:3:31105
        混在アクティブコンテンツ “http://maroyaka.xyz/demo/mwhm/mwhm.php?id=slowlife1” の読み込みをブロックしました[詳細] jquery-1.6.4.min.js:4:14360
        混在アクティブコンテンツ “http://maroyaka.xyz/demo/mwhm/mwhm.php?id=slowlife2” の読み込みをブロックしました[詳細] jquery-1.6.4.min.js:4:14360
        混在アクティブコンテンツ “http://maroyaka.xyz/demo/mwhm/mwhm2.php?id=slowlife3” の読み込みをブロックしました[詳細] jquery-1.6.4.min.js:4:14360
        混在アクティブコンテンツ “http://maroyaka.xyz/demo/mwhm/mwhm2.php?id=slowlife4” の読み込みをブロックしました[詳細] jquery-1.6.4.min.js:4:14360
        getPreventDefault() の使用は推奨されません。代わりに defaultPrevented を使用してください。 jquery-1.6.4.min.js:3:3869

        • サンプル=デモページです。スミマセン。
          URLに誤りがありましたらのでよろしければ再度ご確認ください。

          • tisa様、難度もお手数おかけしてすみません。
            デモページのURLは以下の通りでした。が私のFirefox環境ではやはりまだ表示出来ないようです。
            http://maroyaka.xyz/demo/mwhm/mwhm.html

            コンソールエラーは以下の通りでした
            混在アクティブコンテンツ “http://maroyaka.xyz/demo/mwhm/css/mwhm.css” の読み込みをブロックしました[詳細] jquery-1.6.4.min.js:3:29585
            安全なページ上で (安全でない) 混在表示コンテンツ “http://maroyaka.xyz/demo/mwhm/img/loading.gif” を読み込んでいます[詳細] jquery-1.6.4.min.js:3:31105
            混在アクティブコンテンツ “http://maroyaka.xyz/demo/mwhm/mwhm.php?id=slowlife1” の読み込みをブロックしました[詳細] jquery-1.6.4.min.js:4:14360
            混在アクティブコンテンツ “http://maroyaka.xyz/demo/mwhm/mwhm.php?id=slowlife2” の読み込みをブロックしました[詳細] jquery-1.6.4.min.js:4:14360
            混在アクティブコンテンツ “http://maroyaka.xyz/demo/mwhm/mwhm2.php?id=slowlife3” の読み込みをブロックしました[詳細] jquery-1.6.4.min.js:4:14360
            混在アクティブコンテンツ “http://maroyaka.xyz/demo/mwhm/mwhm2.php?id=slowlife4” の読み込みをブロックしました[詳細] jquery-1.6.4.min.js:4:14360
            getPreventDefault() の使用は推奨されません。代わりに defaultPrevented を使用してください。 jquery-1.6.4.min.js:3:3869

          • ご連絡遅くなり恐縮です。
            デモページを更新いたしましたのでよろしければご確認ください。

  • はじめまして。
    現在久城さんが質問されている『ローディングのgif画像がずっと回ったまま』の件ですが、

    Firefox
    Chrome
    IE
    Opera
    Safari(iPhoneより)

    以上のブラウザで試してみましたが同じ状態です。
    ただし、管理ページには入ることができました。

    • 同じことをお伺いして申し訳ないですが、Consoleエラーをご確認いただくことはできますか?

  • ご回答有り難うございます。

    Javascriptもonで、ブラウザも最新です。他サイトのjqueryを使ったモーダルなどは普通に動きます。
    デモページのボタンだけでなく、仕様版をDLして設置してみてもローディングのgif画像がずっと回ったままです。キャッシュのクリア等も試してみたのですがダメでした。

    他にこちらで確認できそうなものはあるでしょうか?

    • 追記です。iPadのsafariでも同様の症状でした。
      しかし私個人のみこの症状が出ている可能性も捨てきれないので、ちょっと様子を見てみます。

    • こちらで確認ができれば良いのですが…スミマセン。

      Chromeの検証などでConsoleエラーがないかご確認いただくことはできますか?

      • すいません、今あまり時間がなくてしっかり検証はできていないのですが、自分のサイトについては同じページに設置してあったスクリプトを削除することで一応表示はされるようになりました。
        (一つのIDにつき、拍手が五回を数えると停止してしまうのは試用版だから??)

        ですが、こちらのデモページは相変わらずロード画像のままです。
        (エラーコードはたくさん出てるのですが「Mixed Content: The page at ‘http://maroyaka.xyz/demo/mwhm/mwhm.html’ was loaded over HTTPS, but requested an insecure image ‘http://maroyaka.xyz/demo/mwhm/img/loading.gif’. This content should also be served over HTTPS.」これかなあ?)

        私のサイトにしてみても、閲覧者の環境によっては見えない場合もあるのかもしれません。まだちょっと不安定です。

        拍手したあとのポップアップが、cssのpositionの関係でコンテンツ下に潜ってしまったりして閉じることができないという、当方固有の問題もありまして、スマホの人向けにモーダルウィンドウに作り変えたかったんですけど、……現状ではスクリプト同士のバッティングが怖くて無理そうです。(javascript詳しくないものでw)

        時間見つけてもうちょっと検証してみます。

        • ありがとうございます。

          デモページはhttp”s”でアクセスすると動かないようですね。下記ページの動作を確認してみてください。
          http://maroyaka.xyz/demo/mwhm/mwhm.html

          デモページのリンクはhttpのままなのですが、何故sが付いてしまったのでしょうか…(-_-;)

          positionの問題は、現状ではサイトの構成内容次第になります。ご了承ください。

  • はじめまして。こちらのスクリプトの導入を検討しているのですが、デモページを見る限り、Winの環境ではIEにしか対応していないようです。(ChromeとFirefoxでは拍手ボタンが表示されません)
    この点はなんとかならないものでしょうか?

    よろしくお願い致します。

    • ご利用ありがとうございます。

      同スクリプトはChrome、Firefoxの両方で動作確認しています。
      拍手ボタンはJavaScriptで生成していますので、JavaScriptがONになっているかどうかブラウザの設定をご確認ください。


tisa へ返信する コメントをキャンセル