admin管理员组文章数量:1122832
Custom quicktags not working after Wordpress 6.0
wp 5.8.x/5.9.x: working -- wp 6.0: not working
Buttons are not showing here: .jpg
Console error: Uncaught ReferenceError: QTags is not defined
I am using this code.
function my_quicktags() {
if ( wp_script_is( 'quicktags' ) ) {
?>
<script type="text/javascript">
QTags.addButton( 'eg_php', 'PHP', '<pre><code class=\"language-php\">', '</code></pre>', 'p', 'PHP Code', 200 );
QTags.addButton( 'eg_css', 'CSS', '<pre><code class=\"language-css\">', '</code></pre>', 'q', 'CSS Code', 201 );
QTags.addButton( 'eg_html', 'HTML', '<pre><code class=\"language-html\">', '</code></pre>', 'r', 'HTML Code', 202 );
QTags.addButton( 'eg_callback', 'CSS div', css_callback );
function css_callback(){
var css_class = prompt( 'Class name:', '' );
if ( css_class && css_class !== '' ) {
QTags.insertContent('<div class="' + css_class +'"></div>');
}
}
</script>
<?php
}
}
add_action( 'admin_print_footer_scripts', 'my_quicktags' );
Custom quicktags not working after Wordpress 6.0
wp 5.8.x/5.9.x: working -- wp 6.0: not working
Buttons are not showing here: https://i.sstatic.net/aUXyV.jpg
Console error: Uncaught ReferenceError: QTags is not defined
I am using this code.
function my_quicktags() {
if ( wp_script_is( 'quicktags' ) ) {
?>
<script type="text/javascript">
QTags.addButton( 'eg_php', 'PHP', '<pre><code class=\"language-php\">', '</code></pre>', 'p', 'PHP Code', 200 );
QTags.addButton( 'eg_css', 'CSS', '<pre><code class=\"language-css\">', '</code></pre>', 'q', 'CSS Code', 201 );
QTags.addButton( 'eg_html', 'HTML', '<pre><code class=\"language-html\">', '</code></pre>', 'r', 'HTML Code', 202 );
QTags.addButton( 'eg_callback', 'CSS div', css_callback );
function css_callback(){
var css_class = prompt( 'Class name:', '' );
if ( css_class && css_class !== '' ) {
QTags.insertContent('<div class="' + css_class +'"></div>');
}
}
</script>
<?php
}
}
add_action( 'admin_print_footer_scripts', 'my_quicktags' );
6 Answers
Reset to default 4Found a fix.
<script type="text/javascript">
window.onload=function(){
}
</script>
make sure the JS loads after the page fully loads this will allow the qtags js to work. Had the same issue as you right after I updated to 6.0. This fixed it for me.
I had the same problem. I fixed it by using the ep_enqueue_script aproach shown here: https://codex.wordpress.org/Quicktags_API listed under "A more modern example".
It's the same thing that Tom mentions. Instead of using 'admin_print_fotter_scripts' to write an inline script on the page, the example shows putting the Qtags javascript in a separate JS file, and loading it with 'admin_enqueue_scripts' as the action and calling wp_enqueue_script.
The Quicktags_API link above shows both methods, but the inline script method stoped working for me.
You can use wp_add_inline_script to add more quicktags, ensuring it only runs when quicktags is used, and runs after it's loaded:
function add_quicktag_paragraph(): void {
wp_add_inline_script(
'quicktags',
"QTags.addButton( 'eg_paragraph', 'p', '<p>', '</p>', 'p', 'Paragraph tag', 1 );"
);
}
add_action( 'wp_enqueue_scripts', 'add_quicktag_paragraph' );
Here the second parameter of wp_add_inline_script gets put into a <script> tag by WordPress, and it places it so that it shows after quicktags is loaded, not before. I've placed a single line of code in my example but you could insert multiple lines instead.
This solves several problems the original snippet in the handbook had:
- it works on non-admin pages that use quicktags
- it always runs the code after quicktags is loaded, not before.
- no hardcoded script tags
- it's possible to filter and process this because of
wp_add_inline_script - if a plugin removes the quicktags code then this will not show and break
Another alternative is to write a JS file with your quicktags additions, and enqueue it, declaring quicktags as a dependency. This ensures it is always loaded in the correct order.
Another fix..
<script type="text/javascript">
window.addEventListener('DOMContentLoaded', () => {
QTags.addButton( 'test', 'Test', '<test>', '</test>', 'test' );
});
</script>
This work for me (more info)
My QTags:
QTags.addButton('codelights', 'CodeLights', btnAction);
I edit to:
window.onload = function() {
QTags.addButton('codelights', 'CodeLights', btnAction);
};
I had the same problem, my custom quicktags I use in the Classic Editor (Text tab) disappeared after updating to 6.0+ and after much research I can confirm that the old code DOES still work with the addition of a single line of script (a window event) as suggested above by @kegnum and @Dominator0 (thanks!).
HERE is the full code snippet in case anyone needs it, be sure to modify this to suit your OWN needs, here I am adding some H tags:
// add more buttons to the html editor
function twe_add_quicktags() {
if (wp_script_is('quicktags')){
?>
<script type="text/javascript">
window.addEventListener('load', function(){
QTags.addButton( 'eg_heading_3', 'h3', '<h3>', '</h3>', 'h3', 'Heading 3 tag', 1 );
QTags.addButton( 'eg_heading_4', 'h4', '<h4>', '</h4>', 'h4', 'Heading 4 tag', 1 );
QTags.addButton( 'eg_heading_5', 'h5', '<h5>', '</h5>', 'h5', 'Heading 5 tag', 1 );
});
</script>
<?php
}
}
add_action( 'admin_print_footer_scripts', 'twe_add_quicktags' );
I know there are several other methods, but this is a very simple one and it does the trick.
本文标签： Custom quicktags not working after Wordpress 60
版权声明：本文标题：Custom quicktags not working after Wordpress 6.0 内容由网友自发贡献，该文观点仅代表作者本人， 转载请联系作者并注明出处：http://www.betaflare.com/web/1736300896a1930987.html， 本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容，一经查实，本站将立刻删除。
QTags.addButton( 'eg_php', 'PHP', '<pre><code class=\"language-php\">', '</code></pre>', 'p', 'PHP Code', 200 );in WP 6.0 and it worked fine, I notice though, that rather than adding an inline script toquicktags, you're usingwp_script_isand then manually writing out a script tag, which is highly unusual and non-standard. Are you sure thatif ( wp_script_is( 'quicktags' ) ) {actually works as intended? Was there a particular reason you chose to write it this way? I suspect this has always been broken but it worked out of luck – Tom J Nowell ♦ Commented May 26, 2022 at 18:01