How I found a bug in WooCommerce

Code Is Poetry

I love poems and sometimes I dare to write some to express my feelings that I cannot describe to anyone, actually I write to express pain and anger. But today I’m not gonna write any poem and you won’t get any chance to experience how worst my feelings are. Today I’m gonna tell you exactly how I found a bug in WooCommerce, which no one noticed before me. Isn’t it interesting and exciting?

Code Is Poetry, I hope you heard this before. This famous phrase is coined by WordPress and these 3 words extremely inspired me that I started to like WordPress very much and it became the only source of my livings. Honestly, WordPress is not just a tool for me; I have an emotional relationship with it. Let’s keep this story secret for another day.

I first heard about WordPress in 2011 and since then I always read books, articles, and blogs about it. Reading about WordPress became habitual. But only books, articles and blogs weren’t enough compared to my thirsty anymore. So I started to read codes. I read functions definition, classes definition or whatever feels interesting. I read because I wanna figure out WHY. I read because I wanna know things deeply. I read because I get the feeling of reading a poem. I believe every single line of code has a strong relationship with emotion, a logical emotion!

Recently started working on a WooCommerce project. So usually I spend most of my working time with WooCommerce and at short break I read WooCommerce core codes. Like other days I opened a file in my favorite IDE and started to read from the top. After reading few lines I got surprised! What, why it’s counting $all_notices it is supposed to count $notices. A Few seconds later I realized that I discovered a bug. Yahoo, I found a bug in WooCommerce!

So, this the story of my bug hunting. I hope you’ll start to read code and experience how code becomes poetry. Trust me, you’ll learn a lot by reading codes.

*Pardon me for my not so bad English!

Happy reading, happy hunting 🙂

উকমার্স প্রোডাক্ট মেটাবক্স এবং মেটাডাটা

ওয়ার্ডপ্রেসে মেটাবক্স এ্যাড করা, মেটাডাটা সেভ করা, ডিলিট করা এসবের সাথে কমবেশি আমরা সবাই পরিচিত। প্রাচীনকালে আমরা add_meta_box দিয়ে কাস্টম মেটাবক্স এ্যাড করতাম। কিন্তু মহান সব ডেভেলপারদের কল্যানে আমাদের আর কষ্ট করে মেটাবক্স বানানো আর মেটাডাটা সেভ করার মত লো লেভেলের কাজ গুলি করতে হয়না। মেটাবক্স বানানোর চমৎকার সব ফ্রেমওয়ার্ক ব্যবহার করে আমরা সহজেই প্রয়োজনীয় কাজ সেরে ফেলতে পারি।

কিন্তু আজকে আমরা কোন মেটাবক্স ফের্মওয়ার্ক শিখবো না। কারণ উকমার্সে মেটাবক্স আর মেটাডাটা নিয়ে কাজ করাটা বেশ সহজ এবং এর জন্য সাধারণত কোন ফ্রেমওয়ার্কের প্রয়োজন হয়না। উকমার্সের নিজস্ব সুন্দর একটি মেটাবক্স সিস্টেম আছে। যেখানে মেটাফিল্ড গুলি ট্যাব আকারে গ্রুপ করে সাজানো থাকে। আমরা সহজেই নির্দিষ্ট এ্যাকশন হুক ব্যবহার করে সেসব ট্যাবে আমাদের প্রয়োজনীয় মেটাফিল্ড যুক্ত করতে পারি। আবার চাইলে সম্পূর্ণ নতুন একটি ট্যাবও বানিয়ে ফেলতে পারি। আজকে আমরা Awesome Tab নামে নতুন একটি ট্যাব বানিয়ে সেখানে মেটাফিল্ড যুক্ত করা শিখব। এখানে ব্যবহৃত সকল কোড আমরা functions.php যুক্ত করে কাজ করব।

ট্যাব আকারে সাজানো উকমার্স মেটাবক্স

Awesome Tab এ্যাড করা:

