Gutenberg: Pertimbangkan untuk menambahkan cara untuk menautkan ke file dari penyisip tautan sehingga seseorang dapat mengunggah file PDF dan menautkannya ke teks

Dibuat pada 31 Jul 2018  ·  37Komentar  ·  Sumber: WordPress/gutenberg

Saya minta maaf atas pertanyaan itu, tetapi saya memposting di sini karena saya yakin ini adalah masalah UX dengan Gutenberg yang dapat ditingkatkan.

Di editor WordPress klasik, tombol "Tambah Media" memungkinkan Anda mengunggah file dengan mudah ke perpustakaan media tanpa meninggalkan halaman. Ini memungkinkan pengunggahan sesuatu seperti file PDF dengan mudah, yang kemudian dapat Anda lampirkan ke beberapa teks seperti Click here to download this PDF .

Saya tahu ada blok terpisah/khusus untuk jenis hal ini, tetapi bagaimana jika saya lebih suka memiliki teks _inside_ jenis blok paragraf?

Saya melihat 2 kemungkinan cara saat ini, tidak ada yang sangat ramah pengguna atau jelas:

  1. Saya dapat meninggalkan halaman sepenuhnya, menavigasi ke halaman "Perpustakaan Media", mengunggah gambar, menyalin URL, menavigasi kembali ke editor Gutenberg, pilih teks di blok paragraf saya, klik ikon rantai, lalu tempel URL.

  2. Saya dapat menambahkan blok "File", mengunggah PDF, menyalin URL, menghapus blok file, memilih teks di blok paragraf saya, mengklik ikon rantai, dan menempelkan URL.

Usul:
Tambahkan tombol "Tambah Media" sebagai opsi untuk kontrol blok paragraf:

add-media-button-gutenberg

Needs Dev [Feature] UI Components [Type] Enhancement

Komentar yang paling membantu

Saya setuju bahwa menutup masalah ini tampaknya terlalu dini. Tidak ada yang diperbaiki, dan masalahnya masih ada.

Semua 37 komentar

Setuju bahwa ini adalah pengalaman yang kurang optimal saat ini. Saya perhatikan ini saat mengerjakan #8295 tetapi saya menduga bahwa hal semacam ini mungkin lebih baik diselesaikan dengan blok inline/bersarang, setelah itu menjadi lebih dari A Thing.

Solusi lain yang mungkin adalah mengizinkan media pencarian, seperti PDF, sebagai opsi di bilah alat tautan mengambang. Untuk referensi, berikut adalah tangkapan layar yang menunjukkan bagaimana hasil pencarian saat ini terlihat di bilah alat itu:

screen shot 2018-07-31 at tue jul 31 11 56 58 am
Dilihat di http://alittletestblog.com/wp-admin/post.php?post=14091&action=edit menggunakan Firefox 61.0.1 di macOS 10.13.6.

Saya pikir itu mungkin solusi yang lebih baik (daripada blok file sebaris, yang mungkin tidak mencapai hal yang sama), tetapi itu memerlukan beberapa penyesuaian pada UI untuk memperhitungkannya. Anda mungkin juga ingin mengizinkan unggahan secara langsung, daripada harus beralih ke perpustakaan media untuk mengunggah file, lalu beralih kembali ke Gutenberg. (Dan untuk kesetaraan dengan editor klasik!)

Meskipun merupakan ide bagus untuk memungkinkan pencarian media, ini memperkenalkan UI baru untuk menjelajahi media, yang menduplikasi fungsi yang sudah ada dengan pengunggah/browser media. Itu juga tidak akan memungkinkan Anda untuk mengunggah tanpa meninggalkan editor gutenberg, benar?

@designsimply Itu tidak menyelesaikan masalah tidak dapat mengunggah file. Memiliki tombol _Add Media_ pada toolbar TinyMCE yang ada jauh lebih fleksibel. Jauh lebih mudah (dan lebih intuitif) menambahkan gambar sebaris, daripada dipaksa untuk menyisipkan Blok _Gambar Sebaris_. Ini juga memungkinkan Anda untuk dengan mudah mengunggah dan menautkan ke file seperti file PDF atau DOCX, tanpa harus mengganggu pengalaman mengedit Anda dengan keluar dari editor, membuka perpustakaan media, mengunggah file, dan akhirnya kembali ke editor lagi.

