Bagaimana cara mengubah opsi dialog editor gambar di WordPress?

8

Saya mencoba menyembunyikan tombol radio Alignment untuk gambar yang diunggah ke area konten posting, tetapi tidak tahu cara menambahkan CSS kustom atau file JS ke dialog Editor Gambar.

Saya telah berhasil menambahkan filter ke hook tindakan tiny_mce_before_init untuk menghapus tombol penyelarasan dari editor teks TinyMCE, tetapi tidak yakin bagaimana melakukan hal yang sama dengan editor gambar.

masukkan deskripsi gambar di sini

Saya sudah mencoba peretasan jQuery, tetapi sepertinya tidak perlu:

$('.mceWrapper iframe').load( function() {
    $(this).contents().find('tr.align').hide();
});

— pegangan tangan
sumber

IIRC bahwa iframe tidak memiliki jQuery di dalamnya, itu mungkin masalahnya.

— NoBugs

Karena ini adalah tinyMCE Plugin afaik tidak ada cara untuk memfilter output. Anda harus mengganti plugin (Plugin tinyMCE, bukan plugin WordPress itu) dengan yang kustom. Lihat posting serupa di stackoverflow: Menyesuaikan widget pengeditan gambar WP

— kraftner

Juga tampaknya sebagai tinyMCE-Plugin wpeditimage saat ini sedang dikerjakan dengan berat sehingga Anda mungkin ingin melihat perubahan yang tertunda di WordPress Make

— kraftner

2

Melihatnya secara terperinci tampaknya Anda tidak dapat mengubah editor gambar hanya dalam beberapa detail. Satu-satunya hal yang dapat Anda lakukan adalah mengganti editor gambar dengan salinan yang sedikit dimodifikasi. Saya akan segera menjelaskan bagaimana ini bisa dilakukan.

Tapi sebelumnya itu kata peringatan. Image Editor saat ini (2/2014) sedang dikerjakan, jadi solusi ini mungkin tidak akan berfungsi dari versi WordPress berikutnya tanpa modifikasi lebih lanjut.

Satu catatan terakhir: Akan lebih baik jika Anda memasukkan ini ke dalam Plugin dan bukan di tema Anda. Pokoknya, untuk mempersingkat jawaban ini saya menjelaskan bagaimana cara menempatkan ini di tema Anda.

1. Hapus Editor Gambar default

add_filter( 'tiny_mce_plugins', 'remove_wpeditimage', 10, 2 );

function remove_wpeditimage($plugins){
    if(($key = array_search('wpeditimage', $plugins)) !== false) {
        unset($plugins[$key]);
    }
    if(($key = array_search('teeny_mce_plugins', $plugins)) !== false) {
        unset($plugins[$key]);
    }
    return $plugins;
}

2. Salin dan ubah Editor Gambar

Salin wp-include / js / tinymce / plugins / wpeditimage ke folder tema Anda.

Ubah sesuai keinginan Anda. Cara termudah untuk menyingkirkan opsi penyelarasan adalah dengan mengubah jalur 55 dari

<tr class="align">

untuk

<tr class="align" style="display:none;">

3. Tambahkan Editor Gambar yang diubah

add_filter('mce_external_plugins', 'add_customized_wpeditimage');

function add_customized_wpeditimage($plugins) {
    $plugins[ 'wpeditimage' ] = get_template_directory_uri() . '/wpeditimage/editor_plugin.js';
    return $plugins;
}

— pembuat kraftner
sumber

-1

Fungsi yang Anda cari, untuk menambahkan CSS ke editor MCE disebut add_editor_style . Saya harus berusaha agar ini berhasil, tetapi peretasan cepat lima menit tidak berhasil untuk saya. Menurut kodeks itu adalah cara yang benar untuk melakukannya.

— BenFreke
sumber

-1

Anda bisa menyembunyikannya dengan CSS Anda. Jika tema Anda memiliki file css untuk dasbor admin Anda (untuk formulir khusus, dll) maka tambahkan saja ke file itu;

#img-edit tr.align { display:none; }

Jika tema Anda tidak memiliki file CSS untuk dasbor admin, maka Anda dapat menempatkan ini di functions.phpfile tema Anda sebagai gantinya;

add_action( 'admin_head', 'so4513579_hide-img-alignment' );

function so4513579_hide-img-alignment() {
    echo "<style> #img-edit tr.align { display:none; } </style>";
}

Perhatikan nilai penyelarasan akan tetap disimpan seperti apa pun sebelum diedit.

— Michael Ruta
sumber

Ini tidak berfungsi karena CSS tidak ditambahkan ke iframe dari wpeditimage tinyMCE-Plugin tetapi layar edit induk.

— kraftner