Showing posts with label WordPress-Plugin. Show all posts
Showing posts with label WordPress-Plugin. Show all posts

Saturday, January 7, 2023

WordPress - Add a custom menu item to the WordPress admin menu, for a user with administrator capability - Using WordPress Plugin development

You have to create a plugin first, say create a directory named "plugin1" under "wp-content/plugins" directory. Create a file named "plugin1.php" using following content:
<?php
/**
 * Plugin Name: plugin1
 * Plugin URI: https://www.your-site.com/
 * Description: Test.
 * Version: 1.0.1
 * Author: Plugin Owner Name
 * Author URI: https://www.your-site.com/
 **/

function register_my_custom_menu_page() {
    add_menu_page(
        __( 'Custom Menu Title', 'textdomain' ),
        'Custom Menu',
        'manage_options',
        'plugin1/home.php',
        '',
        plugins_url( 'plugin1/images/home2.png' ),
        6
    );
}
// This command will add menu at left bar of admin panel
add_action( 'admin_menu', 'register_my_custom_menu_page' );

// This will add stylesheet
wp_enqueue_style( 'plugin1.main.css', plugins_url( 'plugin1/main.css' ), false, '1.1', 'all');
Create an directory inside that directory "images" and put an image which will appear as menu icon in the admin menu panel, my structure is like as:
Go to "http://localhost/plugin-development/wp-admin/plugins.php" to activate your Plugin. Above code will add a left menu with icon to the menubar as below:
Once you click on the menu item, it will take you to the "plugin1/home.php" page which will looks like below:

Friday, February 22, 2019

WordPress | Customizing Taxonomies as Dropdowns in Quick Edit | Display a custom taxonomy as a dropdown on the quick edit posts page

We need to display custom taxonomy options in post quick edit page as dropdown as below screen shot:

The very first step is to register taxonomy.
https://pritomkumar.blogspot.com/2019/02/wordpress-plugin-how-to-create-custom.html will help you.
Now the target is to display taxonomy options in quick edit posts page. For that we have to register some actions as below:
<?php
add_action('admin_enqueue_scripts', array(self::class, 'my_add_admin_scripts'));

add_filter('manage_posts_columns', array(self::class, 'add_post_fake_column'), 10, 2);
add_filter('manage_edit-post_columns', array(self::class, 'remove_post_fake_column'));
add_action('quick_edit_custom_box', array(self::class, 'add_post_quick_edit_box'), 10, 2);
add_action('save_post', array(self::class, "my_taxonomy_post_save_callback"), 1, 2);

$action_name = 'plugin_my_personal_taxonomy';
add_action ('wp_ajax_' . $action_name, array(self::class, 'ajax_call_your_function'));
add_action ('wp_ajax_nopriv_' . $action_name, array(self::class, 'ajax_call_your_function'));
<?php
public static function my_add_admin_scripts() {
    global $pagenow;

    $taxonomy = MY_TAXONOMY_PLUGIN_CORE . 'color';
    wp_register_script(
        'MY_TAXONOMY_PLUGIN_CORE',
        MY_TAXONOMY_PLUGIN_URL . 'assets/script7.js',
        array('jquery')
    );

    $params = array(
        'BASE_URL' => MY_TAXONOMY_PLUGIN_URL,
        'ADMIN_URL' => admin_url()
    );
    wp_localize_script( 'MY_TAXONOMY_PLUGIN_CORE', 'MY_TAXONOMY_PLUGIN_CORE', $params);

    wp_enqueue_script('MY_TAXONOMY_PLUGIN_CORE');

    wp_enqueue_style(
        "MY_TAXONOMY_PLUGIN_CORE", MY_TAXONOMY_PLUGIN_URL . "assets/style7.css"
    );
}
<?php
public static function add_post_fake_column($posts_columns, $post_type) {
    $posts_columns['fake_column_taxonomy_color'] = 'Fake Column (Invisible)';
    return $posts_columns;
}

