Translate

◆◆একটি ব্লগার ব্লগকে সুন্দর ভাবে সাজানোর জন্য দরকারি কিছু টিপস & ওয়েডগেট । [ দেখুন হয়তো আপনারও কাজে আসতে পারে...

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


১// আমাদের প্রথম কাজ হবে একটি সুন্দর থিম বা টেম্পলেট যুক্ত করা ইতি মধ্যে অনেক টেম্পলেট নিয়ে অনেক পোস্ট হয়েছে এই ব্লগে , আর সেগুল আপনারা না দেখে থাকেন তাহলে কোন সমস্যা নাই নীচে কিছু ভাল টেম্পলেট ডাউনলোড এর লিঙ্ক দিলাম সেখান থেকে দেখে ডাউনলোড করে নিন । কিভাবে টেম্পলেট যুক্ত করবেন সেটা এই ব্লগে অনেক পোস্ট হয়েছে সার্চ দিয়ে দেখে নিন । তাহলে নীচে থেকে কিছু টেম্পলেট ডাউনলোড সাইট লিঙ্ক দেখে নিন ......।


=/> এখানে কিছু টেম্পলেট ডাউনলোড সাইট দিলাম পছন্দ মতো ডাউনলোড করে নিন এবার সেটি কে আপনার ব্লগে যুক্ত করে নিন । 

 - ======================== - 

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



 - ======================== - 
৩// ব্লগকে সুন্দর করার জন্য একটি ফেসবুক ওয়েডগেট যুক্ত করে নিন এটা ব্যবহার করার ফলে আপনার ব্লগ দেখতেও সুন্দর হবে সঙ্গে ভিজিট বাড়াতেও সাহায্য করবে । তাই নীচে থেকে দেখে নিন কিছু ফেসবুক ওয়েডগেট । 

facebook


=/> যেটা আপনার পছন্দ সেটাই ব্যবহার করতে পারেন । 

     - ======================== - 
৪// এবার আপনি একটি পপুলার পোস্ট ওয়েডগেট যুক্ত করুন এটা দেখতেও এবং খুব কাজের । এর জন্য নীচের লিঙ্ক লক্ষ করুন । 


=/> এই ধরনের অনেক পোস্ট আমি করেছি সেগুল ব্লগে সার্চ করে দেখতে পারেন । তাছাড়া আমার সামনের পোস্ট এর অপেক্ষাই থাকুন । 

     - ======================== - 
৫// একটি Recent ওয়েডগেট এটা দ্বারা আপনি বুজতে পারবেন কে কোন পোস্টে কমেন্ট করলে । সাথে এটা দেখতেও সুন্দর লাগে । নীচে থেকে দেখে নিন কিভাবে সুন্দর একটি Recent কমেন্ট ওয়েডগেট যুক্ত করবেন । 

Recent
=/> প্রথম আপনার ব্লগ লগ ইন করুন তারপর ড্যাশবোর্ড থেকে Layout এ ক্লিক করুন তারপর Add a Gadget এ ক্লিক করে Html/Javascript এ ক্লিক করুন । এবার Content ঘরে নীচের কোডটি কপি করে পেস্ট করুন । 


<style type="text/css" scoped> ul.allbloggertricks_recent{list-style:none;margin:0;padding:0;} .allbloggertricks_recent li{background:none!important;display:block;clear:both;overflow:hidden;list-style:none;border:1px solid transparent;border-radius:9px;max-height:100px;-webkit-transition-duration:.5s;-moz-transition-duration:.5s;-o-transition-duration:.5s;transition-duration:.5s;-webkit-transition-property:0;-moz-transition-property:0;-o-transition-property:0;transition-property:transform;margin:0 0 6px!important;padding:3px!important}.allbloggertricks_recent li:hover{border:1px solid #ddd;-webkit-transform:rotate(6deg);-moz-transform:rotate(6deg);-o-transform:rotate(6deg) }.allbloggertricks_recent a {text-decoration:none;}.avatarImage{padding:3px;background:#fefefe;-webkit-box-shadow:0 1px 1px #ccc;-moz-box-shadow:0 1px 1px #ccc;box-shadow:0 1px 1px #ccc;float:left;margin:0 6px 0 0;position:relative;overflow:hidden} .avatarRound{-webkit-border-radius:100px;-moz-border-radius:100px;border-radius:100px;width:35px;height:35px} .allbloggertricks_recent li span{margin-top:4px;color: #222;display: block;font-size: 12px;line-height: 1.4;} </style><script type="text/javascript">//<![CDATA[    var numComments  = 5, showAvatar  = true, avatarSize  = 35, roundAvatar = true, characters  = 40, defaultAvatar  = "http://www.gravatar.com/avatar/?d=mm", hideCredits = true; maxfeeds=50, adminBlog='Your Name';//]]></script><script type="text/javascript" src="https://dl.dropboxusercontent.com/u/76401970/All%20Blogger%20Tricks/abt-recent-commentsv3.js"></script><script type="text/javascript" src="/feeds/comments/default?alt=json&amp;callback=allbloggertricks_recent&amp;&amp;max-results=50"></script>   

       - ======================== - 
৫// আপনার ব্লগে একটি Social Share বাটন থাকা খুব দরকারি যাতে পাঠক রা আপনার পোস্ট গুলকে খুব সহজে Social সাইট গুলতে শেয়ার করতে পারে । এর ফলে খুব সহজে আপনার ব্লগ এর প্রচার বাড়বে । আমার পছন্দের একটি Social Share ওয়েডগেট আছে আপনার যুক্ত করতে পারেন খুব সুন্দর । নীচে থেকে দেখে নিন ...

sharing


=/> কিভাবে যুক্ত করবেন ? নীচের টিপস লক্ষ করুন ...

১// আপনার ব্লগ লগ ইন করুন তারপর ড্যাশবোর্ড থেকে Template এ ক্লিক করুন , এবার Edit HTML এ ক্লিক করুন । 
২// এবার আপনার কীবোর্ড Ctrl+F প্রেস করে নীচের কোডটি খুজে বের করুন । 
<data:post.body/>
৩// উপরের কোডটি খুজে পেলে তার ঠিক পরে নীচের কোডটি কপি করে পেস্ট করুন ।
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div id='md-active-share-comment-marker'/>
</b:if>

৪// এবার একি ভাবে </body> এই কোডটি খুজে বের করুন তার পর খুজে পেলে তার ঠিক উপরে নীচের কদি কপি করে পেস্ট করুন । 

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<script src='https://dl.dropboxusercontent.com/u/76401970/All%20Blogger%20Tricks/abt-floating-share.js' type='text/javascript'/>
<div id='md-share-window' style='width: 100%; display: block; position: fixed; bottom: -450px; left: 0px; background-color: rgba(128, 128, 128, 0.6); z-index: 100; padding: 0 0 10px 0;'>
<div style='width: 800px; margin: 20px auto;'> <a class='boxclose' id='boxclose'/>
<style>
@import url(http://fonts.googleapis.com/css?family=Open+Sans:400);
@import &quot;//netdna.bootstrapcdn.com/font-awesome/3.0/css/font-awesome.css&quot;;
#share-buttons{border-radius:5px;background:#FFF;width:660px;overflow:hidden;margin-left:60px;box-shadow:0 2px 3px rgba(71,71,71,0.31);padding:14px 7px}.share-button{background:#DCE0E0!important;position:relative;display:block;float:left;height:40px;overflow:hidden;width:150px;border-radius:3px;-o-border-radius:3px;-ms-border-radius:3px;-moz-border-radius:3px;-webkit-border-radius:3px;margin:0 7px}.icon{display:block;float:left;position:relative;z-index:3;height:100%;vertical-align:top;width:38px;-moz-border-radius-topleft:3px;-moz-border-radius-topright:0;-moz-border-radius-bottomright:0;-moz-border-radius-bottomleft:3px;-webkit-border-radius:3px 0 0 3px;border-radius:3px 0 0 3px;text-align:center}.icon i{color:#fff;line-height:42px}.slide{z-index:2;display:block;height:100%;left:38px;position:absolute;width:112px;-moz-border-radius-topleft:0;-moz-border-radius-topright:3px;-moz-border-radius-bottomright:3px;-moz-border-radius-bottomleft:0;-webkit-border-radius:0 3px 3px 0;border-radius:0 3px 3px 0;margin:0}.slide p{font-family:Open Sans;font-weight:400;border-left:1px solid rgba(255,255,255,0.35);color:#fff;font-size:16px;left:0;position:absolute;text-align:center;top:10px;width:100%;margin:0}.share-button .slide{-webkit-transition:all .2s ease-in-out;-moz-transition:all .2s ease-in-out;-ms-transition:all .2s ease-in-out;-o-transition:all .2s ease-in-out;transition:all .2s ease-in-out}.facebook iframe{display:block;position:absolute;right:16px;top:10px;z-index:1}.twitter iframe{width:90px!important;right:5px;top:10px;z-index:1;display:block;position:absolute}.google #___plusone_0{width:70px!important;top:10px;right:15px;position:absolute;display:block;z-index:1}.linkedin .IN-widget{top:10px;right:22px;position:absolute;display:block;z-index:1}.facebook:hover .slide{left:150px}.twitter:hover .slide{top:-40px}.google:hover .slide{bottom:-40px}.linkedin:hover .slide{left:-150px}.facebook .icon,.facebook .slide{background:#305c99}.twitter .icon,.twitter .slide{background:#00cdff}.google .icon,.google .slide{background:#d24228}.linkedin .icon,.linkedin .slide{background:#007bb6}</style>
<div id='share-buttons'> <div class='facebook share-button'> <i class='icon'> <i class='icon-facebook'> </i> </i> <div class='slide'> <p> facebook </p> </div> <iframe allowTransparency='true' frameborder='0' scrolling='no' src='//www.facebook.com/plugins/like.php?href=http%3A%2F%2Fwww.facebook.com%2Fasobondhublog&amp;send=false&amp;layout=button_count&amp;width=80&amp;show_faces=false&amp;font&amp;colorscheme=light&amp;action=like&amp;height=20&amp;appId=568581339861351' style='border:none; overflow:hidden; width:80px; height:20px;'> </iframe> </div> <div class='twitter share-button'> <i class='icon'> <i class='icon-twitter'> </i> </i> <div class='slide'> <p> twitter </p> </div> <a class='twitter-share-button' data-via='AllBloggerTrick' href='https://twitter.com/share'> Tweet </a><script>
!function(d,s,id){
var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';
if(!d.getElementById(id)){
js=d.createElement(s);
js.id=id;
js.src=p+'://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js,fjs);}}(document, 'script', 'twitter-wjs');
</script>
</div> <div class='google share-button'> <i class='icon'> <i class='icon-google-plus'> </i> </i> <div class='slide'> <p> google+ </p> </div> <div class='g-plusone' data-size='medium'> </div><script type='text/javascript'>
(function() {
var po = document.createElement('script');
po.type = 'text/javascript';
po.async = true;
po.src = 'https://apis.google.com/js/plusone.js';
var s = document.getElementsByTagName('script')[0];
s.parentNode.insertBefore(po, s);
}
)();
</script>
</div> <div class='linkedin share-button'> <i class='icon'> <i class='icon-linkedin'> </i> </i> <div class='slide'> <p> linkedin </p> </div> <script data-counter='right' type='IN/Share'> </script> <script src='//platform.linkedin.com/in.js' type='text/javascript'> lang: en_US </script> </div></div><div style='display:block; margin: 0 200px; padding: 5px 0px 0px;font-family: Oswald; font-weight: 700;color: #000'> Don't You Think this Awesome Post should be shared ??<br/> <span style='color: #000; font-size: 18px;'>| <data:blog.pageName/> |</span> </div> </div> </div> </b:if>
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js' type='text/javascript'/>

নোট  ঃ উপরের asobondhublog মুছে সেখানে আপনার ব্লগ এর Url দিন । 
৫// এবার Save Template এ ক্লিক করে সেভ করে নিন । 

>> তাছাড়া আপনি নীচের লিঙ্ক থেকেও সুন্দর সুন্দর Social Share ওয়েডগেট অ্যাড করতে পারেন । 

 - ======================== - 

৬//এবার একটু সুন্দর সার্চ বক্স যুক্ত করে নিন যাতে পাঠকরা খুব সহজে আপনার ব্লগের পোস্ট সার্চ করতে পারে । 


=/> কিভাবে যুক্ত করবেন খুব সোজা নীচে দেখে নিন ...


১// প্রথম আপনার ব্লগ লগ ইন করুন তারপর ড্যাশবোর্ড থেকে Layout এ ক্লিক করুন তারপর Add a Gadget এ ক্লিক করে Html/Javascript এ ক্লিক করুন । এবার Content ঘরে নীচের কোডটি কপি করে পেস্ট করুন । 

<style>
#abt-search-btn {
background: none repeat scroll 0 0 #359BED;
border: 0 none;
border-radius: 0 0 0 0;
color: #FFFFFF;
font-weight: 700;
padding: 10px 20px;
}
#abt-search-box {
background: none repeat scroll 0 0 #EEEEEE;
border: 0 none;
padding: 10px;
width: 160px;
}
</style>
<form id="searchthis" action="/search" style="display:inline;" method="get">
<input id="abt-search-box" name="q" size="40" type="text" placeholder="  Type! :D "/>
<input id="abt-search-btn" value="Search" type="submit"/>
</form>

=/> এবার সেভ এ ক্লিক করে সেভ করে নিন ।

 - ======================== - 

৭// এবার একটি খুব গুরুত্ব পূর্ণ ওয়েডগেট সেটা হল বিভাগ ইংরেজিতে Labels , এটা সাধারণত ব্লগ এর সাথেই থাকে কিন্তু সেটা অতি সাধারন তাই আপনারা সেটিকে Customized স্টাইল রূপ দিতে পারেন । এই রকম কিছু পোস্ট আমি আগেই করেছি নীচে থেকে লিঙ্ক দেখে নিন ... 



- ======================== - 

৮// এই টিপস টি অনেক পরে দিলাম এটা খুব দরকারি বিশেষ করে নতুন দের জন্য । টিপস টি কিভাবে এডিট করবেন ...... আমি নীচে লিঙ্ক দিলাম ...


=/> মোটা মোটি দরকারি সব কিছু শেয়ার করার চেষ্টা করলাম এই সব কিছু গুল ব্যবহার করলে একটি প্রফেশনাল লুক দিতে পারবেন আপনার ফ্রী ব্লগে । তাছাড়া এখুন অনেক কিছু আছে যেগুল আমি আসতে আসতে আপনাদের সাথে শেয়ার করবো । 

=/> এই পোস্ট টি অনেক বড় হয়েযাবে তাই সব টিপস এখানে শেয়ার না করে লিঙ্ক দিয়েছি । কোন সমস্যা হলে জাবেন । আর পোস্ট এর মধ্যে কোন ভুল হলে ক্ষমা করে দিন । তাহলে আজকের মতো এই পর্যন্ত আবারও দেখা হবে । ভাল থাকবেন সুস্থ থাকবেন । আল্লাহ্‌ হাফেজ ।
Share on Google Plus

About Unknown

    Blogger Comment
    Facebook Comment

0 comments:

Post a Comment