কিভাবে ব্লগে Random Quote এড করবেন এখুনি দেখুন

আশাকরি আল্লাহর রহমতে ভালো আছেন, আমিও আল্লাহর রহমতে ভালো আছি তাই আপনাদের মাঝে নিয়ে আসলাম নতুন একটি পোষ্ট

কিভাবে আমাদের ব্লগের মতো আপনার ব্লগে বা ওয়েবসাইটে একটি Random Quote Generator যোগ করবেন?

তো চলুন আজকের আলোচনা শুরু করা যাক

---

প্রথমে আপনার ব্লগে সাইন ইন করুন, এর পর নিচের ছবির মত theme লেখার উপর ক্লিক করুন,,

এর পর নিচের ছবি গুলোর মতো কাজ করুন,

এবার উপরের ছবিতে মার্ক করা জায়গায় অর্থাৎ body ট্যাগ এর উপরে নিচের কোডটি কপি করে বসিয়ে দিন। <script> let quoteData = [ { quoteText: 'অসৎ লোক কাউকে সৎ মনে করে না, সকলকেই সে নিজের মতো ভাবে ”', author: 'হযরত আলী (রাঃ)' }, { quoteText: 'যে নিজে সতর্কতা অবলম্বন করে না, দেহরক্ষী তাকে বাঁচাতে পারে না', author: 'হযরত আলী (রাঃ)' }, { quoteText: ' যা সত্য নয় তা কখনো মুখে এনো না । তাহলে তোমার সত্য কথাকেও লোকে অসত্য বলে মনে করবে', author: 'হযরত আলী (রাঃ)' }, { quoteText: 'বুদ্ধিমানেরা কোনো কিছু প্রথমে অন্তর দিয়ে অনুভব করে, তারপর সে সম্বন্ধে মন্তব্য করে। আর নির্বোধেরা প্রথমেই মন্তব্য করে বসে এবং পরে চিন্তা করে।', author: 'হযরত আলী (রাঃ)' }, { quoteText: 'দরিদ্রকে দান করিলে সেই দানের জন্য একটি পুরষ্কার আছে। কিন্তু অভাবগ্রস্ত আত্নীয়-স্বজনকে দান করিলে সেই দান করিলে সেই দানের জন্য দুইটি পুরষ্কার আছে, একটি দানের জন্য, অন্যটি আত্নীয়কে সাহায্য করার জন্য।', author: 'আল হাদিস' }, { quoteText: 'মানুষের ভিতরে এমন একটি অংশ আছে ওই অংশটি যদি পরিশুদ্ধ হয় তাহলে মানবদেহের পুরো অংশ পরিশুদ্ধ হয়। কিন্তু যদি ওই অংশটি নষ্ট হয়ে যায়, তাহলে মানবদেহের পুরো অংশ নষ্ট হয়ে যায়। সেই অংশটি হলো ”আত্মা”।', author: 'আল হাদিস' }, { quoteText: 'সে ব্যক্তি মুমিন নয় যে নিজে তৃপ্তি সহকারে আহার করে, অথচ তার প্রতিবেশী অনাহারে থাকে ', author: 'আল হাদিস' }, { quoteText: 'আমি আল্লাহকে সবচেয়ে বেশি ভয় পাই। তারপর সেই মানুষকে ভয় পাই যে আল্লাহকে মোটেই ভয় পায় না।', author: 'শেখ সাদী' }, { quoteText: 'ইহকাল ভুলে যারা পরকালে মত্ত হয়ে আছে চলে যাক সব পরপারে বেহেস্তে তাদের আমরা থাকবো এই পৃথিবীর মাটি জলে নীলে, দ্বন্দ্বময় সভ্যতার গতিশীল স্রোতের ধারায় আগামীর স্বপ্নে মুগ্ধ বুনে যাবো সমতার বীজ', author: 'রুদ্র মুহাম্মদ শহীদুল্লাহ' }, { quoteText: 'আজ আপনি যে ছেলে/মেয়েটার সাথে হারাম সম্পর্কে লিপ্ত আছেন বিচারদিবসে সে-ই আপনার বিরুদ্ধে সাক্ষ্য দিবে।', author: 'ড. বিলাল ফিলিপ্স' } ]; let c = (a) => { return document.querySelector(a); }; window.onload = function() { setTimeout(() => { let randNumber = Math.floor(Math.random() * quoteData.length); console.log(randNumber) c('.quoteTxt').innerHTML = quoteData[randNumber].quoteText; c('.author').innerHTML = quoteData[randNumber].author; }, 2000) }; </script>

এবার Save এ ক্লিক করে , নিচের মতো Layout এ ক্লিক করে

আপনে যে সেকশনে/জায়গায় Quote টি এড করতে চান সেই জায়গায় একটি HTML/JavaScript Widget এড করে নিন এখন title এর জায়গায় একটি টাইটেল দিন যেমন: ইসলামিক বাণী আপনি অন্য কিছু ও দিতে পারেন। Image:

এর পর content box এ নিচের কোডটি কপি করে বসিয়ে দিন। content box code: <div class="container"> <div class="quoteTitle"></div> <div class="quoteBody"><i class="fa fa-quote-left" aria-hidden="true"></i><span class="quoteTxt">Loadding</span><i class="fa fa-quote-right" aria-hidden="true"></i> </div> <div class="quoteAuthor"><span>--</span><span class="author">Loadding...</span></div> </div> ব্যাস কাজ শেষ,এখন আপনার ব্লগটি ভিউ করে দেখুন Quote দেখা যাচ্ছে কিনা? কোন সমস্যা হলে কমেন্ট করুন, আমি সমাধান দেওয়ার চেষ্টা করব ইনশাআল্লাহ। খোদা হাফেজ।