Hanya mencatat ada beberapa diskusi tambahan di #10280.

Saya pikir ini juga bisa menjadi kasus penggunaan yang menarik untuk API pemformatan teks kaya sehingga ditangani dengan cara yang mirip dengan gambar sebaris.

Jadi cara melakukannya sekarang adalah dengan menggunakan blok file, atau cukup drag dan drop PDF untuk mengunggahnya. Ini menghasilkan hal berikut:

screenshot 2018-10-11 at 12 31 28

Anda kemudian dapat mengklik tombol "salin URL", dan tempel tautan yang dihasilkan di atas teks:

screenshot 2018-10-11 at 12 31 42

Ini adalah bagaimana hal itu dilakukan hari ini.

Tapi saya setuju aliran ini tidak ideal, dan bisa dioptimalkan. Jadi memberi label seperti itu.

Akan menutup ini karena ada blok untuk File dan Anda dapat mengambil URL darinya. Di masa mendatang, alangkah baiknya untuk memperluas alat "Tautan" untuk juga mencari file, media, dll, untuk ditautkan secara langsung.

@mtias saya agak bingung. Apa artinya menutup masalah ini bagi Anda? Apakah itu berarti bahwa itu sedang dipertaruhkan untuk rilis di masa mendatang? Ataukah niatnya hilang dari arsip isu-isu yang tertutup dan terlupakan, atau semoga ada yang mengungkitnya lagi di kemudian hari? Saya hanya ingin tahu apa maksud dari menutup masalah ini, karena Anda sendiri setuju bahwa itu adalah masalah yang valid.

Harap dicatat bahwa saya berbicara tentang blok file ketika saya membuka masalah ini. Tujuan dari masalah ini adalah untuk menguraikan masalah kegunaan dengan alur unggah file saat ini, dan bahwa Blok File tidak cukup untuk pengalaman yang ramah pengguna.

Saya setuju bahwa menutup masalah ini tampaknya terlalu dini. Tidak ada yang diperbaiki, dan masalahnya masih ada.

@mtias bisakah Anda membuka kembali masalah ini? Semua orang mengakui ini adalah solusi peretasan, dan Anda mengatakan akan menyenangkan untuk memiliki perbaikan yang sah di masa depan. Ini sepertinya tempat terbaik untuk melacak masalah ini untuk masa depan itu karena didokumentasikan dengan baik di sini dan tidak memerlukan upaya duplikat untuk mendokumentasikannya lagi.

Saya harus setuju, ini membutuhkan solusi yang lebih baik. Saya sebenarnya harus menemukan utas ini sebelum saya tahu cara mengunggah PDF dan menautkannya.

Saya akan membuka kembali ini dan menandainya untuk 5.1.

Memerlukan pembuatan blok sementara hanya untuk menyalin url file dan menempelkannya ke tautan adalah langkah mundur yang cukup buruk dari editor lama untuk apa yang merupakan kasus penggunaan yang sangat umum—hanya menautkan ke dokumen sebaris.

Saya pikir jika kami memiliki peningkatan yang kami tahu ingin kami tangani di masa depan, tetapi tidak tahu kapan, maka kami harus tetap membukanya dan mungkin menetapkan beberapa tonggak masa depan yang tidak pasti. Beginilah cara kami menanganinya di Trac, jadi saya pikir kami harus melanjutkannya di sini. Masalah penutup membuat mereka sangat sulit untuk ditemukan dan muncul di kemudian hari.

@mintplugins maaf saya melewatkan ping Anda di sini sebelumnya. Kedengarannya bagus bagi saya untuk menjaga ini tetap terbuka dan menetapkan tonggak sejarah di masa depan. Jika ada ide lain tentang cara menangani ini, silakan bagikan.

