質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.48%
WordPress

WordPressは、PHPで開発されているオープンソースのブログソフトウェアです。データベース管理システムにはMySQLを用いています。フリーのブログソフトウェアの中では最も人気が高く、PHPとHTMLを使って簡単にテンプレートをカスタマイズすることができます。

PHP

PHPは、Webサイト構築に特化して開発されたプログラミング言語です。大きな特徴のひとつは、HTMLに直接プログラムを埋め込むことができるという点です。PHPを用いることで、HTMLを動的コンテンツとして出力できます。HTMLがそのままブラウザに表示されるのに対し、PHPプログラムはサーバ側で実行された結果がブラウザに表示されるため、PHPスクリプトは「サーバサイドスクリプト」と呼ばれています。

ラジオボタン

ラジオボタンはフォームに使われる要素のひとつであり、ユーザに限られた選択肢からひとつの答えを選んでもらうというものです。

HTML

HTMLとは、ウェブ上の文書を記述・作成するためのマークアップ言語のことです。文章の中に記述することで、文書の論理構造などを設定することができます。ハイパーリンクを設定できるハイパーテキストであり、画像・リスト・表などのデータファイルをリンクする情報に結びつけて情報を整理します。現在あるネットワーク上のほとんどのウェブページはHTMLで作成されています。

Q&A

0回答

1138閲覧

「WP Customer Reviews」のカスタムフィールドにラジオボタンで選択できるフォームを設置したい

ayumia

総合スコア0

WordPress

WordPressは、PHPで開発されているオープンソースのブログソフトウェアです。データベース管理システムにはMySQLを用いています。フリーのブログソフトウェアの中では最も人気が高く、PHPとHTMLを使って簡単にテンプレートをカスタマイズすることができます。

PHP

PHPは、Webサイト構築に特化して開発されたプログラミング言語です。大きな特徴のひとつは、HTMLに直接プログラムを埋め込むことができるという点です。PHPを用いることで、HTMLを動的コンテンツとして出力できます。HTMLがそのままブラウザに表示されるのに対し、PHPプログラムはサーバ側で実行された結果がブラウザに表示されるため、PHPスクリプトは「サーバサイドスクリプト」と呼ばれています。

ラジオボタン

ラジオボタンはフォームに使われる要素のひとつであり、ユーザに限られた選択肢からひとつの答えを選んでもらうというものです。

HTML

HTMLとは、ウェブ上の文書を記述・作成するためのマークアップ言語のことです。文章の中に記述することで、文書の論理構造などを設定することができます。ハイパーリンクを設定できるハイパーテキストであり、画像・リスト・表などのデータファイルをリンクする情報に結びつけて情報を整理します。現在あるネットワーク上のほとんどのウェブページはHTMLで作成されています。

0グッド

0クリップ

投稿2020/08/18 05:36

どうか解決の糸口をご教示いただきたいです。

WordPressのプラグイン「WP Customer Reviews」で、サイト内にレビューを表示させる機能を組み込んでいます。

このプラグインのデフォルトでは、レビュー投稿部分のフォームにはテキストフォームが表示されます。
カスタムフィールドで項目を追加し、「性別」や「年代」を入力できるようにしたいのですが、ユーザビリティを考慮し、ラジオボタンで回答を得られるようにしたいと考えています。

起こっている問題

カスタムフィールドの項目は、作成した項目の数だけ自動的に作成されているようで、元のコードを書き換えてしまうと、「性別」や「年代」など内容の違う項目を作成することができません。
おそらくループで以下PHPコードを出しています。

そこで、ラジオボタンの設置は、JavaScriptで差し込むことにして、表示自体はできたのですが、ラジオボタンでチェックが入っているデータを受け取ることができず、同じnameの一番最後にあるvalueを拾ってしまいます。

以下のコードの場合、"男性"にcheckedが入っていても、データで飛んでくるのは"女性"になってしまいます。

また、生成されたHTMLを見ても、<form>タグがなく、どういった仕組みでフォームが動いているのかがわかりませんでした。

該当のソースコード

JavaScript

1//JavaScript(プラグイン外から差し込んだもの) 2jQuery(function ($) { 3 4 gendHTML = 5 '<label><input type="radio" class="text-input" name="wpcr3_f2" value="男性" autocomplete="off" checked>男性</label><label><input type="radio" class="text-input" name="wpcr3_f2" value="女性" autocomplete="off">女性</label>'; 6 7 $(".wpcr3_review_form_text_field:nth-child(4)").find("td:nth-child(2)").html(gendHTML); 8 9});

PHP

1//プラグイン内のカスタムフィールドを表示させているコード 2<tr class="wpcr3_review_form_text_field"> 3 <td> 4 <label for="{{name}}" class="comment-field">{{label}}</label> 5 </td> 6 {{#test}} 7 test only 8 {{/test}} 9 <td> 10 <input maxlength="150" class="text-input {{class}}" type="text" id="{{name}}" name="{{name}}" value="{{value}}" /> 11 </td> 12</tr> 13

HTML