public static function remove_post_fake_column($posts_columns) {
    unset($posts_columns['fake_column_taxonomy_color']);
    return $posts_columns;
}
<?php
public static function add_post_quick_edit_box($column_name, $post_type) {
    if (true) {
        $taxonomy = get_taxonomy(self::getTaxonomyName());

        $taxonomy_options = get_terms(array(
            'taxonomy' => self::getTaxonomyName(),
            'hide_empty' => false,
        ));

        if (count($taxonomy_options) > 0) {
            $post_terms = [];
            $post_id = isset($GLOBALS['post_id']) ? $GLOBALS['post_id'] : get_the_ID();
            foreach(wp_get_post_terms($post_id, self::getTaxonomyName()) as $o) {
                $post_terms[$o->term_id] = 1;
            }

            global $taxonomy_data_map;
            $taxonomy_data_map = [];
            $taxonomy_data_map['name'] = self::getTaxonomyName();
            $taxonomy_data_map['value_field'] = $taxonomy->hierarchical ? 'term_id' : 'name';
            $taxonomy_data_map['options'] = $taxonomy_options;
            $taxonomy_data_map['selected'] = $post_terms;

            include_once MY_TAXONOMY_PLUGIN_DIR . 'templates/taxonomy_post_quick_edit.php';
            wp_nonce_field( MY_TAXONOMY_PLUGIN_NONCE_FIELD_NAME, MY_TAXONOMY_PLUGIN_NONCE_FIELD_NAME );
        }
    }
}
taxonomy_post_quick_edit.php

<?php
global $taxonomy_data_map;
$terms = $taxonomy_data_map['options'];
$value_field = $taxonomy_data_map['value_field'];
$selected = $taxonomy_data_map['selected'];
?>
<fieldset class="inline-edit-col-left my_taxonomy_plugin_color-quick-editor">
    <div class="inline-edit-col">
        <span class="title"><?= __('Colors') ?></span>
        <select name='<?= $taxonomy_data_map['name'] ?>[]' id='<?= $taxonomy_data_map['name'] ?>' multiple>
            <?php
            foreach ($terms as $term) {
                $_checked = isset($selected[$term->term_id]) ? 'selected' : '';
                echo "<option value='{$term->{$value_field}}' {$_checked}>{$term->name}</option>\n";
            }
            ?>
        </select>
    </div>
</fieldset>
<?php
public static function my_taxonomy_post_save_callback($id, $post) {
    if ((defined('DOING_AUTOSAVE') && DOING_AUTOSAVE ) || !current_user_can('edit_page', $id)) {
        return $id;
    }
    if (!isset($_POST[MY_TAXONOMY_PLUGIN_NONCE_FIELD_NAME])) {
        return $id;
    }
    if (!wp_verify_nonce($_POST[MY_TAXONOMY_PLUGIN_NONCE_FIELD_NAME], MY_TAXONOMY_PLUGIN_NONCE_FIELD_NAME)) {
        return $id;
    }
    if (!current_user_can( 'edit_post', $id)) {
        return $id;
    }

    $taxonomy = get_taxonomy(self::getTaxonomyName());
    $field = $taxonomy->hierarchical ? 'term_id' : 'name';

    $taxonomy_options = array();
    foreach(get_terms(array('taxonomy' => self::getTaxonomyName(), 'hide_empty' => false)) as $o) {
         $taxonomy_options[strval($o->{$field})] = 1;
    }

    if (count($taxonomy_options)) {
        $options = array();
        foreach((isset($_POST[self::getTaxonomyName()]) ? $_POST[self::getTaxonomyName()] : array()) as $i) {
            if (isset($taxonomy_options[$i])) {
                array_push($options, $i);
            }
        }
        wp_set_post_terms($id, $options, self::getTaxonomyName());
    }
    else {
        wp_set_post_terms($id, array(), self::getTaxonomyName());
    }

    return $id;
}
<?php
public static function ajax_call_your_function() {
    $case = isset($_REQUEST['case']) ? $_REQUEST['case'] : '';
    switch ($case) {
        case 'post-quick-edit':
            $id = isset($_REQUEST['id']) ? doubleval($_REQUEST['id']) : 0;
            if ($id > 0) {
                $GLOBALS['post_id'] = $id;
                self::add_post_quick_edit_box(null, null);
                wp_die();
            }
            break;
    }
    header("HTTP/1.1 404");
    echo __("Not Found");
    exit;
}
script7.js

