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

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

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

phpMyAdminはオープンソースで、PHPで書かれたウェブベースのMySQL管理ツールのことです。

WordPress

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

PHP

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

アップロード

アップロードは特定のファイルをウェブサーバに送るプロセスのことを指します。

データベース

データベースとは、データの集合体を指します。また、そのデータの集合体の共用を可能にするシステムの意味を含めます

Q&A

解決済

1回答

1392閲覧

自作したカスタムフィールドで画像アップロード時に意図しない挙動が起こる

ry0xi

総合スコア4

phpMyAdmin

phpMyAdminはオープンソースで、PHPで書かれたウェブベースのMySQL管理ツールのことです。

WordPress

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

PHP

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

アップロード

アップロードは特定のファイルをウェブサーバに送るプロセスのことを指します。

データベース

データベースとは、データの集合体を指します。また、そのデータの集合体の共用を可能にするシステムの意味を含めます

0グッド

0クリップ

投稿2021/05/10 06:28

編集2021/05/10 06:31

現状

WordPressのトップページに表示するスライドショーの画像とその説明文を後から変更できたらよいと考え、カスタムフィールドを使って対応することにしました。
https://qiita.com/awesam86/items/3ae93221077b8dd190dd やWordPressのCodexの関連する各関数のページを参考にし、

「画像1のファイル」
「画像1の説明文」
「画像2のファイル」
「画像2の説明文」



「画像6のファイル」
「画像6の説明文」

というようにTOPページに指定した固定ページのカスタムフィールド内に表示し、ファイルはファイルのアップロードを行うinputタグを、説明文はテキストの入力のinputタグを配置しています。

各データのkeyを以下のように設定しています。
画像1のファイル:'slideshow_img1_img'
画像1の説明文: 'slideshow_img1_desc'
画像6のファイル:'slideshow_img6_img'
画像6の説明文: 'slideshow_img6_desc'

起こった問題

・作成したカスタムフィールドで画像をアップロード、固定ページの更新を行った際、アップロードした画像はうまく保存され利用できるのですが、アップロードしていない画像の部分は謎の「05」というファイルが読み込まれます。
・データベースのwp_postmetaを確認すると、固定ページの更新時に毎回meta_keyが_wp_attached_file、meta_valueが2021/05/というデータが6つ追加されます。
・そのためメディアライブラリに毎回05というファイルが追加されてしまいます。

解決したいこと

上記の問題の原因と解決策を知りたいです。

ーーーーーーーーーーーーーーーーーーー

以下はfunction.phpでの記述です。
※問題とは関係ないですが、基本情報(key: 'basic_info_cf')という別のカスタムフィールドの作成、保存を同じ関数内で行っています。

php

