नमस्कार दोस्तों मेरा नाम है रहमान और मैं हूँ TryTechInfo का Founder तो चलिए शुरू करते है। दोस्तों इस पोस्ट में मैं आपको बताने वाला हूँ की Try Editor क्या है। Try it Editor कैसे और क्यों बनाते है। तो आइये जान लेते है हमारे इस पोस्ट में Tryit Edotor बनाने और उसे अपनी वेबसाइट ब्लॉग में add करने के बारे में।
दोस्तों अक्सर आपने W3 School नामक वेबसाइट में एक Try Editor देखा होगा जहां पर आप कोई भी कोडिंग करके आसानी पूर्वक उसका Output यानि के उसका ( परिणाम ) देख सकते है।
लेकिन कुछ लोगो के मन में एक सवाल खलबली तो मचाता ही होगा। की आखिर यह Try Editor कैसे बनाया जाता है। तो यदि यह सवाल आपके मन में भी है, तो इस पोस्ट को पढ़ते रहिये।
Try Editor क्या है?
Try editor ek lightweight HTML Editor होता है जिसमे हम HTML, CSS, Javascript, jQuery etc. coding सिख सकते हैं। इसका इस्तेमाल Online Coding Design सिखने के लिए किया जाता हैं। Try editor को Try it editor या Tryit editor भी कहते हैं।
ये Online Coding सिखने और live design update करने का बहुत ही आसान और simple तरीका हैं। यहाँ मैं आपको Try Editor Demo दिखा रहा हूँ आप इसमें HTML, CSS, Javascript coding editing करके देख सकते हैं।
हैं न बहुत ही मजेदार तो चलिए अब जन लेते हैं की इसे कैसे बनाते हैं ताकि आप भी अपनी वेबसाइट और ब्लॉग में Try editor add कर सकें।
Try Editor कैसे और क्यों बनाते है?
दोस्तों सबसे पहले मैं आपको बता दूँ, की Try Editor उन लोगो के काम आता है जो अपनी वेबसाइट में कोडिंग सिखाते है। अब जाहिर सी बात है कुछ लोग बहुत अच्छा सिखाते है लेकिन उनकी एक नादानगी जो उनकी सबसे बड़ी सबसे बड़ी भूल बन जाती है।
वह यह है,की वह लोग अपनी वेबसाइट में Tryit Editor नहीं लगाते जिस कारण सीखने वाले अच्छे से सीख नहीं पाते और एक समय ऐसा भी आता है, की वह लोग उस वेबसाइट से सीखना ही बंद कर देते है।
जिसका परिणाम शब्दों में बया नहीं किया जा सकता । लेकिन दोस्तों अगर आप भी कोडिंग सिखाते है, तो कही आपके साथ ऐसा न हो जाए इससे पहले ही हम आपको Try it Editor बनाना सीखा देंगे। तो आइये जान लेते है, की एक Try Editor कैसे बनाया जाता है।
दोस्तों वैसे तो इस समय वेबसाइट में Try Editor प्रयोग करने हेतू कोई Plugins उपलब्ध नहीं है। परन्तु इसे कोडिंग के माध्यम से आसानी पूर्वक बनाया जा सकता है, जो के निम्न प्रकार है।
<div style="border:1px solid #333;padding:20px;margin-bottom:10px">
<div style="background:#f1574d; color: white;">
<h3 style="color:white;padding:10px;text-align:center">HTML सीखना चाहतें है, तो यहां प्रयास करें!</h3></div>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>jQuery Insert HTML inside an iFrame</title>
<script src="https://code.jquery.com/jquery-1.12.4.min.js"></script>
<style type="text/css">
br { display: none; }
textarea, iframe{display: block;margin: 10px 0;width:100%;border: 1px solid #333;}
</style>
<script type="text/javascript">
function updateIframe(){
var myFrame = $("#myframe").contents().find('body');
var textareaValue = $("textarea").val();
myFrame.html(textareaValue);
}
</script>
</head>
<body>
<textarea rows="5" cols="50" placeholder="Type HTML or text here..."></textarea>
<button style="border:0" type="button" onclick="updateIframe()">Run Code </button>
<iframe id="myframe"></iframe><a style="text-align: right; display: block; margin-bottom: -30px;" href="https://www.supportmeindia.com/try-editor-kya-hai-html-try-it-editor-kaise-banaye/" target="_balnk">Try Editor source link</a></body>
</html>
</div>
तो दोस्तों इस प्रकार से आप अपनी वेबसाइट में Try Editor लगाकर अपनी वेबसाइट के माध्यम से लोगो को और भी अच्छी तरह से सीखा सकते है।
तो दोस्तों उम्मीद करता हूँ, की अब आप Try it Editor बनाना सिख चुके होंगे। और अगर आपको यह पोस्ट पसंद आया या फिर आपका कोई भी सवाल एवं सुझाव है, तो आप हमें नीचे कमेंट बॉक्स में बता सकते है।
और हो सके तो इस पोस्ट को अपने दोस्तों के साथ शेयर करें ताके वह भी Try Editor के बारे में जान सके, धन्यवाद्
Subscribe this blog to get latest post notification via mail.
akhilesh kumar
Wah!
ye to bahut achha widget hai, maine apne website par iska use kiya…
thanks
Suneet Srivastava
Thank you bhai kb se ye pata karna chah rha tha aaj mil hi gya
Sahin
sir sabko “Earnings at risk – One or more of your ads.txt files doesn’t contain your AdSense publisher ID” ye message mil raha hai adsense ki traf se ye kya hai, aur ads.txt file missing hai ya nahi kaise pata kare kaise is problem se bache plz ek post kariye na….
Jumedeen khan
Check “SUMIT KUMAR GUPTA” comments.
Sahin
ha comment karne ke bad ye problem thik ho gaya but mera ek sawal hai aapse main jab blogger dashboard ke earning menu se adsense ke liye apply kiya tha tab mere galti ke karan adsense disapproved ho gaya tha bad me main direct dusre site se adsense ke liye apply kiya tha aur mere pahle wala site ko bhi add kar liye tha usi adsense ke sath aur aabhi me dono se earning karta hu.. to mera sawla hai is update se mere disapproved wala blog ka koi problem to nahi hoga na… 2 saal se istemal kar raha hu….
Jumedeen khan
No problem.
shabnam khan
Nice information sir thank you
Deepesh pandole
Sir WordPress blog post me quiz kaise banaye
Jumedeen khan
Plugin use karo
Shahid Afridee
Earnings at risk – One or more of your ads.txt files doesn’t contain your AdSense publisher ID. Fix this now to avoid severe impact to your revenue.
ACTION
Bhai mere AdSense account me ye new red colour ka Notification show ho raha Hai so iska kya matlav details me bata sakte Hai jaldi batana Bhai.
Jumedeen khan
Check karo ki aapke sabhi ads m publisher ID same hai agar haa to no worry ye issue apne aap fix ho jayega.
Shahid Afridee
Bhai sabhi Ads ki publisher I’d same Hai,Lekin mai us code p – I’d Ko jab add custom robot.txt me save karta hu to error aa raha Hai.matlav save nahi ho raha Hai.
Jumedeen khan
Shahid koi solution btaye to use sahi se fix kiya karo maine aapke blog me check kiya hai ek se jyada publisher id hai. Aap blog ke view page source code me “pub-” search karke id check karo.
SUMIT KUMAR GUPTA
@sahid afreedi agar aapka blog blogger par hai to google ne ek nya option add kiya hai custom ads.txt ka usme ye code add kare
google.com, pub-0000000000000000, DIRECT, f08c47fec0942fa0
0000000000000000 ke jagah par apna published id add kare.
Shahid Afridee
Sumit Kumar Gupta Jee,ACTION par click karne Ke baad Jo code diya Hai usko blogger settings > search performance> custom robot.txt me add karne Ko kah rahe Hai kya
Mohan rajput
Wao Sir main jankari ka kab se intjar kar raha tha. thanks.
arjun
jumedin jaise hamne YouTube audio library se koi music download kiya to kya ham us music ko apne har video me use kar sakte h ya sirf ek hi video me ek hi music use karna hota hai
Jumedeen khan
Aap ek music ko kitni bhi video me use kar sakte ho.