jQuery(document).ready(function(){
    var $ = jQuery, body = $(document.body);

    if (typeof inlineEditPost !== 'undefined') {
        (function ($, inlineEditPost) {
            // inlineEditTax does not invoke any events, but does ensure to stop
            // propagation to all other event handlers; swap it out.
            inlineEditPost.realOne = inlineEditPost.edit;

            inlineEditPost.edit = function (link) {
                // Invoke original edit event handler.
                this.realOne(link);

                var id = inlineEditPost.getId(link), tr = $(link).closest("table").find("tr#edit-" + id);
                var qe = tr.find(".my_taxonomy_plugin_color-quick-editor");
                if (qe.length) {
                    $.ajax ({
                        url: MY_TAXONOMY_PLUGIN_CORE.ADMIN_URL + '/admin-ajax.php',
                        type: 'POST',
                        dataType: 'HTML',
                        data: {
                            action: 'plugin_my_personal_taxonomy',
                            case: 'post-quick-edit',
                            id: id
                        },
                        success: function (resp) {
                            qe.html($(resp).html());
                        },
                        error: function (xhr, ajaxOptions, thrownError) {

                        },
                    });
                }
                return false;
            }
        })($, inlineEditPost);
    }
});

Download full plugin from BitBucket


WordPress | Dynamically reference WordPress site URL in JavaScript | WordPress path url in js script file

During my WordPress development, I often find myself in need of the WP home or blog URL from within the JavaScript code.
Instead of hardcoding url in the JavaScript, we're going to dynamically retrieve the site URL, with a little help in PHP.
<?php
wp_register_script(
    'MY_TAXONOMY_PLUGIN_CORE',
    MY_TAXONOMY_PLUGIN_URL . 'assets/script7.js',
    array('jquery')
);

$params = array(
    'BASE_URL' => MY_TAXONOMY_PLUGIN_URL,
    'ADMIN_URL' => admin_url()
);
wp_localize_script( 'MY_TAXONOMY_PLUGIN_CORE', 'MY_TAXONOMY_PLUGIN_CORE', $params);

wp_enqueue_script('MY_TAXONOMY_PLUGIN_CORE');
And from jQuery
alert(MY_TAXONOMY_PLUGIN_CORE.BASE_URL);

Thursday, February 21, 2019

WordPress Plugin: How To Create A Custom Taxonomy In WordPress like Category | Manually Creating Custom Taxonomies

WordPress provides a new method of grouping content by allowing you to create your own custom taxonomies. The core developers have created the register_taxonomy() function to handle the heavy lifting for us. All you have to do is understand how to configure all of the settings to suit your needs.

Below function will initialize custom taxonomy:


<?php
add_action('init', array(self::class, 'create_topics_hierarchical_taxonomy'), 0);

public static function create_topics_hierarchical_taxonomy() {
    $labels = array(
        'name' => _x( 'Color', 'taxonomy general name' ),
        'singular_name' => _x( 'Colors', 'taxonomy singular name' ),
        'search_items' =>  __( 'Search Colors' ),
        'all_items' => __( 'All Colors' ),
        'parent_item' => __( 'Parent Color' ),
        'parent_item_colon' => __( 'Parent Color:' ),
        'edit_item' => __( 'Edit Color' ),
        'update_item' => __( 'Update Color' ),
        'add_new_item' => __( 'Add New Color' ),
        'new_item_name' => __( 'New Color Name' ),
        'menu_name' => __( 'Colors' ),
    );
    register_taxonomy(MY_TAXONOMY_PLUGIN_CORE . 'color', array('post', 'page'), array(
        //If you want parent color option, then enable below parameter to true
        'hierarchical' => false,
        'labels' => $labels,
        //will show settings create/edit/delete options in post/page menu
        'show_ui' => true,
        //will show count posts
        'show_admin_column' => true,
        'query_var' => true,
        'rewrite' => array('slug' => 'taxonomy-color')
    ));

    //Default taxonomy will be created on initialization
    wp_insert_term("Black", MY_TAXONOMY_PLUGIN_CORE . "color");
    wp_insert_term("Blue", MY_TAXONOMY_PLUGIN_CORE . "color");
    wp_insert_term("Yellow", MY_TAXONOMY_PLUGIN_CORE . "color");
    wp_insert_term("Red", MY_TAXONOMY_PLUGIN_CORE . "color");
}

