এর আগে আমি দেখেয়েছি কিভাবে পোস্টের নিচে লেখকের বায়োডাটা যোগ করা যায়।আজ আমি দেখাব কিভাবে হোমপেজে লেখকের বায়োডাটা যোগ করবেন।এটি ব্লগের সাইডবার বা নিচে যোগ করতে পারবেন।এর মাধ্যমে লেখকের পরিচিতি তুলে ধরতে পারবেন।প্রায় ব্লগেই এটি দেখা যায়।এবার দেখা যাক কিভাবে এটি যোগ করবেন।
কিভাবে যোগ করবেনঃ
> প্রথমে ব্লগে প্রবেশ করুন।> Layout এ যান।
> Add A Gadget এ ক্লিক করুন।
> Html/Javascript সিলেক্ট করুন।
> এবার খালি বক্সের মধ্যে নিচের কোডগুলো পেস্ট করুন।
<h3 class="title">About Me</h3>
<div class="widget-content">
<!--[if !IE]> -->
<style>
}
#bbc:hover
{
border:2px solid #ccc;
cursor:pointer;
}
.opacity
{
opacity: 0.5;
margin-right: 50px;
-moz-transition: all 0.5s ease-out;
-o-transition: all 0.5s ease-out;
-webkit-transition: all 0.5s ease-out;
-ms-transition: all 0.5s ease-out;
transition: all 0.5s ease-out;
-moz-transform: rotate(7deg);
-o-transform: rotate(7deg);
-webkit-transform: rotate(7deg);
-ms-transform: rotate(7deg);
transform: rotate(7deg);
}
.opacity:hover
{
-moz-transform: rotate(0deg);
-o-transform: rotate(0deg);
-webkit-transform: rotate(0deg);
-ms-transform: rotate(0deg);
transform: rotate(0deg);
-moz-box-shadow: 1px 1px 4px #000;
-webkit-box-shadow: 1px 1px 4px #000;
box-shadow: 1px 1px 4px #000;
}
</style>
<!--[endif]---->
<style>
#bbc
{
border:2px solid #888; margin:2px 5px 0px 0px; padding:2px;
}
#profileAditya:hover
{
border:2px solid #ccc;
cursor:pointer;
}
.opacity:hover
{
opacity: 1;
-moz-box-shadow: 1px 1px 4px #000;
-webkit-box-shadow: 1px 1px 4px #000;
box-shadow: 1px 1px 4px #000;
}
</style>
<img class="opacity" id="bbc" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiPq2sKOfz4ISh8lBMuUlStK-0wmfP_58bcfDi8nys9ty2Kwqx6IywCl4kyV4CFZM_ciueL-r7l5UaZS1NI6lXxnynepW7T2Q-zIVtR9BxZkFcSqIkWGUDAyQ622s6YhKkZEZ8NqLTTzHU/s72-c/nature+%281%29.jpg" width="100" />
<div style="font-family: Arial Tahoma Verdana; font-size: 14px; text-align: justify; margin-top:-110px; padding-left:120px;">
<b>Founder & Author:</b> Tariqur Rahman is a web designer, web developer and SEO expert currently working on several web projects, he is managing several blogs from his living </div>room alone. He has passion to create video tutorials. He currently makes video tutorials in English, and Bengali..<a style="color:#5634;" href="Your link here" target="_blank">...Read More</a><!--![endif]---->
</div>
এবার সেভ করা আগে কিছু পরিবর্তন করুন।
লাল কালার এর জায়গায় আপনার ছবির লিঙ্ক দিন।
নীল কালার এর জায়গায় আপনার বিস্তারিত লিখুন।
অরেঞ্জ কালার এর জায়গায় আপনার প্রোফাইলের লিঙ্ক দিন।
> এবার সেভ করুন এবং দেখুন।
Vai Aita Add Korle Sob Kisu Ulta Palta Hohe Jay.....label ...search sob nichay ase pls help Mail:juwelbdonline.blogspot.com
ReplyDeleteনা এটা বসানোর জন্য আপনার সাইট কখনোই উল্টা পাল্টা হবে না।কারন এটা একটা গ্যাজেট আপনি এটাকে বডির নিচে বসান আশা করি সমাধান হবে। ধন্যবাদ।
Deletevai apni aktu try kore dekben...pls
ReplyDeleteআচ্ছা আপনি অনেক কস্ট করেছেন এটার জন্য। তার জন্য আমি দুংখিত।তবে আমি দেখেছি এটা ঠিক আছে।আপনি এই কোডটা ব্লগের নিচের বারে দেন আশা করি হবে। আর যদি একান্তই না হয় তা হলে আমার সাথে আলাদা ভাবে যোগাযোগ করতে পারেন।আমার গুগল টক starsbd01
Delete