こんにちは

過去に、似た問題ありましたのでご紹介させていただきます。

https://connect-cms.jp/plugin/bbses/show/106/233/57#frame-233

　
［参照］ボタンの右下の角（かど）をタップすると成功しやすく感じました。
理由は分かりません。

－－－　－－－　－－－
　
【環境】

・iPhone SE： iOS14.5（最新）
・ブラウザ ： safari 
　
　
【再現】

1.  スマートフォンから wysiwyg の［画像の挿入・編集］ボタンを押す
2. ［アップロード］タブを開き、［画像を参照］ボタンを押す
3.  その際、［画像を参照］の右下を押すようにねらう
4.  （以下略→）画像ファイルを選び、アップロードする

－－－　－－－　－－－

－－－

htmlファイル内の<button>と<input type="file">に関わるソースコードを見れば、
分かる人は分かるのかもしれません。
　

お世話になります。

アドバイスありがとうございます。

私のスマホはアンドロイドなのですが、ボタンは全く反応しません。

改善されたらまたお知らせください。

mipo 様、
有効でない方法を提示してしまい、失礼しました。

－－－

調べてみたところ、この［画像の参照］ボタンは
「［画像を参照］の文字とボタン領域を担当する〈button〉タグ」（タップに反応しない）と、
「ファイル選択の機能を付与する〈input type="file"〉タグ」（タップに反応する）が
同じサイズで重なって作られており、
タップに反応しない方が上にあるため、ファイルを選択できないのだろうと思われます（たぶん）。

　→ パソコンだと問題なく反応するので、不思議ですね。
　

　
－－－

Google Chromeの「開発者ツール」を使って細々と検討してみましたが、
z-index を使って順番を入れ替える方法などはうまくいきませんでした。
　

結果、このサイトが示すように、label要素でボタンの見映えを作る方法ならば
ユーザーの操作感覚に近いのではないかと思いました。

サンプルページに［画像を選択］ボタンを用意しましたので、
android スマホからボタンを押せるかを試してもらえないでしょうか？
（→ ボタンだけであり、実際にファイルの受け取り機能は付いていません）

－－－

結果が分かったからどうということはないのですが、
androidを持っていないため、試していただけると嬉しいです。
よろしくお願いします。

こんにちは

andoroidスマホで、試してみました。

「画像参照ボタン」をクリックして、画像選択、迄できました。
（使用スマホは、AQUOS sense3 lite　 OSはandoroid10）

ありがとうございます。確かに写真がでてきました。うれしいです。

ただ、自分のサイトでどうすればよいのかわからないので、またご教授ください。

mipo 様、dreamer 様、ご確認ありがとうございます。
androidのスマホからでも「ファイル投稿ボタン」を押す方法があることが分かりました。

今回の実験のポイントは「ボタンの作り方の差異」ですから、
開発者様にボタン周りの改修の検討していただくほかありません。
（ただし、現行の作りもそれ相応の理由があってのことと理解すべき）

したがって、「自分のサイトでどうすれば」については、
「期待して待つ」ぐらいが関の山です。

お手数をいただきながら、至らぬ回答ですみません。
　

皆様

こんにちは。
株式会社オープンソース・ワークショップの永原です。

様々な調査や試行、ありがとうございます。
参考にさせていただきながら、当社でも、だいぶ力を入れて調査中です。
この件、優先度を上げていますので、もう少しお待ちください。

いまのWYSIWYG機能を改修して何とかできないかと、だいぶ頑張ってみましたが、iPhoneもAndroidもうまくいく方法に行きついていないのです。
そこで、対応としては、今使っているWYSIWYGの部品を大きくバージョンアップすることになりそうです。
そのため、作り直さなきゃいけない部分がそこそこあって、現在、対応中です。

ということで、状況報告をさせていただきました。

皆さん、こんにちは。
オープンソース・ワークショップの牟田口です。

WYSIWYGの部品を大きくバージョンアップ対応ができましたので、まずはこの公式サイトに適用してみました。

スマホから画像がアップできるか等お試しいただければと思います。

また、ブラウザのキャッシュが悪さをして新しいWYSIWYGが動かない事があります。
その時はブラウザのキャッシュをクリアしてご確認ください。

ネットで「ブラウザキャッシュクリア」を検索すると、色々記事が出てきます。
参考に下記記事がありました。

ブラウザのキャッシュをクリア方法
https://mag.app-liv.jp/archive/126597/

（参考程度）WYSIWYGのバージョンアップ対応の詳細は下記です。
https://github.com/opensource-workshop/connect-cms/issues/843#issuecomment-840963747

スマホで縦長の写真撮ってテストしてみます。

横の写真

撮ったあと、画像編集で、回転させました。

iPhoneでも動作確認しました。

キャッシュクリア前は、以下のエラーが出ます。

キャッシュをクリアすると、エラーが消えます。

※上記までは、スマホで入力しました。
　画像も無事アップできる事を確認しました。

スマホも、iphoneとandoroidでは動きが違うみたいですね、
私のandoroidスマホ　aquos sense lite3 では、「画像を参照」ボタンをクリックしても、反応しないみたいです。
（最新にアップデート、chromeキャッシュクリアしてます）

こんばんは、牟田口です。

なんでしょうね？

公式サイトで画像アップを試されました？

公式サイトは先行して、新しいウィジウィグにしましたが、まだgithubの最新には反映してないんです。

公式サイトでAndroid9 rakuten mini(c330)からは画像アップできました。

あ、そうなんですね、git hubからアップロードして、試していました。
公式サイトでは、ＯＫ、でした。スイマセン、、。

お世話になります。

私も公式サイトのお試しボタンでは、写真を選ぶことができました。

connectCMSでは、できるようになるのでしょうか？

> mipoさん

はい、今後Connect-CMSで出来るようになります。

今週中（5/17-21）にはGithubに反映できるかなと思います。

> dreamerさん

いえいえ、公式サイトで出来るともうGithubで公開されてると思っちゃいますよね。

今回初の試みで、公式サイトで先行リリースさせてもらったんです。

皆さん、ご確認ありがとうございました。

iPhoneとandroidどちらも問題ない事がわかり、助かりました。

Githubへの反映まで、もう少々おまちください。

皆さんのご協力、大変ありがとうございました。
細かい不具合を修正して、Githubへ新しいウィジウィグ対応を反映しました。

また、ブラウザキャッシュをクリアしなくても、新しいウィジウィグが使えるように対応しました。（Javascriptライブラリのクエリストリングの追加対応）

最新版にアップデートする事で、新しいウィジウィグが利用でき、スマホから簡単に写真投稿できるようになります。

ありがとうございました。

androidから画像がアップできました。とても使いやすくなり、大変感謝しています。