Below function will add required script in taxonomy page:


<?php
add_action('admin_enqueue_scripts', array(self::class, 'my_add_admin_scripts'));

public static function my_add_admin_scripts() {
    global $pagenow;

    $taxonomy = MY_TAXONOMY_PLUGIN_CORE . 'color';
    if($pagenow == 'edit-tags.php' && (isset($_GET['taxonomy']) && $_GET['taxonomy'] == $taxonomy) && !isset($_GET['action']))
    {
        wp_register_script(
            'quick-edit-js',
            MY_TAXONOMY_PLUGIN_URL . 'assets/script7.js',
            array('jquery')
        );
        wp_enqueue_script('quick-edit-js');
    }
}

Below function will add additional field to our custom taxonomy:


<?php
$taxonomy = MY_TAXONOMY_PLUGIN_CORE . 'color';
$taxonomy1 = 'manage_edit-' . $taxonomy . '_columns';
add_filter($taxonomy1, array(self::class, 'register_category_columns'));

public static function register_category_columns($columns) {
    $columns['my-taxonomy-plugin-color-f1'] = __( 'Creator', 'my-taxonomy-plugin' );
    return $columns;
}

Below function will show custom taxonomy field in taxonomy table


<?php
$taxonomy = MY_TAXONOMY_PLUGIN_CORE . 'color';
$taxonomy2 = 'manage_' . $taxonomy . '_custom_column';
add_filter($taxonomy2, array(self::class, 'category_column_display'), 10, 3);

public static function category_column_display($string, $column_name, $term_id) {
    return esc_html(get_term_meta($term_id, $column_name, true));
}

Below function will allow our custom field of taxonomy to edit in quick edit mode


<?php
$taxonomy = MY_TAXONOMY_PLUGIN_CORE . 'color';
add_action('quick_edit_custom_box', array(self::class, 'quick_edit_taxonomy_field'), 10, 2);
$taxonomy3 = 'edited_' . $taxonomy;
add_action($taxonomy3, array(self::class, 'quick_edit_save_category_field'));

public function quick_edit_taxonomy_field($column_name, $screen) {
    if ( $screen != 'edition' && $column_name != 'my-taxonomy-plugin-color-f1' ) {
        return false;
    }
    include_once MY_TAXONOMY_PLUGIN_DIR . "templates/taxonomy_quick_edit.php";
}

public function quick_edit_save_category_field($term_id) {
    if (isset($_POST['my-taxonomy-plugin-color-f1'])) {
        update_term_meta(
            $term_id, 'my-taxonomy-plugin-color-f1',
            $_POST['my-taxonomy-plugin-color-f1']
        );
    }
}
taxonomy_quick_edit.php
<fieldset>
    <div class="inline-edit-col inline-edit-col-taxonomy-my-color">
        <label>
            <span class="title"><?php _e( 'Creator', 'my-taxonomy-plugin' ); ?></span>
            <span class="input-text-wrap"><input type="text" name="<?php echo esc_attr($column_name); ?>" class="ptitle" value=""></span>
        </label>
    </div>
