অ্যানিমেটেড Multi Colored Popular Post ওয়েডগেট ব্লগার ব্লগ এর জন্য ।



বন্ধুরা আজকে আমি আপনাদের জন্য নিয়ে এলাম দারুন দারুন দারুন তাও কম বলা হবে সত্যি চমৎকার একটি Popular Post ওয়েডগেট । সুধু মাত্র আপনাদের জন্য নিয়ে এলাম আমি সিয়র আপনাদের এটা পছন্দ হবে আমিও এটা ব্যবহার করে আমার ইংলিশ ব্লগে আপনারাও ব্যবহার করে দেখতে পারেন । তার আগে এর লাইভ ডেমো দেখে নিন ।








* এবার দেখে নিন কিভাবে যুক্ত করবেন । স্টেপ গুল লক্ষ করুন ।

১) ব্লগ লগ অন করুন তারপর ড্যাশবোর্ড থেকে Edit HTML  এ ক্লিক করুন ।

২) এবার সার্চ করার জন্য Ctrl + F এ সাহায্য নিন এবং  নীচের কোড টি সার্চ করে খুজে বের করুন ।


]]></b:skin>


* এবার উপরের কোড এর ঠিক আগে বা উপরে নীচের কোড টি কপি করে পেস্ট করুন ।




#PopularPosts1 ul{margin:0;padding:5px 0;list-style-type:none}
#PopularPosts1 ul li{position:relative;margin:5px 0;border:0;padding:10px}
#PopularPosts1 ul li:first-child{background:#ff4c54;width:90%}
#PopularPosts1 ul li:first-child:after{content:"1"}
#PopularPosts1 ul li:first-child + li{background:#ff764c;width:87%}
#PopularPosts1 ul li:first-child + li:after{content:"2"}
#PopularPosts1 ul li:first-child + li + li{background:#ffde4c;width:84%}
#PopularPosts1 ul li:first-child + li + li:after{content:"3"}
#PopularPosts1 ul li:first-child + li + li + li{background:#c7f25f;width:81%}
#PopularPosts1 ul li:first-child + li + li + li:after{content:"4"}
#PopularPosts1 ul li:first-child + li + li + li + li{background:#33c9f7;width:78%}
#PopularPosts1 ul li:first-child + li + li + li + li:after{content:"5"}
#PopularPosts1 ul li:first-child + li + li + li + li +li{background:#7ee3c7;width:75%}
#PopularPosts1 ul li:first-child + li + li + li + li + li:after{content:"6"}
#PopularPosts1 ul li:first-child + li + li + li + li + li +li{background:#f6993d;width:72%}
#PopularPosts1 ul li:first-child + li + li + li + li + li + li:after{content:"7"}
#PopularPosts1 ul li:first-child + li + li + li + li + li + li +li{background:#f59095;width:69%}
#PopularPosts1 ul li:first-child + li + li + li + li + li + li + li:after{content:"8"}
#PopularPosts1 ul li:first-child + li + li + li + li + li + li + li +li{background:#c7f25f;width:66%}
#PopularPosts1 ul li:first-child + li + li + li + li + li + li + li + li:after{content:"9"}
#PopularPosts1 ul li:first-child:after,
#PopularPosts1 ul li:first-child + li:after,
#PopularPosts1 ul li:first-child + li + li:after,
#PopularPosts1 ul li:first-child + li + li + li:after,
#PopularPosts1 ul li:first-child + li + li + li + li:after,
#PopularPosts1 ul li:first-child + li + li + li + li + li:after,
#PopularPosts1 ul li:first-child + li + li + li + li + li + li:after,
#PopularPosts1 ul li:first-child + li + li + li + li + li + li + li:after,
#PopularPosts1 ul li:first-child + li + li + li + li + li + li + li + li:after{position:absolute;top:20px;right:-15px;border-radius:50%;background:#353535;width:30px;height:30px;line-height:1em;text-align:center;font-size:28px;color:#fff}
#PopularPosts1 ul li .item-thumbnail{float:left;border:0;margin-right:10px;background:transparent;padding:0;width:70px;height:70px;}
#PopularPosts1 ul li a{font-size:12px;color:#444;text-decoration:none}
#PopularPosts1 ul li a:hover{color:#222;text-decoration:none}
#PopularPosts3 img{
    -moz-border-radius: 130px;
    -webkit-border-radius: 130px;
    border-radius: 130px;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    transition: all 0.3s ease;
padding:4px;
    border:1px solid #fff !important;
    background: #F2F2F2;}#PopularPosts1 img:hover {
    -moz-transform: scale(1.2) rotate(-560deg) ;
    -webkit-transform: scale(1.2) rotate(-560deg) ;
    -o-transform: scale(1.2) rotate(-560deg) ;
    -ms-transform: scale(1.2) rotate(-560deg) ;
    transform: scale(1.2) rotate(-560deg) ;
}


* ব্যাস কাজ শেষ এবার আপনার ব্লগে গিয়ে দেখুন আপনার পপুলার পোস্ট এর পরিবর্তন হয়েগেছে ।

* তাহলে আজকের মতো এই পর্যন্ত আবার দ্যাখা হবে । আল্লাহ্‌ হাফেজ ।


এসো বন্ধু

আমি পারভেজ ব্লগিং এর সঙ্গে যুক্ত আছি গত বেশ কিছু বছর, বাংলা ব্লগিং এর সঙ্গে সঙ্গে আমি অন্য ভাষাতেও ব্লগিং করি। সেই সব কারনে ব্লগে নিয়তম থাকা হয়না, আপনাদের ভালোবাসা যদি আগের মত আবার ফিরে পাই তাহলে অবশ্যই নিয়মত হবার চেস্ট করবো। facebook telegram youtube twitter

3 মন্তব্যসমূহ

আপনার একটি মন্তব্য একজন লেখক কে ভালো কিছু লিখার অনুপেরনা যোগাই তাই প্রতিটি পোস্ট পড়ার পর নিজের মতামত জানাতে ভুলবেন না । তবে বন্ধুরা এমন কোন মন্তব্য পোস্ট করবেন না যার ফলে লেখকের মনে আঘাত করে ! কারণ একটা ভাল মন্তব্য আমাদের আরও ভাল কিছু লিখার অনুপেরনা যাগাই !!

  1. সুন্দর পোস্ট!! শেয়ার করার জন্য ধন্যবাদ।

    উত্তরমুছুন
  2. aslamparvez৯:২৪ PM

    ধন্যবাদ ভাই কমেন্ট করার জন্য ।

    উত্তরমুছুন
  3. রামিজ রাজা৯:৫৭ AM

    এক কথাই অসাধারন ।

    উত্তরমুছুন
নবীনতর পূর্বতন

نموذج الاتصال