it-swarm.com.de

Hinzufügen eines Zeichenzählers zur Auszugsmetabox

Wir versuchen, einen geänderten von diesem (sehr beliebten) Code in einem Plugin für benutzerdefinierte Funktionen anzuwenden. Es wurde sogar beim Stackoverflow erwähnt, aber die gesamte Frage wurde gelöscht, da der Benutzer, der sie gestellt hat, entfernt wurde. Hier ist eine zwischengespeicherte Google-Version . Eng modifizierter Code ist noch vorhanden.

Dies ist der geänderte Code:

// Add Character Counter to the Excerpt Meta Box
function excerpt_count_js(){
  if ('page' != get_post_type()) {

      echo '<script>jQuery(document).ready(function(){
jQuery("#postexcerpt .handlediv").after("<div style=\"position:absolute;top:5px;right:80px;color:#666;\"><small>Excerpt length: </small><input type=\"text\" value=\"0\" maxlength=\"3\" size=\"3\" id=\"excerpt_counter\" readonly=\"\" style=\"background:#fff;\"> <small>character(s). (128 Characters MAX)</small></div>");
     jQuery("#excerpt_counter").val(jQuery("#excerpt").val().length);
     jQuery("#excerpt").keyup( function() {
     jQuery("#excerpt_counter").val(jQuery("#excerpt").val().length);
     if ( jQuery("#excerpt_counter").val() >= 129 ) {
        jQuery("#excerpt_counter").css("color","red");
     } else {
        jQuery("#excerpt_counter").css("color","green");
     }
   });
});</script>';
}
}
add_action( 'admin_head-post.php', 'excerpt_count_js');
add_action( 'admin_head-post-new.php', 'excerpt_count_js');

Es funktioniert gut in der Meta-Box des Ausschnitts und führt zu den erwarteten Ergebnissen.

Aber es verursacht mehrere Probleme auf dem Bildschirm Edit Media. Es ist zwar so codiert, dass nur if ('page' != get_post_type()) und admin_head-post.php oder admin_head-post-new.php geladen werden.
Diese Probleme sind:

  • die Schaltflächen Help und Screen Options können nicht mehr angeklickt werden.
  • der Hover Effect funktioniert nicht in der Admin-Seitenleiste
  • der Description buttons (like b+i+img etc.) einfach verschwinden.

Wir haben das Original sowie andere modifizierte Versionen des Skripts ohne Erfolg ausprobiert.

Ähnliche Fragen wurden gestellt hier und hier scheinbar mit der gleichen jQuery-Codierung. Dennoch hat niemand Probleme gemeldet. Sind es nur wir

BEARBEITEN:

Da Sie gefragt haben, sind die Fehler:

Uncaught TypeError: Cannot read property 'length' of undefined
Uncaught TypeError: Cannot read property 'hasClass' of undefined

1
marikamitsos

Ok, also hat mir die Art und Weise, wie sie geschrieben wurde, nicht gefallen, also habe ich sie leicht mit anderer Syntax und besser lesbarer Struktur umgeschrieben.

<?php 
// Add Character Counter to the Excerpt Meta Box
function excerpt_count_js(){
    if ('page' != get_post_type()) { ?>
        <script>

        (function($){

            $(document).ready(function(){

                if ( $('#postexcerpt').length ) {

                    var maxChar = 128;

                    $excerpt = $('#excerpt');

                    $("#postexcerpt .handlediv").after( '<div style="position:absolute;top:5px;right:80px;color:#666;">' +
                                                            '<small>Excerpt length: </small>' +
                                                            '<input type="text" value="0" maxlength="3" size="3" id="excerpt_counter" readonly="" style="background:#fff;" /> ' +
                                                            '<small>character(s). (' + maxChar + ' Characters MAX)</small>' +
                                                        '</div>'
                                                    );

                    $excerptCounter = $("#excerpt_counter");

                    $excerptCounter.val( $excerpt.val().length );

                    $excerpt.keyup( function() {

                        $excerptCounter.val( $excerpt.val().length );

                        var exColor = ( ( $excerptCounter.val() > maxChar ) ? 'red' : 'green' );

                        $excerptCounter.css( 'color', exColor );

                    });

                }

            });

         })(jQuery);

        </script>
    <?php }
}
add_action( 'admin_head-post.php', 'excerpt_count_js');
add_action( 'admin_head-post-new.php', 'excerpt_count_js');
?>

Es wurde nicht überprüft, ob #postexcerpt überhaupt auf der Seite vorhanden war, also habe ich das hinzugefügt und versucht, es zu bereinigen und das Verständnis und die Änderung zu erleichtern. Ich bin kein Fan von Inline-Styling, aber na ja.

Wie auch immer, ich habe dies auf einer sauberen 4.6.1-Installation mit 2016 installiert getestet und es hat einwandfrei funktioniert. Lassen Sie mich wissen, wenn dies bei Ihnen nicht funktioniert.

4
socki03