</fieldset>
script7.js
jQuery(document).ready(function(){
    var $ = jQuery, body = $(document.body);
    (function ($, inlineEditTax) {
        // inlineEditTax does not invoke any events, but does ensure to stop
        // propagation to all other event handlers; swap it out.
        inlineEditTax.editPreMyPlugin = inlineEditTax.edit;
        inlineEditTax.edit = function (link) {
            // Invoke original edit event handler.
            this.editPreMyPlugin(link);

            var tr = $(link).closest('tr[id]');

            var tag_id = tr.attr('id');
            var field1_value = tr.find(".column-my-taxonomy-plugin-color-f1").text();
            $(':input[name="my-taxonomy-plugin-color-f1"]', '.inline-edit-row').val(field1_value);

            return false;
        }
    })($, inlineEditTax);
});

Below function will add a custom field to add/edit form of taxonomy and data will be saved accordingly


<?php
add_action($taxonomy . '_add_form_fields', array(
    self::class, 'taxonomy_metadata_add'
), 10, 1);
add_action($taxonomy . '_edit_form', array(
    self::class, 'taxonomy_metadata_edit'
), 10, 1);
add_action('created_' . $taxonomy, array(
    self::class, 'save_taxonomy_metadata'
), 10, 1);
add_action('edited_' . $taxonomy, array(
    self::class, 'save_taxonomy_metadata'
), 10, 1);

public static function taxonomy_metadata_add($tag) {
    if (current_user_can( 'publish_posts')) {
        include_once MY_TAXONOMY_PLUGIN_DIR . "templates/taxonomy_add.php";
    }
}

public static function taxonomy_metadata_edit($tag) {
    if (current_user_can( 'publish_posts')) {
        ob_start();
        global $my_taxonomy_plugin_color_f1;
        $my_taxonomy_plugin_color_f1 = get_term_meta($tag->term_id, 'my-taxonomy-plugin-color-f1', true);
        include_once MY_TAXONOMY_PLUGIN_DIR . "templates/taxonomy_edit.php";
        $content = ob_get_contents();
        ob_end_clean();
        echo $content;
    }
}

public static function save_taxonomy_metadata($term_id) {
    if ( isset($_POST['my-taxonomy-plugin-color-f1']) ) {
        update_term_meta($term_id, 'my-taxonomy-plugin-color-f1', esc_attr($_POST['my-taxonomy-plugin-color-f1']));
    }
}
taxonomy_add.php
<div class="form-field">
    <label for="my-taxonomy-plugin-color-f1"><?php _e('Creator'); ?></label>
    <input name="my-taxonomy-plugin-color-f1" id="my-taxonomy-plugin-color-f1" type="text" value="" size="70" />
    <p class="description"><?php _e('Title display in creator is limited to 70 chars'); ?></p>
</div>
taxonomy_edit.php
<table class="form-table">
    <tbody>
    <tr class="form-field form-required term-name-wrap">
        <th scope="row"><label for="my-taxonomy-plugin-color-f1"><?php _e('Creator'); ?></label></th>
        <td>
            <input name="my-taxonomy-plugin-color-f1" id="my-taxonomy-plugin-color-f1" type="text" value="<?= esc_attr($my_taxonomy_plugin_color_f1) ?>" size="70" />
            <p class="description"><?php _e('Title display in creator is limited to 70 chars'); ?></p>
        </td>
    </tr>
    </tbody>
</table>

Now we will add metabox to append our taxonomy to post edit page


<?php
add_action('admin_init', array(Init::class, 'check_if_plugin'));

public static function check_if_plugin() {
    if (is_plugin_active(MY_TAXONOMY_PLUGIN_NAME)) {
        add_meta_box(
            MY_TAXONOMY_PLUGIN_CORE . 'metabox1', __( 'Choose Colors', MY_TAXONOMY_PLUGIN_CORE ),
            array(Init::class, 'my_meta_box_data_callback'), 'post'
        );
        add_action('save_post', array(self::class, "my_taxonomy_post_save_callback"), 1, 2);
    }
}