1<?php 2 // カスタムフィールド ボックスを追加 3 function add_my_cf($post) { 4 $post_id = $post->ID; 5 if($post_id == get_option('page_on_front')) { 6 add_meta_box( 'basic_info', '基本情報', 'insert_basic_info_cf', 'page', 'normal', 'high'); 7 add_meta_box('slideshow_img', 'スライドショーで使う画像', 'insert_slideshow_img_cf', 'page', 'normal', 'high'); 8 } 9 } 10 add_action('add_meta_boxes_page', 'add_my_cf', 10, 2); 11 12 function custom_metabox_edit_form_tag(){ 13 echo ' enctype="multipart/form-data"'; 14 } 15 //画像をアップする場合は、multipart/form-dataの設定が必要なので、post_edit_form_tagをフックしてformタグに追加 16 add_action('post_edit_form_tag', 'custom_metabox_edit_form_tag'); 17 18 // カスタムフィールド:基本情報 の入力エリア 19 function insert_basic_info_cf() { 20 global $post; 21 // nonceフィールドを追加して後でチェックする 22 wp_nonce_field( 'save_my_cf', 'basic_info_cf_nonce' ); 23 24 echo '電話番号: <input type="text" name="basic_info_phone" id="basic_info_phone" value="'.get_post_meta($post->ID, 'basic_info_phone', true).'" size="50" /><br>'; 25 echo 'メールアドレス: <input type="text" name="basic_info_email" id="basic_info_email" value="'.get_post_meta($post->ID, 'basic_info_email', true).'" size="50" /><br>'; 26 echo '郵便番号: <input type="text" name="basic_info_postalcode" id="basic_info_postalcode" value="'.get_post_meta($post->ID, 'basic_info_postalcode', true).'" size="50" /><br>'; 27 echo '住所: <input type="text" name="basic_info_address" id="basic_info_address" value="'.get_post_meta($post->ID, 'basic_info_address', true).'" size="50" /><br>'; 28 echo '定休日: <input type="text" name="basic_info_holiday" id="basic_info_holiday" value="'.get_post_meta($post->ID, 'basic_info_holiday', true).'" size="50" /><br>'; 29 echo '開店時間: <input type="text" name="basic_info_open" id="basic_info_open" value="'.get_post_meta($post->ID, 'basic_info_open', true).'" size="50" /><br>'; 30 echo '閉店時間: <input type="text" name="basic_info_close" id="basic_info_close" value="'.get_post_meta($post->ID, 'basic_info_close', true).'" size="50" /><br>'; 31 echo '最終入店時間: <input type="text" name="basic_info_last_entering" id="basic_info_last_entering" value="'.get_post_meta($post->ID, 'basic_info_last_entering', true).'" size="50" /><br>'; 32 33 } 34 35 // カスタムフィールド:スライドショー画像の入力エリア 36 function insert_slideshow_img_cf() { 37 global $post; 38 39 // nonceフィールドを追加して後でチェックする 40 wp_nonce_field( 'save_my_cf', 'slideshow_img_cf_nonce' ); 41 42 for($i = 1; $i <= 6; $i++) { 43 echo '画像'.$i.'のファイル: <input type="file" name="slideshow_img'.$i.'_img" accept="image/*" /><br>'; 44 if(!empty(get_post_meta($post->ID, 'slideshow_img'.$i.'_img', true)) && strlen(get_post_meta($post->ID, 'slideshow_img'.$i.'_img', true)) > 0){ 45 //キーのpostmeta情報がある場合は、画像を表示 46 echo '<img style="width: 200px;display: block;margin: 1em;" src="'.wp_get_attachment_url(get_post_meta($post->ID, 'slideshow_img'.$i.'_img', true)).'">'; 47 } 48 echo '画像'.$i.'の説明文(最大100文字): <input type="text" name="slideshow_img'.$i.'_desc" id="slideshow_img'.$i.'_desc" value="'.get_post_meta($post->ID, 'slideshow_img'.$i.'_desc', true).'" size="100" /><br>'; 49 } 50 } 51 52 // カスタムフィールドの値を保存 53 function save_my_cf( $post_id ) { 54 // nonceがセットされているかどうか確認 55 $cf_nonces = ['basic_info_cf_nonce','slideshow_img_cf_nonce']; 56 foreach($cf_nonces as $cf_nonce) { 57 if ( ! isset( $_POST[$cf_nonce] ) ) { 58 return; 59 } 60 // nonceが正しいかどうか検証 61 if ( ! wp_verify_nonce( $_POST[$cf_nonce], 'save_my_cf' ) ) { 62 return; 63 } 64 } 65 66 // 自動保存の場合はなにもしない 67 if ( defined( 'DOING_AUTOSAVE' ) && DOING_AUTOSAVE ) { 68 return; 69 } 70 71 // ユーザー権限の確認 72 if ( isset( $_POST['post_type'] ) && 'page' == $_POST['post_type'] ) { 73 74 if ( ! current_user_can( 'edit_page', $post_id ) ) { 75 return; 76 } 77 78 } else { 79 80 if ( ! current_user_can( 'edit_post', $post_id ) ) { 81 return; 82 } 83 } 84 85 /* 安全が確認できたのでデータを保存する */ 86 87 // basic_info 88 $basic_info_cf_keys = ['basic_info_phone', 'basic_info_email', 'basic_info_postalcode', 'basic_info_address', 'basic_info_holiday', 'basic_info_open', 'basic_info_close', 'basic_info_last_entering']; 89 90 foreach($basic_info_cf_keys as $basic_info_cf_key) { 91 if(!empty($_POST[$basic_info_cf_key])) { 92 update_post_meta($post_id, $basic_info_cf_key, sanitize_text_field($_POST[$basic_info_cf_key])); 93 } else { 94 delete_post_meta($post_id, $basic_info_cf_key, get_post_meta($post_id, $basic_info_cf_key, true)); 95 } 96 } 97 98 // slideshow_img 99 // slideshow_img_img 100 $slideshow_img_img_cf_keys = []; 101 for($i = 1; $i <= 6; $i++) { 102 $slideshow_img_img_cf_keys[] = 'slideshow_img'.$i.'_img'; 103 } 104 foreach($slideshow_img_img_cf_keys as $slideshow_img_img_cf_key) { 105 106 if(!empty($_FILES[$slideshow_img_img_cf_key]) && $_FILES["slideshow_img".$i."_img"]["size"] !== 0){ 107 $file_name = basename($_FILES[$slideshow_img_img_cf_key]['name']); 108 $file_name = trim($file_name); 109 $file_name = str_replace(" ", "-", $file_name); 110 111 $wp_upload_dir = wp_upload_dir(); //現在のuploadディクレトリのパスとURLを入れた配列 112 $upload_file = $_FILES[$slideshow_img_img_cf_key]['tmp_name']; 113 $upload_path = $wp_upload_dir['path'].'/'.$file_name; //uploadsディレクトリ以下などに配置する場合は$wp_upload_dir['basedir']を利用する 114 //画像ファイルをuploadディクレトリに移動させる 115 move_uploaded_file($upload_file,$upload_path); 116 117 $file_type = $_FILES[$slideshow_img_img_cf_key]['type']; 118 //正規表現で拡張子なしのスラッグ名を生成 119 $slug_name = preg_replace('/.[^.]+$/', '', basename($upload_path)); 120 121 if(file_exists($upload_path)){ 122 //保存に成功してファイルが存在する場合は、wp_postsテーブルなどに情報を追加 123 $attachment = array( 124 'guid' => $wp_upload_dir['url'].'/'.basename($file_name), 125 'post_mime_type' => $file_type, 126 'post_title' => $slug_name, 127 'post_content' => '', 128 'post_status' => 'inherit' 129 ); 130 //添付ファイルを追加 131 $attach_id = wp_insert_attachment($attachment,$upload_path,$post_id); 132 if(!function_exists('wp_generate_attachment_metadata')){ 133 require_once(ABSPATH . "wp-admin" . '/includes/image.php'); 134 } 135 //添付ファイルのメタデータを生成し、wp_postsテーブルに情報を保存 136 $attach_data = wp_generate_attachment_metadata($attach_id,$upload_path); 137 wp_update_attachment_metadata($attach_id,$attach_data); 138 //wp_postmetaテーブルに画像のattachment_id(wp_postsテーブルのレコードのID)を保存 139 update_post_meta($post_id, $slideshow_img_img_cf_key,$attach_id); 140 }else{ 141 //保存失敗 142 echo '画像保存に失敗しました'; 143 exit; 144 } 145 } 146 147 } 148 149 150 // slideshow_img_desc 151 $slideshow_img_desc_cf_keys = []; 152 for($j = 1; $j <= 6; $j++) { 153 $slideshow_img_desc_cf_keys[] = 'slideshow_img'.$j.'_desc'; 154 } 155 foreach($slideshow_img_desc_cf_keys as $slideshow_img_desc_cf_key) { 156 if(!empty($_POST[$slideshow_img_desc_cf_key])) { 157 update_post_meta($post_id, $slideshow_img_desc_cf_key, sanitize_text_field($_POST[$slideshow_img_desc_cf_key])); 158 } else { 159 delete_post_meta($post_id, $slideshow_img_desc_cf_key, get_post_meta($post_id, $slideshow_img_desc_cf_key, true)); 160 } 161 } 162 } 163 add_action('save_post', 'save_my_cf'); 164?>

原因と考えていること

・画像の説明文や基本情報の値など、textの保存は問題なかったので、
save_my_cf()関数内の画像を保存する部分に何らかの原因があるとみています。

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

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

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

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

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

guest

回答1

0

自己解決

各inputタグに対して別々のformタグで囲っていたのが問題でした。
全体を一つのタグで囲った際に解決しました。

投稿2021/06/20 06:26

ry0xi

総合スコア4

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

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

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

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

ただいまの回答率
85.48%

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

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

質問する

関連した質問