বন্ধুরা সবাই ক্যামন আছেন আশাকরি ভালো আছেন । কিছু দিন পর এলাম আশাকরি ভালো আছেন । যাই হোক ভালো ও সুস্থ থাকেন এবং সব সময় এসো বন্ধুর সাথেই থাকেন সেই দোয়াই করি । আজকে আমি আপনাদের জন্য সুন্দর একটি ওয়েডগেট নিয়ে এলাম আশাকরি আপনাদের পছন্দ হবে । আপনি অনেক জন্য প্রিয় ব্লগে দেখেবন এই NOTIFICATION BAR । এটার অনেক কাজ আছে সেটা আপনি কোন কাজে ব্যবহার করবেন সেটা আপনার ব্যাপার । যাই হোক চলুন দেখে নিন কিভাবে এটাকে আপনার ব্লগে যুক্ত করবেন ।
আশাকরি উপরের ফটো দেখে বুজতেই পারছেন আমি ঠিক কোন বিষয় নিয়ে পোস্ট করছি । না বুঝতে পারলে নীচের ডেমো বাটনে ক্লিক করে ডেমো দেখে আসুন ।
আশাকরি উপরের ফটো দেখে বুজতেই পারছেন আমি ঠিক কোন বিষয় নিয়ে পোস্ট করছি । না বুঝতে পারলে নীচের ডেমো বাটনে ক্লিক করে ডেমো দেখে আসুন ।
আশাকরি এবার বিস্তারিত বুজতে পারলেন তাহলে এবার দেখে নিন কিভাবে এই স্টাইলটি আপনার ব্লগে যুক্ত করবেন । খুব সোজা নীচের ছোট স্টেপ গুলো একটু লক্ষ করুন ।
কিভাবে যুক্ত করবেনঃ
২// ড্যাশবোর্ড থেকে Template এ ক্লিক করে Edit HTML এ ক্লিক করুন ।
৩// এবার আপনার কীবোর্ড এর
]]></b:skin>
৪// উপরের কোড খুজে পেলে তার ঠিক উপরে নীচের কোড গুলো কপি করে পেস্ট করুন ।
#mtw-notbar {
width: 100%;
height: 34px;
background-color: #000000;
position: fixed;
top: 0px;
left: 0px;
padding: 15 0 0 0;
margin: -2px 0 0;
text-align: center;
font-size: 13px;
color: white;
line-height: 37px;
letter-spacing: 0.5px;
font-family: verdana, arial;
border-bottom: 2px solid #95c636;
transition:all 2s;
-webkit-transition: all 1s;
z-index: 999999;
}
#mtw-notbar:hover {
border-bottom: 4px solid #95c636;
box-shadow: 0 1px 2px #000000;
}
#mtw-notbar a {
color: #95c636;
font-weight: bold;
font-family: georgia;
font-style: italic;
text-decoration: none;
}
#mtw-notbar a:hover, a:visited {
color: #95c636;
font-weight: bold;
font-family: georgia;
font-style: italic;
text-decoration: none;
}
#mtw-notbar b {
color: yellow;
}
width: 100%;
height: 34px;
background-color: #000000;
position: fixed;
top: 0px;
left: 0px;
padding: 15 0 0 0;
margin: -2px 0 0;
text-align: center;
font-size: 13px;
color: white;
line-height: 37px;
letter-spacing: 0.5px;
font-family: verdana, arial;
border-bottom: 2px solid #95c636;
transition:all 2s;
-webkit-transition: all 1s;
z-index: 999999;
}
#mtw-notbar:hover {
border-bottom: 4px solid #95c636;
box-shadow: 0 1px 2px #000000;
}
#mtw-notbar a {
color: #95c636;
font-weight: bold;
font-family: georgia;
font-style: italic;
text-decoration: none;
}
#mtw-notbar a:hover, a:visited {
color: #95c636;
font-weight: bold;
font-family: georgia;
font-style: italic;
text-decoration: none;
}
#mtw-notbar b {
color: yellow;
}
৫// উপরের কাজ হয়েগেলে এবার একি ভাবে নীচের কোড টি খুজে বের করুন ।
<body>
৬// উপরের কোড খুজে পেলে তার ঠিক নীচে নীচের কোড কপি করে পেস্ট করুন ।
<div id="mtw-notbar" >
Simple Text -
<b>Bold Title</b> -
<a href="#">This is Link</a>
</div>
Simple Text -
<b>Bold Title</b> -
<a href="#">This is Link</a>
</div>
নোটঃ উপরের কোড এর Simple Text মুছে সেখানে আপনার পছন্দের লিখা দিন । Bold Title মুছে সেখানে আপনার পছন্দের লিখা দিন । # মুছে আপনি যে লিঙ্ক দিতে চান সেটা দিন আর This is Link মুছে সেখানে আপনার পছন্দের লিখা দিন ।
৭// কাজ সব ঠিক ভাবে হয়েগেলে Save Template এ ক্লিক করে সেভ করে নিন ।
♦ ব্যাস হয়েগেলে এবার আপনার ব্লগ ভিজিট করে দেখুন আশাকরি কাজ হয়ে যাবে । কোন সমস্যা হলে আমাকে জানাবেন আমি হেল্প করবো এর জন্য কমেন্ট করবেন অবশ্যই না পারলে Template Backup দিয়ে দিবেন আমি করে দিব । তাছাড়া আমার এই পোস্ট আপনাদের ভালো লাগলে একটি কমেন্ট ও বন্ধুদের সাথে শেয়ার করতে ভুলবেন না । কারন আপনার একটি কমেন্ট আমাকে আরও বেশি বেশি লেখার শক্তি যাগাবে ।
▬ভালো থাকবেন সুস্থ থাকবেন▬
▬আল্লাহ্ হাফেজ▬