public static function my_taxonomy_post_save_callback($id, $post) {
    if (!isset($_POST[MY_TAXONOMY_PLUGIN_NONCE_FIELD_NAME])) {
        return $post->ID;
    }
    if (!wp_verify_nonce($_POST[MY_TAXONOMY_PLUGIN_NONCE_FIELD_NAME], MY_TAXONOMY_PLUGIN_NONCE_FIELD_NAME)) {
        return $post->ID;
    }
    if (!current_user_can( 'edit_post', $post->ID)) {
        return $post->ID;
    }

    $options = isset($_POST[self::getTaxonomyName()]) ? $_POST[self::getTaxonomyName()] : array();
    wp_set_post_terms($post->ID, $options, self::getTaxonomyName());

    return $post->ID;
}

public static function my_meta_box_data_callback() {
    global $post;
    $taxonomy_options = get_terms(array(
        'taxonomy' => self::getTaxonomyName(),
        'hide_empty' => false,
    ));
    if (count($taxonomy_options) > 0) {
        $post_terms = [];
        foreach(wp_get_post_terms($post->ID, self::getTaxonomyName()) as $o) {
            $post_terms[$o->term_id] = 1;
        }

        global $taxonomy_data_map;
        $taxonomy_data_map = [];
        $taxonomy_data_map['class'] = self::getTaxonomyName();
        $taxonomy_data_map['options'] = $taxonomy_options;
        $taxonomy_data_map['selected'] = $post_terms;

        include_once MY_TAXONOMY_PLUGIN_DIR . 'templates/taxonomy_post_edit.php';
        wp_nonce_field( MY_TAXONOMY_PLUGIN_NONCE_FIELD_NAME, MY_TAXONOMY_PLUGIN_NONCE_FIELD_NAME );
    }
}

taxonomy_post_edit.php
<?php
global $taxonomy_data_map;
$taxonomy_class = $taxonomy_data_map['class'];
$taxonomy_options = $taxonomy_data_map['options'];
$taxonomy_selected = $taxonomy_data_map['selected'];
?>

<div class="<?= $taxonomy_class ?>-editor-on-post">
    <h2>
        Colors
    </h2>
    <?php foreach ($taxonomy_options as $o) { ?>
        <div class="<?= $taxonomy_class ?>-taxonomies__hierarchical-terms-list" tabindex="0" role="group" aria-label="Available Colors">
            <?php $_checked = isset($taxonomy_selected[$o->term_id]) ? 'checked' : ''; ?>
            <div class="<?= $taxonomy_class ?>-taxonomies__hierarchical-terms-choice">
                <input
                        id="<?= $taxonomy_class ?>-taxonomies-hierarchical-term-<?= $o->term_id ?>"
                        class="<?= $taxonomy_class ?>-taxonomies__hierarchical-terms-input"
                        type="checkbox" value="<?= $o->name ?>"
                        name="<?= $taxonomy_class ?>[]" <?= $_checked ?>
                />
                <label for="<?= $taxonomy_class ?>-taxonomies-hierarchical-term-<?= $o->term_id ?>"><?= esc_attr($o->name) ?></label>
            </div>
        </div>
    <?php } ?>
    <div style="clear:both"></div>
</div>

Now time to display our taxonomy data to post details view


<?php
add_filter('the_content', array(self::class, 'my_the_content'));

public static function my_the_content($c) {
    if (!is_admin() && !is_feed() && (is_single() || is_page())) {
        global $post;
        $allow = !is_null($post) && property_exists($post, "post_type") && in_array($post->post_type, array('post'));
        if ($allow) {
            $content = array();
            foreach(wp_get_post_terms($post->ID, self::getTaxonomyName()) as $o) {
                $content[] = $o->name;
            }
            $c = $c . "<div class=\"my_taxonomy_plugin_color-post-display\">
                            <div class=\"row\">
                            <label class=\"label\">Colors</label>
                            <span class=\"value\">" . implode(', ', $content) . "</span>
                        </div>
                    </div>";
        }
    }
    return $c;
}

Below are some of screen shots





d

Download full plugin from BitBucket