বন্ধুরা সবাই ক্যামন আছেন আশাকরি ভাল আছেন আজকে আমি আপনাদের জন্য নিয়ে এলাম দারুন একটি Multi Colored Labels ওয়েডগেট আশাকরি ওয়েডগেট টি আপনাদের খুব পছন্দ হবে । আর হবেই বা না ক্যান এটা দেখতেও ভীষণ সুন্দর যে । এই ধরনের একটি পোস্ট এর আগে আমি করে ছিলাম সেটি অবশ্য ছিল Popular পোস্ট নিয়ে । যাই হোক বেশি কথা বলে আর লাভ কি নীচে থেকে এই লাইভ ডেমো দেখে নিন সঙ্গে দেখে নিন কিভাবে আপনার ব্লগে যুক্ত করবেন । যুক্ত করাটা খুব সোজা নীচের স্টেপ গুল একটু লক্ষ করুন তাহলে কোন সমস্যা হবে না ।
এবার দেখে নিন কিভাবে আপনার ব্লগ যুক্ত করবেন !
১) আপনার ব্লগ লগ ইন করুন তারপর ড্যাশবোর্ড থেকে Add a Gadget এ ক্লিক করে Label ওয়েডগেট টি ইন্সটল করুন । নীচে চিত্রে দেখুন ।
নোট ঃ আপনার যদি আগে থেকে এই Label ওয়েডেগট যুক্ত থাকে তাহলে আমার প্রথম স্টেপ বাদ দিয়ে নীচের স্টেপ গুল করুন ।
২) এবার আবার আপনার ব্লগ এর ড্যাশবোর্ড এ জান তারপর Template এ ক্লিক করে Edit HTML এ ক্লিক করুন ।
৩) এবার আপনার কীবোর্ড এর Ctrl+F প্রেস করে নীচের কোডটি খুজে বের করুন ।
]]></b:skin>
৪) উপরের কোডটি খুজে পেলে তার ঠিক আগে বা উপরে নীচের কোডটি কপি করে পেস্ট করুন ।
#Label1 ul li a:hover{color:#fff;text-decoration:none}
#Label1 ul li a {-webkit-text-size-adjust: auto; -webkit-text-stroke-width: 0px; color: #333333; display: block; font-family: Georgia, 'Times New Roman', Times, serif; font-size: 13px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 18px; margin: 0px 40px 0px 0px; min-height: 30px; orphans: 2; padding-top: 10px; text-align: -webkit-auto; text-decoration: none !important; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px;}
#Label1 ul li:first-child:after,
#Label1 ul li:first-child + li:after,
#Label1 ul li:first-child + li + li:after,
#Label1 ul li:first-child + li + li + li:after,
#Label1 ul li:first-child + li + li + li + li:after,
#Label1 ul li:first-child + li + li + li + li + li:after,
#Label1 ul li:first-child + li + li + li + li + li + li:after,
#Label1 ul li:first-child + li + li + li + li + li + li + li:after,
#Label1 ul li:first-child + li + li + li + li + li + li + li + li:after,
#Label1 ul li:first-child + li + li + li + li + li + li + li + li + li:after{position:absolute;top:10px;right:5px;border-radius:50%;border:2px solid #ccc;background:#353535;-webkit-box-shadow:0px 0px 5px #000;-moz-box-shadow: 0px 0px 5px #000;width:30px;height:30px;line-height:1em;text-align:center;font-size:28px;color:#fff}
#Label1 ul li:first-child + li + li + li + li + li + li + li {background:#DF01D7;width:90%}
#Label1 ul li:first-child + li + li + li + li + li + li + li:after{content:"8"}
#Label1 ul li:first-child + li + li + li + li + li + li + li +li{background:#B041FF;width:90%}
#Label1 ul li:first-child + li + li + li + li + li + li + li + li:after{content:"9"}
#Label1 ul li:first-child + li + li + li + li + li + li + li +li +li{background:#F52887;width:90%}
#Label1 ul li:first-child + li + li + li + li + li + li + li + li + li:after{content:"10"}
#Label1 ul li:first-child + li + li + li + li +li{background:#7ee3c7;width:90%}
#Label1 ul li:first-child + li + li + li + li + li:after{content:"6"}
#Label1 ul li:first-child + li + li + li + li + li +li{background:#f6993d;width:90%}
#Label1 ul li:first-child + li + li + li + li + li + li:after{content:"7"}
#Label1 ul li:first-child + li + li + li + li{background:#33c9f7;width:90%}
#Label1 ul li:first-child + li + li + li + li:after{content:"5"}
#Label1 ul li:first-child + li + li + li{background:#c7f25f;width:90%}
#Label1 ul li:first-child + li + li + li:after{content:"4"}
#Label1 ul li:first-child + li + li{background:#ffde4c;width:90%}
#Label1 ul li:first-child + li + li:after{content:"3"}
#Label1 ul li:first-child + li{background:#ff764c; width:90%}
#Label1 ul li:first-child + li:after{content:"2"}
#Label1 ul li:first-child{background:#ff4c54 ;width:90%}
#Label1 ul li:first-child:after{content:"1"}
#Label1 ul{margin:0;padding:0px 0;list-style-type:none}
#Label1 ul li{position:relative;margin:6px 0;border-radius:25px 0px 25px 0px;border:2px solid #f7f7f7;-webkit-box-shadow:3px 3px 3px #000;-moz-box-shadow: 3px 3px 3px #000;padding:10px}
৫) এবার Save Template এ ক্লিক করে Save করে নিন । ব্যাস হয়ে গেল এবার আপনার ব্লগে গিয়ে দেখুন আশাকরি আপনি আমার মতো সফল হবেন । কোন সমস্যা হলে জানাবেন আমি হেল্প করতে চেষ্টা করবো । ভাল থাকবেন সুস্থ থাকবেন আবারও দ্যাখা হবে নতুন কিছু নিয়ে আল্লাহ্ হাফেজ ।
Tags
ব্লগার