ঘটনাক্রমে আপনার অর্ধ-ভরা ফর্মটি জমা না দিয়ে কোনও পৃষ্ঠা বন্ধ করা বিরক্তিকর। সম্প্রতি, আমাদের একজন ব্যবহারকারী আমাদের জিজ্ঞাসা করেছেন যে ফর্মগুলিতে ব্যবহারকারীর ক্রিয়াকে নিশ্চিত করে এমন পপ-আপ উইন্ডো প্রদর্শন করা সম্ভব ছিল কি? এই ক্ষুদ্র সামান্য সতর্কতা ব্যবহারকারীরা এবং অর্ধ-ভরাট ফর্মগুলির সাথে ঘটনাক্রমে পৃষ্ঠা বন্ধ করা থেকে তাদের বাধা দেয়।

এই টিউটোরিয়ালে, আমরা আপনাকে দেখাবো কিভাবে আপনার ওয়ার্ডপ্রেস ব্লগে ফর্মের জন্য একটি ক্লোজ অ্যাকশন কনফার্মেশন উইন্ডো প্রদর্শন করবেন।

ব্রাউজিং কনফার্মেশন পপআপ কী

মনে করুন কোনও ব্যবহারকারী আপনার ব্লগে একটি মন্তব্য লিখছে। তিনি ইতিমধ্যে একটি ভাল সংখ্যক লাইন লিখেছেন, তবে তারা বিভ্রান্ত হয় এবং মন্তব্য জমা দিতে ভুলে যায়। এখন উদাহরণস্বরূপ একটি লিঙ্কে ক্লিক করে, তিনি যে সমস্ত সামগ্রী লিখতে শুরু করেছেন তা হারিয়ে যাবে।

ব্রাউজিং নিশ্চিতকরণ তাদের মন্তব্য সম্পূর্ণ করার একটি সুযোগ দেয়।

আপনি নিবন্ধ / পৃষ্ঠা সম্পাদক ইন্টারফেস থেকে এই বৈশিষ্ট্যটি দেখতে পাবেন। যদি আপনার কোনও রক্ষা না করা পরিবর্তন হয় এবং আপনি পৃষ্ঠাটি প্রস্থান করার বা ব্রাউজারটি বন্ধ করার চেষ্টা করেন তবে আপনি একটি পপ-আপ সতর্কতা দেখতে পাবেন।

আসুন দেখুন কীভাবে আমরা আপনার ব্লগের ওয়ার্ডপ্রেস মন্তব্য এবং অন্যান্য ফর্মগুলিতে এই সতর্কতা বৈশিষ্ট্যটি যুক্ত করতে পারি।

ওয়ার্ডপ্রেসে সাবস্ক্রিপশন ফর্মগুলিতে কীভাবে একটি নিশ্চিতকরণ পপআপ প্রদর্শন করবেন

এই টিউটোরিয়ালের জন্য, আমরা করব একটি কাস্টম প্লাগইন তৈরি করুন. আমরা ইতিমধ্যেই আপনাকে দেখিয়েছি কিভাবে দ্রুত একটি ওয়ার্ডপ্রেস প্লাগইন তৈরি করবেন।

এর শুরু করা যাক।

প্রথমে আপনাকে আপনার কম্পিউটারে একটি নতুন ফোল্ডার তৈরি করতে হবে এবং এটিকে "কনফার্ম-অ্যাকশন" নামকরণ করতে হবে। এই ফোল্ডারে আপনাকে অন্য একটি ফোল্ডার তৈরি করতে হবে এবং এর নাম দিতে হবে js।

এখন নোটপ্যাডের মতো একটি পাঠ্য সম্পাদক খুলুন এবং একটি নতুন ফাইল তৈরি করুন। ভিতরে, কেবল নিম্নলিখিত কোডটি পেস্ট করুন:

<?php
/**
 * Confirmer Action
 * Plugin Name: Confirmer Action
 * Plugin URI:  https://blogpascher.com
 * Description: This plugin shows a warning to users when try they forget to hit submit button on a comment form. 
 * Version:     1.0.0
 * Author:      VotreNOM
 * Author URI:  https://blogpascher.com
 * License:     GPL-2.0+
 * License URI: https://www.gnu.org/licenses/gpl-2.0.txt
 */
 
function bpc_confirm_leaving_js() { 

     wp_enqueue_script( 'Confirm Leaving', plugins_url( 'js/confirm-leaving.js', __FILE__ ), array('jquery'), '1.0.0', true );
} 
add_action('wp_enqueue_scripts', 'bpc_confirm_leaving_js');

এই পিএইচপি ফাংশনটি সহজেই আপনার ওয়েবসাইটের সামনের প্রান্তে একটি জাভাস্ক্রিপ্ট ফাইল যুক্ত করে।

এগিয়ে যান এবং এই ফাইলটি "কনফার্ম-অ্যাকশন" হিসাবে সংরক্ষণ করুন.php" ফোল্ডারে ক্রিয়াটি নিশ্চিত "(আপনার প্লাগইনটির মূল)।

