আপনার ব্লগার ব্লগে পোষ্টের মাঝে যুক্ত করুন লাইভ ডেমো বাটন (সিএসএস ও এইচটিএমএলসহ)

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

কিভাবে আপনার ব্লগে যুক্ত করবেন।

• প্রথমে আপনার ব্লগার লগিন করুন।
• তারপর ড্যাশবোর্ড হতে ড্রাপ ডাউন মেনু হতে টেমপ্লেট নির্বাচন করুন। 
• এবং এবান আপনার টেমপ্লেট যাওয়ার পরে এডিট এইচটিএমএল নির্বাচন করুন। 
• তার পর একটি কোডিং অপশন দেখতে পাবেন। 
• সেখান Ctrl+F চেপে সার্চ অপশনে নিচের কোডটুকু খুজে বের করুন।

</b:skin>

• উপরের কোডটির পুর্বে ঠিক নিচের কোডটুকু কপি করে পেষ্ট করুন।

বুলু কালারের কোডটুকু দেখুন।

.nildemo {
width: 110px;
height: 25px;
background: #32A8FE;
border-radius:2px;
-moz-border-radius:2px ;
-webkit-border-radius:2px ;
text-align: center;
padding-top: 5px;
-webkit-transition:-webkit-box-shadow .5s ease;
-moz-transition:-webkit-box-shadow .5s ease;
-ms-transition:-webkit-box-shadow .5s ease;
-o-transition:-webkit-box-shadow .5s ease;
transition:-webkit-box-shadow .5s ease;
margin:auto;
}
.nildemo:hover {
background: #46AFFC;
-webkit-box-shadow:0 0 0 9999px rgba(0,0,0,.4);
-moz-box-shadow:0 0 0 9999px rgba(0,0,0,.4);
-ms-box-shadow:0 0 0 9999px rgba(0,0,0,.4);
-o-box-shadow:0 0 0 9999px rgba(0,0,0,.4);
box-shadow:0 0 0 9999px rgba(0,0,0,.4);
position:relative;
z-index:99999;
}
.nildemo a {
color: #333;
text-decoration: none;
font: normal 16px Arial, Verdana;
text-align: center;
}

আপনি ব্লগ পোষ্ট কিভাবে যুক্ত করবেন।

<div class="nildemo"><a href="DEMO URL HERE" target="blank" rel="nofollow">&#9776; Live Demo</a></div>

কাষ্টমাইজ করবেন কিভাবে দেকুন।

• আপনারা সংযুক্ত সেটা ডেমো ইউআরএল লেখার স্থানে আপনার ব্লগ সাইটের বা ডেমো ব্লগ সাইটের ইউআরএল লিংক টি বসাবেন।

এছাড়া আরো তিন ডেমোর ছবি যুক্ত করলাম দেকুন এখান থেকে ।

☆ প্রথম ছবি  ☆ দ্বিতীয় ছবি  ☆ তৃতীয় ছবি

তো ব্যাস আপনার কাজ শেষ।  এবার আপনি আপনার পোষ্ট ভিউ করে দেখুন কাজ হয়েছে। এদিকে আপনাদের ছোড় একটা কৌশণ অবলম্ভন করে তিন কোড যুক্ত করতে পারেন। শুধুমাত্র আপনাকে সিএসএস কোডটি কাষ্টমাইজ করতে হবে।

তো বন্ধুরা আজ এই পর্যন্ত আ জ আগামীতে আপনাদের জন্য আরো নতুন কিছু নিয়ে হাজির হব। ততদিন পর্যন্ত আপনারা আমাদের সাথে থাকুন। আল্লাহ হাফেজ।