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

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

ただいまの
回答率

87.33%

【PHP】選択した内容に紐付いた画像(アイコン)を表示したいです。

解決済

回答 2

投稿 編集

  • 評価
  • クリップ 0
  • VIEW 952

score 12

 実現したいこと

WordPressのコメント欄で、閲覧者がコメントする際に男性女性を選んでコメントできるようにして、さらにその選ばれた項目によって、アイコンを表示したいです。

 現状

参考サイト
Wordpress コメント項目を追加する | webデザイナーの改造屋ブログ

wordpressの投稿に対するコメントのデフォルト項目は名前、メールアドレス、URL、コメント。そこに(例)男女選択項目を追加します。テーマフォルダの中のfunctions.phpにどんんどんコピペ。まずは入力項目欄。

add_filter( 'comment_form_defaults','change_comment_form_sex');
function change_comment_form_sex($default) {
    $commenter = wp_get_current_commenter();    
        $default['fields']['email'] .= '<p class="comment-form-author">' .
        '<label for="sex">'. __('性別') . ''</label>
        <select id="sex" class="sex" name="sex">
            <option value="">性別
            <option value="男性">男性
            <option value="女性">女性
        </select>
        </p>';
    return $default;
}

次に男女選択項目欄を入力必須にするためのコード

add_filter( 'preprocess_comment', 'verify_comment_meta_data_sex' );
function verify_comment_meta_data_sex($commentdata) {
  if ( ! isset( $_POST['sex'] ) )
        wp_die( __('Error: please fill the required field (sex).') );
        return $commentdata;
}

次にここで入力(選択)された情報をコメント情報と一緒にデータベースに登録するためのコード。データはテーブル「wp_postmeta」に入ります。

add_action( 'comment_post', 'save_comment_meta_data_sex' );
function save_comment_meta_data_sex( $comment_id ) {
    $sexies = explode(',', $_POST['sex']);
    foreach ($sexies as $sex)
        echo update_comment_meta( $comment_id, 'sex', $sex, true);
}

で最後に表示するためのコード

add_filter( 'get_comment_author_link', 'attach_sex_to_author' );
function attach_sex_to_author( $author ) {
  $sexies = get_comment_meta( get_comment_ID(), 'sex', false );
  if ( $sexies ) {
        foreach ($sexies as $sex)
          $author .= $sex . ' ';
    }
    return $author;
}

追加する項目が複数ある時はピンクやオレンジの名前を変えてね。

現状、上記のサイトを参考にコメント欄の「男性女性」の選択項目実装までは完了しています。
イメージ説明

ただ、上記のままだと男性を選んでコメントしても女性を選んでコメントしても、コメント欄にアイコンの表示はされません。

イメージ説明

男性を選んだ時は男性のアイコンを、女性が選ばれたときは女性のアイコンを表示させたいのですが、その画像(アイコン)のURLをどこにどのように記載すれば表示されるのかが分かりません。

どなたか分かる方がいれば、ご助言お願い致します。

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

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

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

    クリップを取り消します

  • 良い質問の評価を上げる

    以下のような質問は評価を上げましょう

    • 質問内容が明確
    • 自分も答えを知りたい
    • 質問者以外のユーザにも役立つ

    評価が高い質問は、TOPページの「注目」タブのフィードに表示されやすくなります。

    質問の評価を上げたことを取り消します

  • 評価を下げられる数の上限に達しました

    評価を下げることができません

    • 1日5回まで評価を下げられます
    • 1日に1ユーザに対して2回まで評価を下げられます

    質問の評価を下げる

    teratailでは下記のような質問を「具体的に困っていることがない質問」、「サイトポリシーに違反する質問」と定義し、推奨していません。

    • プログラミングに関係のない質問
    • やってほしいことだけを記載した丸投げの質問
    • 問題・課題が含まれていない質問
    • 意図的に内容が抹消された質問
    • 過去に投稿した質問と同じ内容の質問
    • 広告と受け取られるような投稿

    評価が下がると、TOPページの「アクティブ」「注目」タブのフィードに表示されにくくなります。

    質問の評価を下げたことを取り消します

    この機能は開放されていません

    評価を下げる条件を満たしてません

    評価を下げる理由を選択してください

    詳細な説明はこちら

    上記に当てはまらず、質問内容が明確になっていない質問には「情報の追加・修正依頼」機能からコメントをしてください。

    質問の評価を下げる機能の利用条件

    この機能を利用するためには、以下の事項を行う必要があります。

