ফাংশন.ফেপগুলিতে জাভাস্ক্রিপ্টকে কীভাবে যুক্ত করবেন


11

আমি WooCommerce এর কার্ট বোতামে স্ট্যান্ডার্ড কিছু কুরুচিপূর্ণ তীর সরিয়ে ফেলতে চাই। এটি অর্জনের জন্য, আমি নিম্নলিখিত কোডটি যুক্ত করার একটি টিপ পেয়েছি, যা ডকুমেন্টটি লোড হওয়ার পরে তীরগুলি সরানো উচিত।

আমি ধরে নিচ্ছি আমি এটি আমার ফাংশনগুলিতে রেখে যাব? পিপিপি? আমি ঠিক কীভাবে এটি করব?

$(document).ready(function() {
    $(".woocommerce-cart").html(function(i, val) {
    return val.replace(" →", "");
    });
    $(".woocommerce-cart").html(function(i, val) {
    return val.replace("← ", "");
    });
});

সম্পাদনা

ঠিক আছে. আমি এই পদ্ধতির চেষ্টা করেছি:

'সরানোআরও.জেএস' নামে একটি ফাইল তৈরি করে আমার প্লাগইন ফোল্ডারে রেখে দিয়েছে। এর পরিবর্তে jQuery বাদে মূল কোডের মতো একই বিষয়বস্তু রয়েছে $ তারপরে আমি ফাংশন.এফপিতে নিম্নলিখিতগুলি যুক্ত করেছি:

function wpb_adding_scripts() {
      wp_register_script('my_amazing_script', plugins_url('removeArrows.js', FILE), array('jquery'),'1.1', true);
     wp_enqueue_script('my_amazing_script');
 } 

add_action( 'wp_enqueue_scripts', 'wpb_adding_scripts' ); 

কোডটি কীভাবে সঠিকভাবে করা যায় তা আমি বুঝতে পারি না। এটি কার্যকর হয়নি। এই কাজ করতে কোন পরামর্শ?

jQuery স্নিপেট উত্স


এটি পাগল: আপনি কোড তৈরি করে তীরগুলি কী সম্পাদন করতে পারবেন না? (বা এটি কোনও বাহ্যিক উত্স থেকে ডাউনলোড করা আছে?) কার্ট ব্লকের ভিতরে থাকা সমস্ত এইচটিএমএল দু'বার পড়া এবং লেখা এড়াতে আপনি কোনও ক্ষেত্রে উভয়ই একক ফাংশনে প্রতিস্থাপন করতে পারেন। আমি ফাংশন.এফপি থেকে পৃষ্ঠাটিতে সরাসরি ইনজেক্ট করার কোনও উপায় জানি না তবে আপনি এটি আলাদা স্ক্রিপ্ট ফাইলে সংরক্ষণ করতে পারেন (যদি আপনার কাছে ইতিমধ্যে এটি না থাকে তবে আপনি এটি যুক্ত করতে পারেন) এবং তারপরে wp-enqueue-scriptএটি। আপনাকে ওগুলিতেও পরিবর্তন করতে $হবে jQuery(পৃষ্ঠা পৃষ্ঠা 7 দেখুন)
রুপ

