বিনামূল্যে UTM ক্যাম্পেইন লিঙ্ক বিল্ডার

কিভাবে কাজ করে

UTM বিল্ডার পুরোপুরি ব্রাউজারে আদর্শ URL ও URLSearchParams API দিয়ে ট্র্যাকিং URL তৈরি করে — কোনো সার্ভার বা আপলোড নেই। টাইপ করার সময় একটি লাইভ useMemo হুক আপনার মূল URL পার্স করে, hostname যাচাই করে, এবং শুধু আপনার পূরণ করা UTM প্যারামিটার যোগ করে।

1. 1
   URL পার্সিং ও যাচাই

   আপনার মূল URL ব্রাউজারের বিল্ট-ইন URL constructor-এ দেওয়া হয়। কোনো scheme না থাকলে টুলটি স্বয়ংক্রিয়ভাবে শুরুতে https:// বসায়, তারপর দেখে hostname-এ অন্তত একটি ডট আছে (বা localhost) কি না — এলোমেলো লেখা আউটপুট নষ্ট করার আগেই বাতিল করে।
2. 2
   URLSearchParams দিয়ে UTM প্যারামিটার যোগ

   প্রতিটি পূরণ করা ঘর (source, medium, campaign, term, content) URLSearchParams.set() দিয়ে URL-এর search-params অবজেক্টে লেখা হয়। lowercase টগল চালু থাকলে এই পর্যায়ে মানগুলো ছোট হাতের করা হয়, যা বড়-ছোট হাতের অসামঞ্জস্যে ভুল অ্যাট্রিবিউশন রোধ করে।
3. 3
   qrcode লাইব্রেরি QR কোড আঁকে

   চূড়ান্ত URL বদলালেই qrcode লাইব্রেরি ইনলাইন প্রিভিউর জন্য একটি 256-px data-URL তৈরি করে এবং একই সাথে একটি অফ-স্ক্রিন ক্যানভাসে 1024-px সংস্করণ আঁকে। তারপর ক্যানভাস canvas.toBlob() দিয়ে একটি PNG Blob-এ সিরিয়ালাইজ হয়, যাতে ডাউনলোড বোতাম সিঙ্ক্রোনাসভাবে সেভ করতে পারে — iOS-এ এটি প্রয়োজনীয়, কারণ ক্লিক হ্যান্ডলারের ভেতরে async Blob তৈরি আটকানো হয়।
4. 4
   পেজ hash দিয়ে শেয়ারযোগ্য টেমপ্লেট

   ফর্মের state (মূল URL ও যেকোনো UTM মান) window.history.replaceState দিয়ে ক্রমাগত পেজের URL fragment-এ এনকোড হয়। সেই hash-যুক্ত URL যে খোলে সে আগে থেকে পূরণ করা ফর্ম পায়, তাই কোনো সার্ভার-সাইড সংরক্ষণ ছাড়াই ক্যাম্পেইন টেমপ্লেট সেভ বা শেয়ার করতে পারেন।

সম্পর্কিত টুলস