質問への追記・修正、ベストアンサー選択の依頼

  • 退会済みユーザー

    2018/09/27 03:18

    複数のユーザーから「やってほしいことだけを記載した丸投げの質問」という意見がありました
    「質問を編集する」ボタンから編集を行い、調査したこと・試したことを記入していただくと、回答が得られやすくなります。

回答 2

checkベストアンサー

+2

functions.phpに以下のコードを追記してみてください。
画像のURLはテスト用にYahooさんの画像を拝借していますのでご自身のものに置き換えてください。

add_filter('get_avatar_url', 'get_avatar_sex_url', 99, 3);
function get_avatar_sex_url($url, $id_or_email, $args) {
    if (have_comments()) {
        $sexies = get_comment_meta(get_comment_ID(), 'sex', false);
        if ($sexies) {
            foreach ($sexies as $sex) {
                if ($sex == '男性') {
                    return 'https://s.yimg.jp/c/icon/s/bsc/2.0/mail80.png';
                }
                if ($sex == '女性') {
                    return 'https://s.yimg.jp/c/icon/s/bsc/2.0/shopping80.png';
                }
            }
        }
    }
    return $url;
}

投稿

編集

  • 回答の評価を上げる

    以下のような回答は評価を上げましょう

    • 正しい回答
    • わかりやすい回答
    • ためになる回答

    評価が高い回答ほどページの上位に表示されます。

  • 回答の評価を下げる

    下記のような回答は推奨されていません。

    • 間違っている回答
    • 質問の回答になっていない投稿
    • スパムや攻撃的な表現を用いた投稿

    評価を下げる際はその理由を明確に伝え、適切な回答に修正してもらいましょう。

  • 2018/09/26 20:00

    無事、表示ができました!本当にありがとうございます!!

    最後に一つ質問なのですが、自分が参考にした「コメント項目を追加する」に載っているコード(質問に掲載済みのコード)をそのままコピペで貼り付けた状態で、名前を「テスト」と入力して、男性を選択してコメントすると、コメント者の名前が「テスト 男性」となっていまいます。

    おそらく選択した男性、女性の値が、入力した名前と一緒に表示する設定になっていると思われるのですが、どの部分のコードを消せば入力した名前のみを表示させることができるのでしょうか?

    画像表示に関しては、tabuu様のコードで問題なく表示ができました!
    ありがとうございました!!

    キャンセル

  • 2018/09/27 07:52

    以下のコードを削除すれば名前がそのまま表示されるはずです。

    add_filter( 'get_comment_author_link', 'attach_sex_to_author' );
    function attach_sex_to_author( $author ) {
    $sexies = get_comment_meta( get_comment_ID(), 'sex', false );
    if ( $sexies ) {
    foreach ($sexies as $sex)
    $author .= $sex . ' ';
    }
    return $author;
    }

    キャンセル

+2

docroot配下にindex.phpというファイルを作成していると
http://(設定したドメイン or IPアドレス)/index.php
docroot/index.phpにアクセスできると思います。

画像も同じ要領で
docroot/img/women.jpg
という様に配置すると
http://(設定したドメイン or IPアドレス)/img/women.jpg
でアクセスできる様になります。

あとはimgタグを使用して以下の様に指定すれば良いと思います。
<img src="http://(設定したドメイン or IPアドレス)/img/women.jpg">
women.jpgはphpの変数(例えば$file)で渡す様にして
"<img src="http://(設定したドメイン or IPアドレス)/img/".$file.">"
という風にすれば表示されると思います。($fileは男が選択された時はmen.jpg, 女が選択された時はwomen.jpg等にする)

投稿

編集

  • 回答の評価を上げる

    以下のような回答は評価を上げましょう

    • 正しい回答
    • わかりやすい回答
    • ためになる回答

    評価が高い回答ほどページの上位に表示されます。

  • 回答の評価を下げる

    下記のような回答は推奨されていません。

    • 間違っている回答
    • 質問の回答になっていない投稿
    • スパムや攻撃的な表現を用いた投稿

    評価を下げる際はその理由を明確に伝え、適切な回答に修正してもらいましょう。

  • 2018/09/26 01:46 編集

    無事、解決しました!
    ご助言ありがとうございました!!

    キャンセル

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

  • ただいまの回答率 87.33%
  • 質問をまとめることで、思考を整理して素早く解決
  • テンプレート機能で、簡単に質問をまとめられる

関連した質問

同じタグがついた質問を見る