না, আমি নিশ্চিত যে এটি inোকানোর আগে এটি সরানো যাবে না। যদি এটি করতে পারে তবে আমি এটি করার উপায় খুঁজে পাইনি। এটি একটি ফাংশন এ যুক্ত করার ভাল পয়েন্ট। এটি দেখতে কি এমন লাগবে? document (ডকুমেন্ট) .ডিডি (ফাংশন () {$ ("। ওয়ার্ককমার্স-কার্ট") "," ");});}); আমি এনকুই স্ক্রিপ্টটি দেখব। কিছুটা জটিল মনে হচ্ছে, যদিও .. ধন্যবাদ!
ব্যবহারকারী2806026

ঠিক আছে. আমি এই পদ্ধতির চেষ্টা করেছি; 'সরানোআরও.জেএস' নামে একটি ফাইল তৈরি করে আমার প্লাগইন ফোল্ডারে রেখে দিয়েছে। এর পরিবর্তে jQuery বাদে মূল কোডের মতো একই বিষয়বস্তু রয়েছে $ তারপরে আমি ফাংশন.এফপিতে নিম্নলিখিতগুলি যুক্ত করেছি; `ফাংশন ডাব্লুপিবি_ডিং_স্ক্রিপ্টস () p ডাব্লুপিপি_রেজিস্টার_স্ক্রিপ্ট ('মাই_মাজিং_সক্রিপ্ট', প্লাগইন_আরল ('রিমুভ অ্যারोजস.জেএস', ফাইল ), অ্যারে ('জ্যাকোয়ারি'), '১.১', ট্রু) wp_enqueue_script ( 'my_amazing_script'); } যোগ_অ্যাকশন ('wp_enqueue_scriptts', 'wpb_adding_scriptts'); (দুঃখিত, কোডটি কীভাবে সঠিকভাবে প্রদর্শন করতে হয় তা আমি বুঝতে পারি না) এটি কার্যকর হয়নি। আপনি কি আমাকে এটি ঠিক করতে সহায়তা করতে পারেন?
ব্যবহারকারী2806026

1
দয়া করে একটি সম্পাদনা ফাইল করুন এবং সরাসরি আপনার প্রশ্নের সাথে সম্পর্কিত সমস্ত তথ্য যুক্ত করুন কোড যুক্ত করার জন্য মন্তব্য বিভাগটি ব্যবহার করবেন না
পিটার গুসেন

উত্তর:


11

তোমার $scrআপনার wp_register_script()ফাংশন ভুল। আপনার ফাংশন.এফপিটি আপনার প্লাগইনের অভ্যন্তরে রয়েছে এবং আপনার অপসারণ অ্যারোজ.জেগুলি আপনার প্লাগইনটির মূলের মধ্যে রয়েছে, আপনার এটির $scrমতো দেখা উচিত

plugins_url( '/removeArrows.js' , __FILE__ )

আরেকটি বিষয় লক্ষ্য করুন, আপনার স্ক্রিপ্টগুলি এবং স্টাইলগুলি সর্বশেষে লোড করা সর্বদা ভাল অনুশীলন। এটি নিশ্চিত করবে যে এটি অন্যান্য স্ক্রিপ্ট এবং শৈলীর দ্বারা ওভাররাইড হবে না। এটি করতে, আপনার অগ্রাধিকারের প্যারামিটারের ( $priority) এর মধ্যে খুব কম অগ্রাধিকার (খুব উচ্চ সংখ্যা) যুক্ত করুন add_action

 add_action( 'wp_enqueue_scripts', 'wpb_adding_scripts', 999 ); 

এবং সর্বদাwp_enqueue_scripts অ্যাকশন হুকের মাধ্যমে স্ক্রিপ্টগুলি এবং স্টাইলগুলি লোড / এনকুই করুন , কারণ এটি ব্যবহারের উপযুক্ত হুক। স্ক্রিপ্ট এবং স্টাইলগুলি সরাসরি বা এলো না loadwp_headwp_footer

সম্পাদনা

থিমগুলির জন্য, যেমন আপনি ইঙ্গিত করেছেন যে আপনি এখন সমস্ত কিছু আপনার থিমে স্থানান্তরিত করেছেন, আপনার $scrএতে পরিবর্তন হবে

 get_template_directory_uri() . '/removeArrows.js'

অভিভাবক থিম এবং এই জন্য

get_stylesheet_directory_uri() . '/removeArrows.js'

শিশু থিম জন্য। আপনার সম্পূর্ণ কোডটি দেখতে এমন হওয়া উচিত

function wpb_adding_scripts() {
    wp_register_script('my_amazing_script', get_template_directory_uri() . '/removeArrows.js', array('jquery'),'1.1', true);
    wp_enqueue_script('my_amazing_script');
} 

add_action( 'wp_enqueue_scripts', 'wpb_adding_scripts', 999 ); 

আপনার দুর্দান্ত পরামর্শের জন্য অনেক ধন্যবাদ। এটি ব্যবহারের পদ্ধতির মতো বলে মনে হচ্ছে। একটি প্রশ্ন যদিও; ফাংশন.এফপি আমার থিম ফোল্ডারে রয়েছে। আমি যদি জেএস-ফাইলটিকে লিঙ্ক করব তবে এটি থিমের মূল ফোল্ডারটিতে একই রকম রয়েছে?
ব্যবহারকারী2806026

আপনার সমস্ত কিছু প্লাগইনে বা থিমে রাখা উচিত, এগুলি বিভক্ত করবেন না। আপনি যদি কোনও থিমটিতে থাকেন $scrতবে আপনার get_template_directory_uri() . '/removeArrows.js'পিতামাতার থিম এবং get_templatestylesheet_directory_uri() . '/removeArrows.js'শিশুসাহিত্যের জন্য হবে
পিটার গুজন

আবার চেষ্টা করা হয়েছে, এবার থিম ফোল্ডারে সরানোআরও.জেসগুলি সরাসরি যুক্ত করে ফাংশন.এফপিতে নিম্নলিখিতগুলি ব্যবহার করে; ফাংশন ডব্লিউপিবি_এডিং_সস্ক্রিপ্টস () p ডাব্লুপি_গ্রিস্টার_স্ক্রিপ্ট ('আমার_মজিং_স্ক্রিপ্ট', get_template_directory_uri ()। '/removeArrows.js', ফাইল ), অ্যারে ('jquery'), '1.1', সত্য); wp_enqueue_script ( 'my_amazing_script'); } যোগ_অ্যাকশন ('wp_enqueue_scriptts', 'wpb_adding_scriptts', 999); এটি আমাকে পার্স ত্রুটি দেয়: সিনট্যাক্স ত্রুটি, অপ্রত্যাশিত ',' wp_register_script লাইনে।
ব্যবহারকারী2806026

get_template_directory_uri() . '/removeArrows.js', FILE)সবেমাত্র হওয়া উচিতget_template_directory_uri() . '/removeArrows.js'
পিটার গুজন

নাঃ। আপনার মূল পোস্টের নীচে আপনি সম্পাদিত আপনার সম্পূর্ণ কোড ব্যবহার করেছেন। কেবল এটির কাজটি হ'ল সামগ্রীগুলি দেখার সময় কার্টের পৃষ্ঠা স্থির করা। আমি মনে করি আমি কেবল ছেড়ে দেব :-) যদিও একটি শেষ অবলম্বন; আপনি উল্লেখ করে শুরু করেছিলেন যে get_template_directory_uri () পিতামাতার থিমগুলির জন্য এবং তারপরে চূড়ান্ত সম্পূর্ণ কোডে এটি শিশু থিমগুলির জন্য। ইহা কোনটা? আমার থিমটি পিতামাতার :-)
ব্যবহারকারী2806026

4

আমি আর একটি বাহ্যিক জেএস ফাইল যুক্ত করব না, এটি আনার জন্য এটি কেবলমাত্র একটি অতিরিক্ত এবং অপ্রয়োজনীয় উত্স এবং এটিই আমরা পৃষ্ঠা লোডিংয়ের সময়ের ক্ষেত্রে কাটাতে চাই।

আমি আপনার ওয়েবসাইটগুলির মাথায় wp_headহুক ব্যবহার করে এই jQuery স্নিপেট যুক্ত করব । আপনি আপনার থিম বা প্লাগইন ফাংশন ফাইলটিতে নিম্নলিখিতটি পেস্ট করবেন। আমি নীচেও দেখতে পাচ্ছি যে jQuery কোনও বিরোধ-মোডে রয়েছে তাও আমি নিশ্চিত করেছি made

add_action('wp_head','woocommerce_js');

function woocommerce_js()
{ // break out of php ?>

jQuery(document).ready(function($) {
    $(".woocommerce-cart").html(function(i, val) {
    return val.replace(" →", "");
    });
    $(".woocommerce-cart").html(function(i, val) {
    return val.replace("← ", "");
    });
});
<?php } // break back into php

একবার আপনি এটি করেন এবং আপনার পৃষ্ঠাটি সতেজ করে তোলার পরে, এই jQuery স্নিপেটটি আসলে আপনার পৃষ্ঠায় লোড হচ্ছে কিনা তা নিশ্চিত করার জন্য পৃষ্ঠার উত্সটি দেখুন। যদি তা হয় তবে এটি ব্যবহার করা উচিত যদি না আপনি ব্যবহার করছেন প্রকৃত jQuery স্নিপেটে কিছু বন্ধ থাকে।


যদিও জাভাস্ক্রিপ্ট লোড করার ওয়ার্ডপ্রেস উপায় নয়। দেখুন wp_enqueue_script()আরও তথ্যের জন্য।
প্যাট জে

2
হাই @ পেটজে, আমি সম্মত হলাম, এতে আপনার সমস্ত জাভাস্ক্রিপ্ট ফাংশন সহ কোনও বাহ্যিক জেএস লাইব্রেরি বা জেএস ফাইল লোড করার জন্য, তবে হ্যাঁ একেবারে সঠিক উপায় হবে। তবে আপনি যদি জাভাস্ক্রিপ্টের স্নিপেটটি লোড করছেন তবে পুরো নতুন জেএস ফাইল তৈরি করা এবং কেবলমাত্র এটির জন্য একটি অতিরিক্ত এইচটিটিপি অনুরোধ যুক্ত করার কোনও মানে নেই। গুগল অ্যানালিটিক্স উদাহরণস্বরূপ নিন, থিম বা কাস্টম বিল্ডগুলির 99% এ, জেএসকে থিম বিকল্প বা ফাংশন ফাইলের মাধ্যমে শিরোলেখ বা পাদলেখগুলিতে যুক্ত করা হবে। জেএস বা এমনকি সিএসএস স্নিপেটগুলি এইভাবে অন্তর্ভুক্ত করা এর সাধারণ অনুশীলন।
ম্যাট রয়্যাল

1
যদিও "প্রচলিত অনুশীলন" এটি সঠিক করে না। wp_enqueue_script()ডক্স এমনকি রাষ্ট্র এই একটি ওয়ার্ডপ্রেস উত্পন্ন পৃষ্ঠায় জাভাস্ক্রিপ্ট লিঙ্ক সুপারিশকৃত পদ্ধতি
প্যাট জে

আপনি যদি ওয়ার্ডপ্রেস ডিফল্ট বিশটি চৌদ্দ থিমটি নেন তবে এটি হেডার.এফপিতে html5.js লোড করে। এর কারণটি এই কারণেই দেওয়া হয়েছে যাতে ব্রাউজারটি চেক করতে আইআই <9 হওয়ার শর্তটি পূরণ করে তবে আমার বক্তব্যটি বোধগম্য, এনভুইং করা প্রস্তাবিত এবং পছন্দসই পদ্ধতি তবে আপনার চারপাশের অন্যান্য পরিবর্তনগুলি / পরিস্থিতিতে নির্ভর করে আপনি কী চান এটি অর্জনের চেষ্টা করা সর্বদা সবচেয়ে ব্যবহারিক নাও হতে পারে এবং আমি মনে করি কিছু বিচক্ষণতা ব্যবহার করা উচিত। দেখুন, আমি এই দৃষ্টিভঙ্গিতেও পুরোপুরি ভুল হতে পারি, সত্যিই অভিজ্ঞ কিছু লোকের কী বলতে হবে তা শুনতে আমি আগ্রহী :-)
ম্যাট রয়েল

আপনার দুর্দান্ত পরামর্শের জন্য ধন্যবাদ। যদিও আমি এটি কাজ করতে পারি না; যদি আমি আমার ফাংশনগুলির <? পিএইচপি ট্যাগের মধ্যে আপনার কোডটি যুক্ত করি তবে আমি একটি 'পার্স ত্রুটি: সিনট্যাক্স ত্রুটি, / সোমেপ্যাথ..অনুপ্রযুক্তি। যদি আমি এটি <? পিএইচপি এর বাইরে যুক্ত করি তবে মনে হয় পৃষ্ঠার উপরে প্রদত্ত কোডটি প্রতিধ্বনিত হয়। আমি এখানে কি মিস করছি?
ব্যবহারকারী2806026

0

উত্তরটি ইতিমধ্যে স্বীকৃত হিসাবে, আমি কেবল বলতে চাই যে আমি আরও অনেকবার জাভাস্ক্রিপ্ট কোডটি ফুটারে সজ্জিত করার অন্য উপায় আছে।

ফাংশন.এফপি ফাইলটিতে:

function load_script_to_remove_arrow(){
?>
<script>
$(document).ready(function() {
    $(".woocommerce-cart").html(function(i, val) {
    return val.replace(" →", "");
    });
    $(".woocommerce-cart").html(function(i, val) {
    return val.replace("← ", "");
    });
});
</script>
<?php
}
add_action( 'wp_footer', 'load_script_to_remove_arrow' );

আপনি কেবল শর্তটি ব্যবহার করে এই স্ক্রিপ্টটি নির্দিষ্ট পৃষ্ঠা টেম্পলেটটিতে লোড করতে পারেন

if( is_page_template( 'page-template.php' ) ):

//put above code (or just add_action part) inside this condition to load file only if the condition is true 

endif;

যদি পেজ-টেম্পলেট.এফপি ডিরেক্টরিতে থাকে (আপনার থিমের মূল ডায়ারে টেম্পলেট ডিরেক্টরি বলুন) আপনি লিখতে পারেন:

is_page_template( 'templates/page-template.php' );

আমি জাভা স্ক্রিপ্টটিকে এভাবে ফুটার মধ্যে "বেকিং" করার পরামর্শ দেব না। এটি এটিকে অগ্রহণযোগ্য বা পরিবর্তনযোগ্য (কমপক্ষে, সহজেই) হওয়া থেকে বিরত রাখে যা প্লাগইন এবং থিম বিকাশে অত্যন্ত গুরুত্বপূর্ণ। আপনি যদি কোনও সাইটের শেষ ব্যবহারকারী হন এবং দ্রুত স্ক্রিপ্ট বা কোনও কিছুর প্রয়োজন হয় তবে এর জন্য যান - তবে এখনও wp_enqueue_script()প্রায় সর্বদা সর্বজনীনভাবে আরও ভাল এবং আরও নমনীয়।
Xhynk

-1

প্রশ্নের উত্তর দেওয়ার জন্য আমাদের প্রথমে জাভাস্ক্রিপ্ট এবং জিকুয়েরির মধ্যে পার্থক্য করতে হবে।

এটি একটি সাধারণ ফ্যাশনে বর্ণনা করতে:

  • জাভাস্ক্রিপ্ট ECMAScript এর উপর ভিত্তি করে
  • JQuery জাভাস্ক্রিপ্ট জন্য একটি গ্রন্থাগার

সুতরাং বাস্তবে আপনি দুটি ভিন্ন প্রশ্ন জিজ্ঞাসা:

  • আপনার শিরোনাম জাভাস্ক্রিপ্ট প্রয়োগ করার জন্য একটি সমাধান সম্পর্কে কথা বলে
  • আপনার প্রশ্নটি JQuery প্রয়োগের জন্য একটি সমাধান সম্পর্কে কথা বলে

গুগলের ফলাফলগুলি আপনার শিরোনাম দেখায় এবং পৃষ্ঠার সমস্ত বিষয়বস্তু JQuery সম্পর্কে আলোচনা করে এটি জাভাস্ক্রিপ্ট সমাধানের সন্ধান করে এমন লোকদের জন্য খুব হতাশ হয়ে উঠতে পারে।

এবং এখন JQuery সমাধানের জন্য:

wp_enqueue_script( 'script-id', get_template_directory_uri() . '/js/script.js', array ( 'jquery' ), 1.1, true);

এবং জাভাস্ক্রিপ্ট সমাধান:

wp_enqueue_script( 'script-id', get_template_directory_uri() . '/js/script.js', array(), '1.0.0', true );

এই কোডটি আপনার ফাংশনগুলিতে যুক্ত করা যেতে পারে ph php উভয় ক্ষেত্রেই স্ক্রিপ্টগুলির অবস্থান wp-content/themes/theme-name/js/script.js

শুভ কোডিং!


ওপি পোস্ট করার সময়, ডেভস জেকোয়ারি এবং জাভাস্ক্রিপ্ট আন্তঃব্যবহার করে ব্যবহার করেছিল। এটি মোটেও নির্ভুল নয়, তবে এটি ছিল জনপ্রিয় জ্যাকোয়ারি এবং জাভাস্ক্রিপ্টের বৈশিষ্ট্যগুলি কীভাবে অনুপস্থিত ছিল।
রকি কেভ
আমাদের সাইট ব্যবহার করে, আপনি স্বীকার করেছেন যে আপনি আমাদের কুকি নীতি এবং গোপনীয়তা নীতিটি পড়েছেন এবং বুঝতে পেরেছেন ।
Licensed under cc by-sa 3.0 with attribution required.