ট্যাব এ্যাড করার জন্য woocommerce_product_data_tabs ফিল্টার হুকে নতুন ট্যাবের কনফিগারেশন এ্যারে বর্তমান ট্যাবগুলির কনফিগারেশনের সাথে মার্জ করে পাঠাতে হয়। ফিল্টার হুকটি শুধুমাত্র একটি আর্গুমেন্ট $tabs একসেপ্ট করে, যা হল বর্তমান ট্যাবগুলির কনফিগারেশন এ্যারে। ট্যাবের কনফিগারেশন হিসেবে নিচের ডাটাগুলি পাস করতে হয়ঃ

  • label – ট্যাবের লেবেল, আমাদের ট্যাবের ক্ষেত্রে যা Awesome Tab
  • target – ট্যাবের টার্গেট হিসেবে ট্যাব প্যানেলের আইডি পাস করতে হয়। আমাদের Awesome Tab এর ক্ষেত্রে যা awesome-tab
  • class – ট্যাবের জন্য এডিশনাল কোন ক্লাস দিতে চাইলে এ্যারে ইলিমেন্ট হিসেব দিতে হয়।
  • priority – প্রায়োরিটির উপর নির্ভর করবে ট্যাবের প্লেসমেন্ট বা ট্যাবটি কোথায় দেখাবে। বেশি হলে নিচের দিকে আর কম হলে উপরের দিকে দেখাবে।

functions.php তে কোড গুলি এ্যাড করার পর এ্যাড কিংবা এডিট প্রোডাক্ট পেজে গেলে আমরা নিচের মত Awesome Tab নামে নতুন একটি ফিল্ড ছাড়া ট্যাব দেখতে পাবো।

Awesome Tab এ ফিল্ড এ্যাড করা:

ট্যাবে ফিল্ড এ্যাড করার জন্য woocommerce_product_data_panels এ্যাকশন হুকে নিচের মত করে কোড লিখতে হবে। এ্যাকশন হুকটি কোনো আর্গুমেন্ট একসেপ্ট করেনা। আমরা এখানে woocommerce_wp_text_input ফাংশনটি ব্যবহার করেছি যা উকমার্সের নিজস্ব ফাংশন। এটি দিয়ে খুব সহজেই টেক্সট ফিল্ড বানানো যায়। এরকম আরো কিছু ইউটিলিটি ফাংশন রয়েছে যা দিয়ে খুব সহজেই ইনপুট ফিল্ড বানানো যায়। আমরা অন্য কোন লেখায় সেসব শিখব।

functions.php তে কোড গুলি এ্যাড করার পর এ্যাড কিংবা এডিট প্রোডাক্ট পেজে গেলে Awesome Tab দুটি টেক্সট ফিল্ড দেখতে পাবো।

Awesome Tab এর ডাটা সেভ করা:

ট্যাবের ডাটা সেভ করার করা জন্য woocommerce_admin_process_product_object এ্যাকশন হুকে ডাটা সেভ করার ফাংশনালিটি লিখতে হবে। এই হুকটি Product Object $product আর্গুমেন্ট হিসেবে একসেপ্ট করে। নিচের কোডে সেভ করার ফাংশনালিটি লেখা আছে।

সবগুলি কোড একসাথে পেতে চাইলে ক্লিক করুন

— ধন্যবাদ 🙂

উকমার্সে প্রোডাক্ট টাইপ অপশনস ডিফল্ট সেট করা

বর্তমানে একটি ইকমার্স সাইটের কাজ করছি, যেখানে ক্লায়েন্ট তার ডিজিটাল প্রোডাক্ট সেল করবে। ক্লায়েন্ট EDD ব্যবহারে ইচ্ছুক নয় কারণ EDD -র বেশির ভাগ এ্যাডঅন (Addon) প্রিমিয়াম। এজন্য ক্লায়েন্টের একমাত্র পছন্দ হল উকমার্স (WooCommerce)।

যেহেতু ক্লায়েন্টের সব প্রোডাক্টই হল ডিজিটাল তাই উকমার্সের সেটিংস অনুযায়ী সব প্রোডাক্ট হবে ভার্চুয়াল (Virtual) এবং ডাউনলোডেবল (Downloadable)। এবং ক্লায়েন্ট শুধুমাত্র Simple টাইপের প্রোডাক্ট এন্ট্রি দিবে। এখন সমস্যা হল প্রতিবার নতুন প্রোডাক্ট এন্ট্রি দেবার সময় ভার্চুয়াল এবং ডাউনলোডেবল চেকবক্স মার্ক (Checked) করে দিতে হবে। এর সমাধান চিন্তা করতে গিয়ে মনে হল নিশ্চয়ই এর জন্য কোন না কোন ফিল্টার হুক আছে। উকমার্সের কোর ফাইলে সার্চ করেই পেয়ে গেলাম কাংখিত সেই ফিল্টার হুকটি। নিচে কোড স্যাম্পলঃ

— ধন্যবাদ 🙂