উইজেট জাভাস্ক্রিপ্ট + সিএসএস ফাইল ব্যবহার করা হয় তবে কীভাবে লোড করবেন?

Question

আমি আমার উইজেট দ্বারা ব্যবহৃত জাভাস্ক্রিপ্ট এবং সিএসএস শৈলীগুলি তাদের নিজস্ব ফাইলের মধ্যে রাখতে চাই (এবং থিমটিতে এগুলি যোগ করব না)।

তবে উইজেটটি যখন আসলে একটি সাইডবারে ব্যবহৃত হয় তখন আমি সেগুলি যুক্ত করতে ওয়ার্ডপ্রেস পেতে পারি না।

আমি এটি চেষ্টা করেছি:

ক্লাস ঘোষণার ভিতরে আমি 2 টি ফাংশন যুক্ত করেছি

class EssentielleRubriquesPosts extends WP_Widget {

function addFrontendCss(){
    wp_enqueue_style('erw-frontend-css', ESSENTIELLE_RUBRIQUE_WIDGET_PLUGIN_PATH . 'css/EssentielleRubriqueWidget-frontend.css');
}
function addFrontendJavascript(){
    wp_register_script('jq-hoverintent', PLUGIN_PATH . 'js/jquery.hoverintent.js', array('jquery'), '1.0',true);
    wp_enqueue_script('jq-hoverintent');
    wp_enqueue_script('jq-tools', PLUGIN_PATH . 'js/jquery.tools.js', array('jquery'),'1.0',true);
    wp_enqueue_script('erw-frontend-js', PLUGIN_PATH . 'js/widget-frontend.js', array('jquery', 'jq-hoverintent', 'jq-tools'),'1.0',true);

}

এবং উইজেটের ভিতরে () ফাংশন:

function widget($args, $instance) {
        add_action( 'wp_print_scripts', 'addFrontendJavascript' );
        add_action( 'wp_print_styles', 'addFrontendCss' );
}

কিন্তু এটি কিছুই করে না ...

Comments

এই দস্তাবেজ সম্পর্কে developers.elementor.com/add-custom-functionality

— জুয়ান Solano

Answer 1

wp_print_scriptsএবং wp_print_stylesআপনার উইজেট ফাংশনের আগে হুকগুলি বহিস্কার করা হয় যাতে এটি কাজ করে না।

এর একটি সমাধান wp_print_footer_scriptsহুক ব্যবহার করে ফুটারে স্ক্রিপ্টগুলি অন্তর্ভুক্ত করা হবে , অনুরূপ প্রশ্নের জ্যানের উত্তরটি একবার দেখুন

বা আরও ভাল সমাধান সেরিকের অনুরূপ অন্য প্রশ্নের উত্তরটি একবার দেখুন

Answer 2

সর্বোত্তম সমাধান হ'ল প্রথমে আপনার সম্পদগুলি নিবন্ধভুক্ত করা এবং তারপরে widget()আপনার ডাব্লুপি_বিজেটের ফাংশনের ভিতরে সিএসএস এবং জেএস সজ্জিত করা (সরাসরি নতুন সারিবদ্ধ করুন, নতুন হুক যুক্ত করে নয়)।

আমি এই সমাধানটি পরীক্ষা করেছি এবং এটি বর্তমান ওয়ার্ডপ্রেস সংস্করণে (4.5.3) কাজ করে - জেএস এবং সিএসএস উভয়ই পৃষ্ঠা ফুটারে যুক্ত করা হয়েছে added

<?php
// Register your assets during `wp_enqueue_scripts` hook.
function custom_register_scripts() {
    wp_register_style('erw-frontend-css', '...frontend.css');
    wp_register_script('jq-hoverintent', '...hoverintent.js', ...);
    wp_register_script('jq-tools', '...tools.js', ...);
}
// Use wp_enqueue_scripts hook
add_action('wp_enqueue_scripts', 'custom_register_scripts');


class YourWidget extends WP_Widget {
    public function __construct() {
    }

    public function widget( $args, $instance ) {
        // Enqueue needed assets inside the `widget` function.
        wp_enqueue_style('erw-frontend-css');
        wp_enqueue_script('jq-hoverintent');
        wp_enqueue_script('jq-tools');

        // Output widget contents.
    }

    public function form( $instance ) {
    }

    public function update( $new_instance, $old_instance ) {
    }
}