এখন আমাদের জাভাস্ক্রিপ্ট ফাইল তৈরি করতে হবে যা এই প্লাগইনটি লোড হবে। একটি নতুন ফাইল তৈরি করুন এবং এই কোডটির ভিতরে পেস্ট করুন:

jQuery এর (ডকুমেন্ট) .ready (ফাংশন ($) {$ (ডকুমেন্ট) .ready (ফাংশন () {needToConfirm = মিথ্যা; window.onbeforeunload = askConfirm;}); ফাংশন askConfirm () {করেন (needToConfirm) {// রাখুন আপনার কাস্টম বার্তা এখানে ফিরে "আপনার অসংরক্ষিত তথ্য হারিয়ে যাবে।";}} $ ( "# CommentForm") এক্সচেঞ্জ (ফাংশন () {needToConfirm = সত্য;})।})

এই ফাইলটির নতুন নাম দিন নিশ্চিত-leaving.js", এটিকে" সাবফোল্ডার "এ সরান js "এর" ক্রিয়াটি নিশ্চিত"।

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

আপনাকে এখন যা করতে হবে তা হ'ল আপনার ক্লায়েন্ট ব্যবহার করে আপনার ফাইলটি আপনার সার্ভারে আপলোড করা FTP ফেভারিট এর পরে, আপনাকে যা করতে হবে তা হ'ল আপনার ড্যাশবোর্ড থেকে প্লাগইনটি সক্রিয় করা।

এখানেই শেষ. আপনি এখন আপনার ওয়েবসাইটে একটি নিবন্ধ দেখতে পারেন, একটি মন্তব্য লেখার চেষ্টা করুন তারপরে একটি লিঙ্কে ক্লিক করুন, আপনি এটির মতো একটি পপআপ লক্ষ্য করবেন।

অন্যান্য ওয়ার্ডপ্রেস ফর্মগুলিতে সতর্কতার সংযোজন

আপনার ওয়ার্ডপ্রেস সাইটের সকল ফর্মকে টার্গেট করার জন্য আপনি একই কোড ব্যবহার করতে পারেন। এখানে, আমরা আপনাকে একটি যোগাযোগ ফর্মের একটি উদাহরণ দেখাবো।

এই উদাহরণে, আমরা প্লাগিন ব্যবহার করি WPForms একটি যোগাযোগ ফর্ম তৈরি করতে। আপনি যদি অন্য একটি ব্যবহার করেন তবে নির্দেশাবলী একই থাকবে যোগাযোগ ফর্ম জন্য প্লাগইন আপনার সাইটে।

আপনি যেখানে নিজের যোগাযোগের ফর্মটি যুক্ত করেছেন সেই পৃষ্ঠাতে যান। আপনার পরিচিতি ফর্মের প্রথম ক্ষেত্রের উপর মাউসটি সরান, ডান ক্লিক করুন, তারপরে "নির্বাচন করুন" পরিদর্শন করা“, উত্স কোড অ্যাক্সেস করতে।

ট্যাগ দিয়ে শুরু যে লাইন জন্য সন্ধান করুন <form>। ফর্ম ট্যাগে আপনি আইডি বৈশিষ্ট্যটি পাবেন। এই উদাহরণে, আমাদের ফর্মের আইডি formulaire । আপনাকে অবশ্যই আইডি বৈশিষ্ট্যটি অনুলিপি করতে হবে।

এখন, সম্পাদনা করুন confirmer-leaving.js ফাইল দিন এবং পরে আইডি বৈশিষ্ট্য যুক্ত করুন " #commentform কমা দ্বারা পৃথক করা।

আপনার কোডটি দেখতে এমন হওয়া উচিত:

jQuery (ডকুমেন্ট)। ইতিমধ্যে (ফাংশন ($) {$ (ডকুমেন্ট)। ইতিমধ্যে (ফাংশন () {needToConfirm = false; window.onbeforeunload = জিজ্ঞাসা নিশ্চিত করুন;}); ফাংশন জিজ্ঞাসা করুন নিশ্চিত করুন () {যদি প্রয়োজন হয় তবে) {// $ বার্তা ("# মন্তব্য, # ফর্ম")। পরিবর্তন (ফাংশন () {প্রয়োজন TConfirm = সত্য;});})

আপনার পরিবর্তন এবং সংরক্ষণ করুন আপনার ওয়ার্ডপ্রেস ব্লগ আপনার প্লাগইন ইনস্টল করুন.

এই এই টিউটোরিয়াল জন্য। আশা করি এটি আপনাকে আপনার ব্লগে একটি পপ আপ কনফার্মেশন উইন্ডো যুক্ত করতে সহায়তা করবে। কোন বিষয় বুঝতে না পারলে প্রশ্ন জিজ্ঞাসা করতে দ্বিধা করবেন না।