• rstrah

    (@rstrah)


    Adding in html editor mode

    add_action( 'admin_print_footer_scripts', 'theme_add_quicktags', 99 );
    function theme_add_quicktags() {
    	if ( ! wp_script_is('quicktags') )
    		return;
    
    	?>
    	<script>
    	document.addEventListener( 'DOMContentLoaded', function(){
    
    		QTags.addButton( 'r4_div_blue', 'div_blue', '<div class="color-blue">', '</div>', 'd', 'Div blue', 1 );
    		QTags.addButton( 'r4_h3_blue', 'h3_blue', '<h3 class="color-blue">', '</h3>', 'h', 'H3 blue', 2 );
    		QTags.addButton( 'r4_ol_lg', 'ol_lg', '<ol class="lg-list">', '</ol>', 'o', 'Ol lg', 3 );
    		
    	} );
    	</script>
    	<?php
    }
    //QTags.addButton( id, display, arg1, arg2, access_key, title, priority, instance );

    Adding in visual editor mode (buttons)
    tinymce-buttons.js

    (function() {
        tinymce.create('tinymce.plugins.theme_buttons', {
            init : function(ed, url) {
                ed.addButton('r4_div_blue', {
                    title : 'Div blue',
                    icon: 'mce-ico mce-i-checkmark', // использование иконки Dashicons
                    onclick : function() {
                        ed.execCommand('mceInsertContent', false, '<div class="color-blue"></div>');
    					ed.label = 'Div blue';
                    }
                });
                ed.addButton('r4_h3_blue', {
                    title : 'H3 blue',
                    icon: 'mce-ico mce-i-checkmark', // использование иконки Dashicons
                    onclick : function() {
                        ed.execCommand('mceInsertContent', false, '<h3 class="color-blue"></h3>');
    					ed.label = 'H3 blue';
                    }
                });
                ed.addButton('r4_ol_lg', {
                    title : 'Ol lg',
                    icon: 'mce-ico mce-i-checkmark', // использование иконки Dashicons
                    onclick : function() {
                        ed.execCommand('mceInsertContent', false, '<ol class="lg-list"><li></li></ol>');
    					ed.label = 'Ol lg';
                    }
                });
            }
        });
        tinymce.PluginManager.add('theme_buttons', tinymce.plugins.theme_buttons);
    })();

    function.php

    function theme_tinymce_plugin($plugin_array) {
        $plugin_array['theme_buttons'] = get_template_directory_uri() . '/assets/js/tinymce-buttons.js?v=17'; // путь к вашему JS файлу
        return $plugin_array;
    }
    
    function theme_register_buttons($buttons) {
        array_push($buttons, 'r4_div_blue', 'r4_h3_blue', 'r4_ol_lg');
        return $buttons;
    }


    Question: how to add to the drop-down list (see screenshot)https://prnt.sc/1MmEGcEvahOx

Viewing 1 replies (of 1 total)
Viewing 1 replies (of 1 total)
  • You must be logged in to reply to this topic.