Pencarian tekstual seperti halaman dan posting akan membantu, tetapi mungkin tidak cukup, karena nama file (tanpa pratinjau di mediathek) tidak selalu benar-benar jelas DAN solusi masa depan harus memiliki kekuatan yang sama dengan yang klasik dan memungkinkan penautan teks dari SEMUA jenis filter di mediathek (dengan pratinjau untuk dipilih).
Jadi kami membutuhkan solusi tombol yang mengarah ke mediathek.

Saya melihat 2 opsi:
a) Tombol bilah alat (seperti yang disarankan oleh plugin mint di awal)
b) tombol tambahan hanya di link-enterform (di tempatnya)

Ini adalah masalah pertama yang saya ajukan kepada saya oleh seseorang yang menggunakan Gutenberg dan saya perlu menemukan posting ini untuk mengetahui bagaimana Anda saat ini dimaksudkan untuk melakukannya, yang merupakan solusi yang sangat sub-optimal.

Saya pikir kedua saran itu diperlukan. Anda harus dapat mencari item media yang ada dari opsi "tautan" serta memiliki opsi untuk mengunggah tautan baru.

Juga, akan menyenangkan untuk dapat memilih beberapa teks dan kemudian menarik dan melepaskan file ke halaman dan secara otomatis mengunggah file itu ke perpustakaan media dan menautkan teks yang dipilih, alih-alih memasukkan blok file.

Apakah mungkin untuk memiliki tombol Pustaka Media dalam dialog Tautan baru, di mana jika Anda memilih item media daripada menyematkannya, ia menambahkan tautan ke file, atau tautan ke halaman lampiran?

Bagaimana kalau hanya mengeluarkan panel opsi tautan untuk menyertakan opsi untuk mengunggah media baru atau tautan ke media yang ada? Tombol Unggah juga dapat menerima penurunan.

wp-media-link

Mulai dari solusi @EricDu , ini bisa menjadi solusi lain (dan lebih ringkas).
Tombol unggah tidak ada tetapi UI lebih bersih dan sederhana. Bagaimanapun, pengguna selalu dapat mengunggah file saat dalam modal media.

block-url-with-file-selection

di manamedia-lib-icon tombol ikon akan membuka popup modal media.

