হ্যালো বন্ধুরা, অনলাইন কাজ ব্লগে স্বাগতম আজ এই পোস্টে, আমরা ব্লগার উপর শুভ নববর্ষের উইশিং উইজেট স্ক্রিপ্ট সম্পর্কে জানব। এবং এমন পরিস্থিতিতে, আজকাল অনেক ব্লগিং করতে ব্লগার বা ব্লগস্পট ব্যবহার করে।
এমন পরিস্থিতিতে ব্লগারের জন্য কোনও প্লাগইন ইনস্টল করার কোনও সুবিধা নেই। সুতরাং এটির জন্য ব্লগার উইজেট শুরু করা হয়েছে। এইভাবে কোডিং করে নতুন ব্লগার উইজেট তৈরি করা হচ্ছে।
নতুন বছরের পপআপ উইজেট উইশিং?
অবশ্যই পড়ুন-
এটি আপনার ব্লগে প্রয়োগ করতে কিছু স্ক্রিপ্ট ব্যবহার করতে হবে। এই স্ক্রিপ্টটিতে এইচটিএমএল এবং খাঁটি সিএসএসের মিশ্রণ দেখা যায়। সুতরাং নীচে দেওয়া পদক্ষেপগুলি অনুসরণ করুন।
ব্লগারে কীভাবে নতুন বছরের পপআপ উইজেট যুক্ত করবেন?
- First of All Go To Blogger Dashboard
- Now Go To Theme > Edit Theme & Search </Head>
- Copy CSS Code Bellow & Paste Above </Head> Tag
<style>
/* New Year Pop Up Widget By Onlinekaj.com */
@-webkit-keyframes hue { 100% { -webkit-filter:hue-rotate(360deg); }} .AT-new-year{ position: fixed; background-image: url('https://cdn.statically.io/img/1.bp.blogspot.com/-iT8SkVmVQf8/X-CNYZtQyFI/AAAAAAAADPc/HWj3qmXbqIMB0IiUHJ15Eep98GAaDLDQQCLcBGAsYHQ/s0/pngtree-festive-2019-pig-new-year-background-design-display-boardspring-festival-image_74331.jpg'); background-size:cover;-webkit-animation:hue 1s linear infinite; z-index: 50; align-items: center; max-width: 500px; max-height: 300px; border-radius: 5px; box-shadow: 0 6px 18px 0 rgba(9,32,76,.035); display: flex; padding: 12px 15px 12px 12px; left: 50%;box-sizing: border-box;transform: translate(-50%, -100%); top: 70%;width: 100%; height:100%;text-align: center;border: 4px solid #fefefe; } .AT-new-year:before{ content: ""; background-image: url('https://cdn.statically.io/img/1.bp.blogspot.com/-IELKsnCdJ_E/X-CNUytCXVI/AAAAAAAADPU/ajvjFLDFEbE8qCFuQLn0Z93HR6NymMpOwCLcBGAsYHQ/s0/giphy.gif'); background-size:cover; width: 100%; height:100%; opacity: 0.1; } .AT-close svg { width: 35px; height: 35px; fill: #fff; position: absolute; top: 4px; right: 8px; } .text-content{ z-index: 2; color: #fff; position: absolute; display:block; align-items: center;width: 100%; justify-content: center;padding-bottom: 42px; } .title2 { font-size: 34px; font-weight: 800;display:block; text-align: center; } .title2x{ font-size: 68px; font-weight: 800; text-align: center;display:block;text-shadow: 4px 4px #222, 7px 5px #ffff00; } .subtext{ font-size: 12px;display:block;padding-top:12px;font-family: 'Bangers', cursive; } .player-bottom { display:block;align-items: center;text-align: center;justify-content: center;} audio{height:32px; width: 250px; position: fixed; top: 92%; left: 52%; display: flex;flex-grow: 1; transform: translate(-50%, -100%); }
</style>
- Go To <Layout> in Your Blogger
- Now Copy The Following HTML Codes & Paste Bellow <Add Gedget>
<b:if cond='data:view.isHomepage'>
<div class='AT-new-year' id='746427'> <div class='AT-close' onclick='document.getElementById("746427").style.display="none"'><svg viewBox='0 0 512 512' xmlns='http://www.w3.org/2000/svg'><path d='M278.6 256l68.2-68.2c6.2-6.2 6.2-16.4 0-22.6-6.2-6.2-16.4-6.2-22.6 0L256 233.4l-68.2-68.2c-6.2-6.2-16.4-6.2-22.6 0-3.1 3.1-4.7 7.2-4.7 11.3 0 4.1 1.6 8.2 4.7 11.3l68.2 68.2-68.2 68.2c-3.1 3.1-4.7 7.2-4.7 11.3 0 4.1 1.6 8.2 4.7 11.3 6.2 6.2 16.4 6.2 22.6 0l68.2-68.2 68.2 68.2c6.2 6.2 16.4 6.2 22.6 0 6.2-6.2 6.2-16.4 0-22.6L278.6 256z'/></svg></div> <div class='text-content'> <div class='title2'> HAPPY NEW YEAR </div> <div class='title2x'> 2021 </div> <div class='subtext'> Looking forward to new adventures. </div> </div> <div class='player-bottom'> <audio autoplay='' controls=''> <source src='https://www.tones7.com/media/happy_new_year281212.mp3' type='audio/mpeg'/> </audio> </div> </div>
</b:if>
এখন আপনার ব্লগটি দেখুন বা রিফ্রেশ করুন
বাছ! চালু আপনার নতুন বছরের পপআপ উইজেট বক্স দেখুন?
আমাদের শেষ কথাঃ
বন্ধুরা এই পোস্টে ব্লগারে জন্য এই শুভ নববর্ষের উইশিং পপআপ উইজেট স্ক্রিপ্টটি আপনি কী পছন্দ করেছেন। নিচে কমেন্ট করতে ভুলবেন না। এবং এই পোস্ট আপনার বন্ধুদের সাথে শেয়ার করুন।
Post a Comment
By commenting you acknowledge acceptance of Whatisloved.com-Terms and Conditions