1<!-- 生成されたHTMLのフォーム部分 --> 2 3<div data-wpcr3-content="176"><div class='wpcr3_respond_1 ' data-ajaxurl='["http:||kefran","local|wp-admin|admin-ajax","php?action=wpcr3-ajax"]' data-on-postid='176' data-postid='176'> 4 <div class="pps-r_middle anct"> 5 <div class="pps-r_middle-mrbtn prodRateShow"><a href="#">レビューを見る</a></div> 6 <div class="wpcr3_respond_3"> 7 <div class="wpcr3_button_1 wpcr3_show_btn pps-r_middle-wtbtn"><span>レビューを書く</span></div> 8 </div> 9 <div class="wpcr3_respond_2"> 10 <div class="wpcr3_div_2"> 11 <table class="wpcr3_table_2"> 12 <tbody> 13 <tr> 14 <td colspan="2"><div class="wpcr3_leave_text">レビューを書く</div></td></tr> 15 <tr class="wpcr3_review_form_text_field"> 16 <td><label for="wpcr3_fname" class="comment-field">レビューのタイトル: </label></td> 17 <td><input maxlength="150" class="text-input wpcr3_required" type="text" id="wpcr3_fname" name="wpcr3_fname" value="" /></td> 18 </tr> 19 <tr class="wpcr3_review_form_text_field"> 20 <td><label for="wpcr3_f1" class="comment-field">年代: </label></td> 21 <td><input maxlength="150" class="text-input " type="text" id="wpcr3_f1" name="wpcr3_f1" value="" /></td> 22 </tr> 23 <tr class="wpcr3_review_form_text_field"> 24 <td><label for="wpcr3_f2" class="comment-field">性別: </label></td> 25 <td><input maxlength="150" class="text-input " type="text" id="wpcr3_f2" name="wpcr3_f2" value="" /></td> 26 </tr> 27 <tr class="wpcr3_review_form_rating_field"> 28 <td><label for="id_wpcr3_frating" class="comment-field">評価:</label></td> 29 <td> 30 <div class="wpcr3_rating_stars"> 31 <div class="wpcr3_rating_style1"> 32 <div class="wpcr3_rating_style1_status"> 33 <div class="wpcr3_rating_style1_score"> 34 <div class="wpcr3_rating_style1_score1">1</div> 35 <div class="wpcr3_rating_style1_score2">2</div> 36 <div class="wpcr3_rating_style1_score3">3</div> 37 <div class="wpcr3_rating_style1_score4">4</div> 38 <div class="wpcr3_rating_style1_score5">5</div> 39 </div> 40 </div> 41 <div class="wpcr3_rating_style1_base wpcr3_hide"> 42 <div class="wpcr3_rating_style1_average" style="width:0%;"></div> 43 </div> 44 </div> 45 </div> 46 <input style="display:none;" type="hidden" class="wpcr3_required wpcr3_frating" id="id_wpcr3_frating" name="wpcr3_frating" /> 47 </td> 48 </tr> 49 <tr class="wpcr3_review_form_review_field_label"><td colspan="2"><label for="id_wpcr3_ftext" class="comment-field">レビュー内容:</label></td></tr> 50 <tr class="wpcr3_review_form_review_field_textarea"><td colspan="2"><textarea class="wpcr3_required wpcr3_ftext" id="id_wpcr3_ftext" name="wpcr3_ftext" rows="8" cols="50"></textarea></td></tr> 51 <tr><td colspan="2" class="wpcr3_check_confirm"> 52 <div class="wpcr3_clear"></div> 53 <input type="hidden" name="wpcr3_postid" value="176" /> 54 <input type="text" class="wpcr3_fakehide wpcr3_fake_website" name="website" /> 55 <input type="text" class="wpcr3_fakehide wpcr3_fake_url" name="url" /> 56 <input type="checkbox" class="wpcr3_fakehide wpcr3_fconfirm1" name="wpcr3_fconfirm1" value="1" /> 57 <label><input type="checkbox" name="wpcr3_fconfirm2" class="wpcr3_fconfirm2" value="1" />&nbsp;チェックを入れて投稿してください。</label> 58 <input type="checkbox" class="wpcr3_fakehide wpcr3_fconfirm3" name="wpcr3_fconfirm3" checked="checked" value="1" /> 59 </td></tr> 60 <tr><td colspan="2"> 61 <div class="wpcr3_button_1 wpcr3_submit_btn">送信</div>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; 62 <div class="wpcr3_button_1 wpcr3_cancel_btn">キャンセル</div></td> 63 </tr> 64 </tbody> 65 </table> 66

試したこと

checkedを外したりつけたりしましたが、あるなしに関わらず最後のデータが渡されます。
フォームをラジオボタンでなくセレクトフォームにすると、valueのデータ自体が渡されません。

動作を管理していると思われるwp-customer-reviews-3.phpのコードを変更すれば良いのかもしれませんが、PHPの専門的な知識がなく、どの部分を見て良いわからない状態です。

また、プラグイン内でProバージョンを推奨されるのですが、公式サイトを見るとProバージョンの開発は現在行っておらず、より発展的なカスタマイズの方法を探るも、フォームのスタイル変更について手掛かりになる方法を見つけられませんでした。

セレクトフォームやラジオボタンを使用できるようなプラグインを探したのですが、レビューに星でレーティングができるものが他に見つからず、このプラグインをカスタマイズして行きたいと思っています。

補足情報(FW/ツールのバージョンなど)

プラグインのバージョンは3.4.2です。

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

まだ回答がついていません

会員登録して回答してみよう

アカウントをお持ちの方は

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.48%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問