@virgo79 , Anda masih memerlukan ikon "..." untuk memicu drop-down (yang saat ini hanya menampilkan opsi "Buka di Tab Baru" tetapi, jika terbuka untuk plugin, dapat memiliki opsi tambahan seperti kelas, id , dll.

Saya tidak yakin berapa banyak lapisan yang bersedia diterima oleh pengguna modals. Dan metodenya harus semirip mungkin dengan contoh lain di mana Anda menambahkan media.

Preferensi saya adalah menjaga tampilan default seminimal mungkin (tempel atau ketik, terapkan ikon, lebih banyak ikon) dan letakkan opsi yang lebih jarang digunakan (target, media, kelas, id, dll.) di drop-down.

@virgo79 dan @EricDu Saya tidak yakin hanya ikon "media" yang jelas bagi pengguna "standar" tentang artinya. Sebagian besar pengguna pemuatan konten sehari-hari kami yang normal, tidak akan langsung mengerti bahwa ikon kamera/musik berarti mereka dapat mengunggah PDF dan menautkannya. Saya pikir jika itu hanya sebuah ikon, itu perlu sesuatu yang lebih eksplisit tentang "unggah" atau memiliki tombol teks yang jelas seperti yang disarankan Eric. Solusinya perlu menyeimbangkan UI yang bersih dengan UI yang jelas.

@EricDu Saya setuju dengan pertimbangan Anda.
Jika kita dapat memiliki lebih dari satu opsi 'buka di tab baru', kita masih memerlukan tombol '...' yang akan memicu dropdown.
Tetapi dari sudut pandang saya, pemilih media harus tetap menjadi tindakan tingkat pertama, dan tidak boleh digabungkan dengan opsi sekunder seperti target, kelas, id, dll.
Munculan "buat tautan" sangat ringkas di sini dan untuk menjalankan semuanya dengan sangat bersih, saya tidak dapat membayangkan solusi yang lebih baik daripada menggunakan ikon media untuk membuka modal media.

@andrew-dixon ikon media telah menjadi representasi resmi perpustakaan media selama bertahun-tahun. Saya tidak berpikir ini akan menjadi masalah nyata bagi pengguna.
Tetapi saya setuju bahwa ikon saat ini (kamera/musik) tidak mewakili "tautan umum ke file" atau Perpustakaan Media.

Ini adalah versi terbaru dari solusi yang diusulkan sebelumnya:

block-url-with-file-selection-and-more

Klip kertas adalah ikon "lampiran" serba guna, yang umumnya mencakup kata kerja/tindakan dari konten relatif, dan juga kata benda/item dari konten tersebut.

Yang mengatakan, saya pikir memasukkan tautan dan memasukkan tautan ke lampiran adalah operasi yang agak unik dengan hasil akhir yang berbeda, dan perlu diperlakukan secara terpisah seperti itu.

@virgo79 , saya tidak punya masalah menjadikannya tindakan utama. Fakta bahwa itu bahkan bukan pilihan sekarang, sepertinya itu bukan prioritas bagi semua orang yang terlibat dalam pengembangan dan pengujian beta. Saya ingin opsi ada di sana tetapi saya tidak terlalu peduli ikon mana yang harus saya tekan untuk sampai ke sana.

@JJJ , ketika saya memulai tata letak, saya mencoba mencari cara untuk merepresentasikan Media sebelum saya ingat bahwa sudah ada ikon Media! Ikon yang digunakan di sini harus konsisten dengan ikon Media yang digunakan di tempat lain di WordPress.
Saya merasa memisahkan fungsi ini dari fungsi tautan akan lebih membingungkan, karena pengguna mungkin mengharapkan media yang sebenarnya dimasukkan ke dalam halaman alih-alih tautan ke media tersebut.

@virgo79

representasi resmi dari perpustakaan media selama bertahun-tahun. Saya tidak berpikir ini akan menjadi masalah nyata bagi pengguna.

Saya mengerti apa yang Anda katakan, tetapi dari pengalaman saya bekerja dengan banyak pengguna yang memasukkan konten dan tidak memiliki kontak lain dengan WP, mereka tidak akan mengenali ikon itu sebagai cara untuk menautkan ke file seperti PDF. Anda mengatakan Anda tidak berpikir itu "akan menjadi masalah nyata bagi pengguna", tetapi percayalah, itu 100%. Misalnya, kami bekerja dengan banyak sekolah dan dari waktu ke waktu seseorang di kantor sekolah harus memperbarui konten di situs web mereka dan mereka tidak akan tahu bahwa ikon itu akan menautkan ke file, percayalah.

@andrew-dixon, diskusi ikon media harus benar-benar menjadi diskusi terpisah. Kata "media" itu sendiri menyiratkan gambar, suara, dan video, sementara dalam praktiknya kita berurusan dengan "unggahan".

Saya tidak memiliki statistik untuk mendukung saya, tetapi saya yakin sebagian besar unggahan adalah gambar, diikuti oleh PDF dan file lain yang dapat diunduh, dan bahwa file video dan audio disematkan dari situs streaming tanpa melalui folder unggahan.

Jadi kita terjebak dengan nama dan ikon yang sesuai tahun lalu (ketika WordPress hanya platform blogging) tetapi tidak mewakili penggunaan hari ini. Mengubah nama sekarang dapat membantu pengguna baru tetapi membingungkan pengguna yang sudah ada. Namun, ikon dapat diperbarui.

@EricDu Setuju bahwa ikon adalah masalah yang terpisah, tetapi gagasan untuk menggunakan hanya sebuah ikon adalah masalah yang lebih saya ungkapkan, mock-up asli Anda, sementara kurang "bersih", jauh lebih jelas dari titik kegunaan- melihat.

@andrew-dixon, saya tidak akan berdebat dengan Anda untuk mendukung ide awal saya ;-)

Untuk memperjelas, cara UI pertama kali muncul akan sama persis seperti saat ini (bersih dan dasar). Hanya drop-down yang memiliki lebih banyak opsi.
wp-media-link-2

Akan selalu ada argumen tentang fitur mana yang harus di depan dan di tengah (membuat UI lebih kompleks) dan mana yang harus sedikit disembunyikan. Inilah gunanya diskusi umpan balik Desain. Saya lebih suka menyimpannya di dropdown karena membuat UI tetap sederhana dan membutuhkan jumlah klik yang sama persis untuk menambahkan tautan seperti yang dilakukan tombol terpisah.

Arah potensial lainnya: Menggunakan perawatan dari pengaturan sidebar gambar unggulan:

file

Bidang ini memungkinkan Anda untuk: menyeret & meletakkan sesuatu, atau mengeklik untuk membuka perpustakaan media. Dari sana, Anda dapat mengunggah atau memilih item yang ada.

Satu pertanyaan yang saya miliki (untuk semua opsi ini): Setelah Anda memilih item... akankah kami menampilkannya di sini?

frame

Pemikiran umum lainnya di sini (mungkin di luar cakupan perubahan ini):

Menggunakan tombol elipsis di sini tampaknya sedikit tidak terduga. Secara tradisional, kami menggunakan tombol elipsis untuk memperluas menu ( lihat bilah alat blok dan bilah alat atas misalnya ), bukan untuk menampilkan/menyembunyikan panel. Indikator terdekat lainnya yang kami miliki saat ini adalah roda penggerak untuk menampilkan/menyembunyikan bilah sisi, tetapi saya pikir itu juga sedikit membingungkan.

Saya ingin tahu apakah perawatan di sepanjang garis ini lebih masuk akal dalam kasus ini:

Luaskan/Ciutkan Panel (Diciutkan secara default)
frame


Mengganti elipsis dengan chevron bawah
frame2

@kjellr Semua opsi ini adalah peningkatan pada elipsis, imo – bagus sekali! Sejujurnya saya menyukai kedua variasi, terutama seperti pemikiran Anda tentang opsi pertama karena meskipun membutuhkan lebih banyak real estat, itu lebih jelas.

Jika kita menggunakan pendekatan kedua untuk kesederhanaan (mengingat opsi ini tidak memindahkan penempatan, hanya ikon), saya akan mengusulkan agar kita menambahkan pembagi antara ikon enter dan tombol tarik-turun/atas untuk menambahkan sedikit pemisahan visual dan konsistensi dengan toolbar lainnya. Contoh:

screen shot 2019-02-18 at 12 06 31 pm

(mungkin perlu beberapa penyesuaian padding, tetapi Anda mendapatkan idenya )

Panggilan yang baik, @iamthomasbishop. Komp yang diperbarui:

frame

Saya suka itu. Ini memiliki fungsi yang sama dengan proposal awal saya tetapi zona penurunan yang lebih besar.

Untuk tombol drop-down, saya akan mengikuti apa yang digunakan di tempat lain di Gutenberg (agar tidak menemukan kembali roda). Panah lebih intuitif daripada elipsis.

Akhirnya, ada masalah penamaan. Apakah kita perlu menyebutkan kata "media" agar pengguna menyadari bahwa kita terikat dengan perpustakaan media? Ada juga orang yang berpikir "file" berarti dokumen PDF atau MS Word, dan tidak menyadari bahwa foto juga file. Berapa banyak yang kita butuhkan untuk memenuhi common denominator terendah?

Mungkin hanya menambahkan ikon Media sebelum "Tertaut ke file" sudah cukup untuk memperjelas.

Untuk referensi di masa mendatang: https://core.trac.wordpress.org/ticket/43151 , kita harus memastikan dropzone adalah tombol bergaya, bukan div yang dapat diklik.

Sepertinya kami mendapat arahan yang kuat dari maket terakhir @kjellr . Saya menjatuhkan "Memerlukan Umpan Balik Desain" dan menambahkan "Memerlukan Pengembang."

~Aku akan memeriksa ini!~ edit: j/k, aku ditarik ke sesuatu yang lain

Idealnya kita harus menggunakan komponen yang sama untuk _Featured Image_ dan _Link to a file_.

Apakah halaman ini membantu?
0 / 5 - 0 peringkat