Blog এর CopyNShare dpuf url Disable করুন

আমরা Blog এ যখন Css Html javascript সহ ইত্যাদি Code নিয়ে Post করি তখন আমাদের  syntax-code-highlighter Box এর মাধ্যমে Css Html javascript সহ ইত্যাদি Code গুলো Share করতে হয়।
এ ক্ষেত্রে অধিকাংশ Blog এ  syntax-code-highlighter Box থেকে Css Html javascript ইত্যাদি Code গুলো Copy করলে- code গুলোর সঙ্গে অতিরিক্ত একটা ঐ Post এর সাথে সম্পৃক্ত Url অথ্যাৎ লিস্কস: Copy হয় যাহার শেষের Extension .dpuf হয়ে তাকে। যাহা খুবই বিরক্তিকর।

0

keyboard style key symbol যুক্ত করুন ব্লগের পোষ্টে

আমরা যারা ব্লগিং করি সকলে'ই চেষ্টা করি ব্লগের পোষ্ট আরও আকর্ষণীয় করার জন্য। আমরা যখন CSS-HTML-Javascript সহ ভিবিন্ন কোড নিয়ে পোষ্ট করি ঠিক ঐ সময় keyboard-symbol ব্যাবহার করার প্রয়োজন পড়ে। যেমন Ctrl + F - Ctrl + C ইত্যাদি - যাহা দেখতে তেমন আকর্ষণীয় নয় । তাই keyboard-symbol ব্যাবহারে আকর্ষণীয়তা বাড়ানোর জন্য আজকের এই পোষ্ট।আশা করি আপনাদের ভাল লাগবে - যেভাবে ব্লগস্পটে যুক্ত করবেন।

0

Animated Demo and Download Buttons যুক্ত করুন ব্লগস্পটে

আপনাদের জন্য নিয়ে আসলাম Animated Demo and Download Buttons যখন ব্লগের পোষ্টে ডাউনলোড লিংক দেয়ার প্রয়োজন হয়, Animated Demo and Download Buttons ব্যবহার করার ফলে ব্লগের পোষ্ট আরও আকর্ষণীয় হয়ে উঠে।বাটনগুলি আমি ইতি পূর্বেও শেয়ার করে ছিলাম।পূর্বের শেয়ার করা Buttons গুলো অনেকটা বড় ছিল কাষ্টোমাইজ করে অনেকাংশ পরিবর্তন করেছেন। মোঃ হারুন-অর-রশিদ তাই Buttons গুলো আরও আকর্ষণীয় হয়েছে।

আশা করি আপনাদের ভাল লাগবে

যেভাবে ব্লগস্পটে যুক্ত করবেন। 

✯ প্রথমে ব্লগে Login  করুন।

✯ তারপর ব্লগার  dashboard  হতে  Template > Edit Html  বাটনে ক্লিক করুন।

✯ কিবোর্ড হতে Ctrl+F চেপে </head>  কোডটি সার্চ করুন।

✯   সার্চ করে পাওয়া  </head> এর আগে নিচের javascript  কোড টি পেষ্ট করুন।

 <link href='http://netdna.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.css' rel='stylesheet'/> 

✯ কিবোর্ড হতে Ctrl+F চেপে ]]></b:skin>  কোডটি সার্চ করুন।

✯   সার্চ করে পাওয়া  ]]></b:skin> উপরে নিচের CSS  কোড টি পেষ্ট করুন।

 #pro-buttons {margin:20px auto; text-align:center;}
#pro-buttons br {display: none;}
.pro-down, .pro-demo {
    position: relative;
    display: inline-block;
    height: 30px;
    width: 100px;
    line-height: 30px;
    padding: 0;
    border-radius: 5px;
    background: #fdfdfd;
    border: 2px solid #0099cc;
    margin: 10px;
    transition: .5s;
}
.pro-demo {border: 2px solid #fe6d4c;}

.pro-down:hover {background-color: #0099cc;}
.pro-demo:hover {background-color: #fe6d4c;}

.pro-down span.circle, .pro-demo span.circle2 {
    display: block;
    background-color: #0099cc;
    color: #fff;
    position: absolute;
    float: left;
    margin: 5px;
    line-height: 21px;
    height: 20px;
    width: 20px;
    top: 0;
    left: 0;
    transition: .5s;
    border-radius: 50%;
}
.pro-demo span.circle2 {background-color: #fe6d4c;}

.pro-down:hover span.circle, .pro-demo:hover span.circle2 {
    left: 100%;
    margin-left: -25px;
    background-color: #fdfdfd;
    color: #0099cc;
}
.pro-demo:hover span.circle2 {color: #fe6d4c;}
.pro-down span.title, .pro-down span.title-hover,
.pro-demo span.title2, .pro-demo span.title-hover2 {
    position: absolute;
    left: 40px;
    text-align: center;
    margin: 0 auto;
    font-size: 12px;
    font-weight: bold;
    color: #30abd5;
    transition: .5s;
}
.pro-demo span.title2, .pro-demo span.title-hover2 {color:#fe6d4c; left:35px;}
.pro-down span.title-hover, .pro-demo span.title-hover2 {left:20px; opacity:0;}
.pro-down span.title-hover, .pro-demo span.title-hover2 {color: #fff;}
.pro-down:hover span.title, .pro-demo:hover span.title2 {left:20px; opacity:0;}
.pro-down:hover span.title-hover, .pro-demo:hover span.title-hover2 {opacity:1; left:10px;} 

✯ Save Template এ ক্লিক করে টেমপ্লেট Save করে বেরিয়ে আসুন।

যখন ব্লগের পোষ্টে ডাউনলোড লিংক দেয়ার প্রয়োজন হবে।
তখন পোষ্ট এর HTML Editor এ যাবেন এবং সেখানে নিচের HTML  কোড গুলো পেষ্ট করে সেভ করুন।

 <div id="pro-buttons">
 <a class="pro-down" href="#" target="_blank">
<span class="circle"><i class="fa fa-rocket"></i></span>
<span class="title">Demo</span>
<span class="title-hover">Click here</span>
</a>
<a class="pro-demo" href="#" target="_blank">
<span class="circle2"><i class="fa fa-download"></i></span>
<span class="title2">Download</span>
<span class="title-hover2">Click here</span>
</a>
</div> 

✯ উপরের  HTML  কোডের # এর স্থলে Demo এবং Download লিংক দেবেন।

0

breaking news ticker যুক্ত করুন ব্লগে

 

আশা করি সকলে'ই ভাল আছেন|অনেকে'ই চান নিজের ব্লগস্পট সাইড টা একটু সাজ সজ্জা করতে-তাই আমি শেয়ার করলাম  ব্রেকিং নিউজ টিকার আশা করি আপনাদের ভাল লাগবে

যেভাবে ব্লগস্পটে যুক্ত করবেন। 

✯ প্রথমে ব্লগে Login  করুন।

✯ তারপর ব্লগার  dashboard  হতে  Template > Edit Html  বাটনে ক্লিক করুন।

✯ কিবোর্ড হতে Ctrl+F চেপে </style>  কোডটি সার্চ করুন।

✯   সার্চ করে পাওয়া  </style> এর আগে নিচের CSS  কোড গুলো পেষ্ট করুন।

#beakingnews{width:980px;margin:0 auto;line-height:35px;height:35px;background:#F7F7F7;overflow:hidden;margin-top:5px;}
#beakingnews .tulisbreaking{display:block;float:left;padding:0 7px;margin:0 5px 0 0;color:#FFF;background:#FD1515}
#recentpostbreaking{float:left}
#recentpostbreaking ul,#recentpostbreaking li{list-style:none;margin:0;padding:0} 

✯ কিবোর্ড হতে Ctrl+F চেপে </body> কোডটি সার্চ করুন।

✯ সার্চ করে পাওয়া </body> কোড এর আগে নিচের  javascript কোড গুলো পেষ্ট করুন।

 <script type='text/javascript'>
//<![CDATA[
$(document).ready(function () {

var url_blog = 'http://www.visitortunes.com/', //replace with your Domain
numpostx = 10; //Posts want to display

$.ajax({
url: '' + url_blog + '/feeds/posts/default?alt=json-in-script&max-results=' + numpostx + '',

type: 'get',
dataType: "jsonp",
success: function(data) {

var posturl, posttitle, skeleton = '',
entry = data.feed.entry;

if (entry !== undefined) {
skeleton = "<ul>";

for (var i = 0; i < entry.length; i++) {

for (var j=0; j < entry[i].link.length; j++)

{
if (entry[i].link[j].rel == "alternate")

{
posturl = entry[i].link[j].href;

break;
}
} posttitle = entry[i].title.$t;

skeleton += '<li><a href="' + posturl + '" target="_blank">' + posttitle + '</a></li>';

}
skeleton += '</ul>';
$('#recentpostbreaking').html(skeleton);

// kode untuk efek pada breaking news
function tick(){
$('#recentpostbreaking li:first').slideUp( function () { $(this).appendTo($('#recentpostbreaking ul')).slideDown(); });

}
setInterval(function(){ tick () }, 5000);

} else {
$('#recentpostbreaking').html('<span>No result!</span>');

}
},
error: function() {

$('#recentpostbreaking').html('<strong>Error Loading Feed!</strong>');
}

});
});
//]]>
</script> 

✯  বিঃদ্রঃ: উপরের  javascript কোডের  "http://www.visitortunes.com" এর জায়গায় আপনার সাইডের Home  লিস্কস: দিন
এবং  Template টি সেভ করুন

✯ এবার  ব্রেকিং নিউজ টিকার দেখানোর জন্য  dashboard > Layout এ গিয়ে একটি  HTML/Javascript

দ্বারা  Gadget  তৈরী করে নিচের HTML  কোড গুলো পেষ্ট করে সেভ করুন।

অথবা আপনার HTML নিয়ে যদি ভাল জ্ঞান থাকে তাহলে Template > Edit Html সেকশনে ও এড করতে পারেন।

<div id='beakingnews'><span class='tulisbreaking'>Breaking News:</span>
<div id='recentpostbreaking'>Loading...</div>
</div>

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

0

ব্লগস্পটে Multi Tab সিস্টেম কমেন্ট বক্স যুক্ত করবেন যেভাবে

আসসালামু আলাইকুম,আশা করি সবাই ভাল আছেন,যারা ব্লগিং করেন,তাদের পোষ্ট করা কিছুটা স্বার্থক হয় তখন,যখন কোন ভিসিটর ঐ পোষ্টে কমেন্ট করেন,মানুষের যেমন একটা প্রাণ আছে,ঠিক তেমন পোষ্টের প্রাণ হল কমেন্ট,তবে এ কমেন্ট গুলো পেতে আমাদের কিছুটা কাজ করতে হবে,যেমন ব্লগস্পটে স্বাভাবিক ভাবে ফেইসবুক কমেন্ট বক্স থাকেনা যার ফলে কেউ চাইলে ফেইসবুক দিয়ে কমেন্ট করতে পারেনা,আজকে আমরা ব্লগার ও ফেইসবুক Multi Tab সিস্টেম কমেন্ট বক্স যুক্ত করব,এটি যুক্ত করার ফলে ব্লগার ও ফেইসবুক দু প্রকারে কমেন্ট করতে পারবেন ভিসিটর এরা ,একসাথে Facebook এবং Blogger দুটি কমেন্ট বক্স ব্যবহারের ফলে আপনার ভিজিটররা সহজে বুঝতে পারবে আপনার পোষ্টটির কোন ট্যাবে কতটি কমেন্ট করা হয়েছে নিচের ছবিতে দেখুন

আপনার ব্লগার একাউন্টে লগইন করুন।

এরপর Template > Edit Html এ ক্লিক করুন।

তারপর কিবোর্ড হতে Ctrl+F চেপে </head> অংশটি সার্চ করুন।

এখন নিচের কোডগুলি </head> ট্যাগের উপরে পেষ্ট করুন।

এবার  </head> সার্চ করে ঠিক তার উপরে নিচের কোডগুলি পেষ্ট করুন।

<style>
/*--- Tabbed Facebook Comments By VisitorTunes.com ----*/
.comments-page {background-color:#FFF; border:15px;border: 1px solid #d1d8f0;}
#blogger-comments-page {padding:0px 5px; display:none;}
.comments-tab {float:left; padding:5px; margin-right:3px; cursor:pointer; background-color:#b5e5fa;border-radius: 2px;}
.comments-tab-icon {height:14px; width:auto; margin-right:3px;}
.comments-tab:hover {background-color:#eeeeee;}
.inactive-select-tab {background-color:#d1d1d1;}
</style>

এবার  <div class='comments' id='comments'> সার্চ করে ঠিক তার নিচে নিচের কোডগুলি পেষ্ট করুন।

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div class='comments-tab' id='fb-comments' onclick='javascript:commentToggle(&quot;#fb-comments&quot;);' title='Comments made with Facebook'>
<img class='comments-tab-icon' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhTFH4crFKFt2R-9aARewiujjYZHwXqJSD44PkHC-l9g2NvDgwAOL_UF8Q4o1xHPRL3Jhn1uLmxzrOU8luD1WF43Bgd1_LoNkm0Pr3kl0JqW7abvzKPCPaRi5whhmWcdUwkKHIcoaVUDpaf/s1600/FB.png'/>
<fb:comments-count expr:href='data:post.url'/> Comments
</div>
<div class='comments-tab inactive-select-tab' id='blogger-comments' onclick='javascript:commentToggle(&quot;#blogger-comments&quot;);' title='Comments from Blogger'>
<img class='comments-tab-icon' src='http://www.blogger.com/img/icon_logo32.gif'/> <data:post.numComments/> Comments
</div></b:if><div class='clear'/></div>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div class='comments-page' id='fb-comments-page'>
<div id='fb-root'/>
<fb:comments expr:href='data:post.url' num_posts='10' width='600'/>
</div>
</b:if>
<div class='comments comments-page' id='blogger-comments-page'>

ফেইসবুক কমেন্ট বক্সের width='600 কমাতে ও বাড়াতে পারেন

0

ব্লগস্পটের Gadget এর টাইটেল এ icon এড করবেন ?

আসসালামু আলাইকুম,আশা করি সবাই ভাল আছেন,আমি অনেক ব্যাস্ত তবুও ফিরে আসলাম আপনাদের মাঝে,এই টিউন টি করার  জন্য,আমাকে অনেকেই আমার ফেইসবুকে ইনবক্স করেছেন,তাই টিউন টি প্রকাশ করতে সক্ষম হলাম,আমিও প্রথমে এরকম একটি টিউন খুজেছিলাম ভিবিন্ন search tools এ search করে তবে পাইনি,আমি চাই কেউ যেন আমার মত হতাশ না হয়, বিশেষ করে টিউন করতে মন চাইনা,কারণ টিউনে যে পরিমান কষ্ট করে তাকি,সে পরিমান আনন্দ পাইনা,অনেকেই টিউন পড়ার পর বা দেখার পর একটি কমন্ট করার প্রয়োজন মনে করেনা,আশা রাখি সবাই একটি কমেন্ট রেখে যাবেন,যা হোক আজকে আমারা দেখব কিভাবে ব্লগস্পটের Gadget এর টাইটেল এর পাশে নিচের ছবির মত অথবা ভিসিটর টিউন ডটকম এর মত আইকন এড করা যায়

আমাদের আইকন এড করতে একটি ওয়েব সাইডের লিস্কস দরকার,যে লিস্কস এ আমারা ভিবিন্ন রকম আইকন পাব, আইকন এর লিস্কস, এর পর দরকার আইকন বসানোর জন্য কোড এই লিস্কস এ ক্লিক করে কোড টি dowanload করে নিন

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

টিউন টি ভাল লাগলে কমেন্ট ও শেয়ার করতে ভুলবেন না।

0

পেজ ভিউ কমেন্ট ভিউ পোষ্ট ভিউ gadget লাগিয়ে নিন ব্লগে

প্রথমে ধন্যবাদ জানাই আপনাকে VisitorTunes | Technology Exchange Bengali Blog এ ভিসিট করার জন্য,আসলে অনেক দিন যাবত্‍ এমন একটি gadget খুঁজতেছিলাম ভিবিন্ন সার্চ টুলবারে কিন্তু পেলাম না,আসলে অনেক gadget পেয়েছিলাম তবে ঐ গুলোতে শুধু মাত্র পেজ ভিউ কত কেবল তাহা দেখা যেত,আমি এমন একটি gadget কোড খুঁজতেছিলাম যাহাতে টুটাল কমেন্ট  সংখ্যা কত হয়েছে,এবং টুটাল পোষ্ট সংখ্যা ও টুটাল পেজ ভিউ কত হয়েছে দেখতে পারি,ইনশা আল্লাহ্ গুগল মামার সহযোগিতায় এবং আপনাদের দোয়ায় বিভিন্ন ভাবে কোডিং করে তৈরী করেছি,আমি যেমন টি চেয়েছিলাম ঠিক তেমন ভাবে,চলুন এবার কিভাবে এড করবেন,দেখে নিন, প্রথমে ব্লগে Login করে dashboard হতে Template এ ক্লিক করে Edit HTML এ গিয়ে নিচের যে কোন একটি কোড টি খুঁজ করুন,

<b:section class='sidebar section' id='sidebar' preferred='yes'>

অতবা

<b:section class='sidebar section' id='sidebar1' preferred='yes'>

অতবা

<b:section class='sidebar section' id='sidebar2' preferred='yes'>

অতবা

<b:section class='sidebar section' id='sidebar3' preferred='yes'>

হয়ত এতক্ষণ এ কোন একটি খুঁজে পেয়েছেন,এবার আপনি যে কোড টি খুঁজে পেলেন ঠিক তার নিচে এখান হতে ডাউনলোড করে কোড গুলো বসান

এবার ]]></b:skin> কোড টি খুঁজ করুন   

খুঁজে পেলে ঠিক তার আগে এখান হতে ডাউনলোড করে কোড গুলো বসান এবার Template সেভ করে দেখুন হয়েছে কিনা

 কোন সমস্যা হলে কমেন্ট করতে ভুলবেন না

0

জেনে নিন ব্লগস্পটের Gadget locked unlocked সম্পর্কে ভিডিও টিউটোরিয়াল

আসসালামু আলাইকুম,অনেক দিন পর আপনাদের জন্য নিয়ে আসলাম একটি ভিডিও টিউটোরিয়াল,এই টিউটোরিয়াল টি দেখলে আপনি আপনার ব্লগস্পটের Layout এর Gadget গুলো লক করা এবং আনলক করা সহ অনেক কিছু শিখতে পারবেন,এবং আপনি যখন টেমপ্লেট কাষ্টমাইজ করবেন ঠিক তখন আমার এই টিউন টি আপনাকে হেল্প করবে ৫০% এ ছাড়া আপনার টেমপ্লেটের Layout হতে Attribution সহ অনেক কিছু কাজের সহায়তা করবে,এ ছাড়া Layout এর Gadget লক ও আনলক কোড গুলো কি জানতে পারবেন,আশা করি আপনার ভালাগবেই আমার এই ভিডিও টিউন টি দেখার পর

ভাল লাগলে অবশ্যই শেয়ার এবং একটি কমেন্ট করতে ভুলবেন না

0

ব্লগে যুক্ত করবেন বাংলা ফেসবুক লাইক বক্স ?

 

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

<iframe src="//www.facebook.com/plugins/likebox.php?locale=bn_IN&href=http%3A%2F%2Fwww.facebook.com/visitortunes&width=236&height=258&show_faces=true&colorscheme=light&stream=false&border_color&header=false" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:236px; height:258px;" allowtransparency="true"></iframe><br />

মনে রাখবেন
www.facebook.com/visitortunes এর স্থানে আপনার ফেসবুক পেজ লিঙ্ক দিয়ে উইজেটটি সেভ করুন। তাহলেই আপনার সাইটে যুক্ত হয়ে যাবে একটি ফেসবুক লাইক বক্স। ব্যাস হয়ে গেল আপনার ফেইসবুক লাইক বক্স । ভাল লাগলে শেয়ার করতে ভুলবেন না । ধন্যবাদ ।

0

ব্লগস্পট ব্লগের মোবাইল ভার্সন থেকে Powered By Blogger রিমুভ করতে চান?

খুবই ভালো লাগছে যে, একটি কাজের ট্রিকস নিয়ে আজ আপনাদের সামনে হাজির হলাম। শিরোনাম দেখেই নিশ্চয়ই আগ্রহের মাত্রা বেড়ে গেছে? হ্যাঁ, আপনারা, আমরা সবাই ব্লগস্পট ব্লগের Attribution সম্পর্কে নিশ্চয়ই জানি? অর্থাৎ ব্লগস্পট ব্লগে Powered By Blogger লেখাটিকে Attribution বলা হয়। এই ক্রেডিট লিঙ্ক সবাই রিমুভ করতে পারেন সেটা জানি। কিন্তু অনেক ব্লগস্পট ব্লগ দেখেছি যারা এই Attribution টি ঠিকই রিমুভ করতে পেরেছেন কিন্তু পিসি থেকে এই লেখাটি দূর করতে পারলেও আপনি কিন্তু আপনার ব্লগের মোবাইল ভার্সন থেকে এটা তাড়াতে পারেন নি। আর সেই অসম্ভব কাজকে সম্ভব করব আমরা। যেমনঃ ব্লগার মারুফ ডট কম মোবাইল ভার্সন দেখুন, তাতে Powered By Blogger লিঙ্কটি নেই। এবার নিশ্চয়ই আপনার ধৈর্যের বাঁধ ভেঙ্গে যাচ্ছে? আর দেরি করব না। চলুন শিখে নেই ব্লগস্পট ব্লগের মোবাইল ভার্সন থেকে Powered By Blogger লিঙ্কটি রিমুভ করতে হয় কিভাবে।

• ব্লগস্পট ড্যাশবোর্ড থেকে  Template > Edit HTML অপশনে যান।
• টেমপ্লেটের কোডগুলো থেকে আগে খুঁজে দেখুন নিচের কোডটুকু আছে কিনা। যদি কোডটি খুঁজে পান তবে সেটি রিমুভ করে দিন আর না পেলে আরও ভালো কথা।
• <b:widget id='Attribution1' locked='true' title='' type='Attribution'/>

  
  

  এবার আসি মূল কাজে। এবার </body> কোডটি খুঁজে বের করুন। আর কোডটির উপরেই বসিয়ে দিন নিচের কোডটুকু।

  <div style='display:none;'> <b:section class='hiddenbar' id='hiddenbar' preferred='no'> <b:widget id='Attribution1' locked='true' mobile='no' title='' type='Attribution'/> </b:section> </div>

  
  

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

0

আপনার ব্লগের মাউসের তীরের পেছনে ঘুরন্ত লেজ তৈরি করুন

 

আসসালামালাইকুম।সবাই কেমন আছেন ? আশা করি ভালোই আছেন।

আমিও আপনাদের দোয়ায় ভালোই আছি।একটি মজার পোস্ট নিয়ে ফিরে এলাম,

আসুন তাহলে এবার আমরা শুরু করি।

ব্লগস্পট ব্লগে মাউসের লেজ তৈরি করার উপায় :

প্রথমে আপনার ব্লগে লগ ইন করে

Deshboard >>> Layout >>> Add A Gadget >> HTML/JavaScript এ ক্লিক করে

নিচের কোড গুলো সম্পূর্ণ কপি করে যুক্ত করুন

<script language="javascript">

// ENTER TEXT BELOW. CAN *NOT* INCLUDE NORMAL HTML CODE.
var text='Welcome to Visitortunes';

var delay=30; // SPEED OF TRAIL
var Xoff=-0; // PIXEL COUNT FROM THE LEFT OF THE CURSOR (- VALUES GO TO LEFT)
var Yoff=-30; // PIXEL COUNT FROM THE TOP OF THE CURSOR (- VALUES GO UP)
var txtw=12; // AMOUNT OF PIXEL SPACE EACH CHARACTER OCCUPIES
var beghtml='<font color="#00436e"><b>'; // OPTIONAL HTML CODE THAT EFFECTS WHOLE TEXT STRING SUCH AS FONT COLOR, SIZE, ETC.
var endhtml='</b></font>'; // END HTML CODE. MOSTLY USED IF ABOVE SETTING IS USED.

//********** NO NEED TO EDIT BELOW HERE **********\\

ns4 = (navigator.appName.indexOf("Netscape")>=0 && document.layers)? true : false;
ie4 = (document.all && !document.getElementById)? true : false;
ie5 = (document.all && document.getElementById)? true : false;
ns6 = (document.getElementById && navigator.appName.indexOf("Netscape")>=0 )? true: false;
var txtA=new Array();
text=text.split('');
var x1=0;
var y1=-1000;
var t='';

for(i=1;i<=text.length;i++){
t+=(ns4)? '<layer name="txt'+i+'" top="-100" left="0" width="'+txtw+'" height="1">' : '<div id="txt'+i+'" style="position:absolute; top:-100px; left:0px; height:1px; width:'+txtw+'; visibility:visible;">';
t+=beghtml+text[i-1]+endhtml;
t+=(ns4)? '</layer>' : '</div>';
}
document.write(t);

function moveid(id,x,y){
if(ns4)id.moveTo(x,y);
else{
id.style.left=x+'px';
id.style.top=y+'px';
}}

function animate(evt){
x1=Xoff+((ie4||ie5)?event.clientX+document.body.scrollLeft:evt.pageX);
y1=Yoff+((ie4||ie5)?event.clientY+document.body.scrollTop:evt.pageY);
}

function getidleft(id){
if(ns4)return id.left;
else return parseInt(id.style.left);
}

function getidtop(id){
if(ns4)return id.top;
else return parseInt(id.style.top);
}

function getwindowwidth(){
if(ie4||ie5)return document.body.clientWidth+document.body.scrollLeft;
else return window.innerWidth+pageXOffset;
}

function movetxts(){
for(i=text.length;i>1;i=i-1){
if(getidleft(txtA[i-1])+txtw*2>=getwindowwidth()){
moveid(txtA[i-1],0,-1000);
moveid(txtA[i],0,-1000);
}else moveid(txtA[i], getidleft(txtA[i-1])+txtw, getidtop(txtA[i-1]));
}
moveid(txtA[1],x1,y1);
}

window.onload=function(){
for(i=1;i<=text.length;i++)txtA[i]=(ns4)?document.layers['txt'+i]:(ie4)?document.all['txt'+i]:document.getElementById('txt'+i);
if(ns4)document.captureEvents(Event.MOUSEMOVE);
document.onmousemove=animate;
setInterval('movetxts()',delay);
}
</script>

যদি কেউ না বুঝে থাকেন কমেন্ট করতে ভুলবেন না

5

আপনার ব্লগ বা ওয়েব সাইড সহ পোষ্ট গুলো গুগলে পরিচয় করিয়ে দিন

 

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

এবার উপরের ছবির মত ADD A SIDE এ ক্লিক করুন  নিচের মত একটি পেজ উইনডো হবে 

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

 

এবার উপরের ছবির মত  Crawl এ ক্লিক করুন  নিচের মত একটি পেজ উইনডো হবে

 এবার উপরের ছবির মত  Fetch as Google এ ক্লিক করুন  নিচের মত একটি পেজ উইনডো হবে সেই পেজে

আমরা আগে নিজের ব্লগ বা ওয়েব সাইড গুগলে পরিচয় করব।

 

এবার উপরের ছবির মত  FETCH AND RENDER এ ক্লিক করুন  নিচের মত একটি পেজ উইনডো হবে

এবার উপরের ছবির মত Submit to index এ ক্লিক করুন  নিচের মত একটি পেজ উইনডো হবে

এখন থেকে আপনার  নিজের ব্লগ বা ওয়েব সাইড গুগলে সার্চ করলে যে কেউ খুঁজে পাবে।

গুগলে পোষ্ট পরিচয় করার নিয়ম একটু মাত্র ভিন্ন তবে কাজের বৈশিষ্ট একই রকম

যেমন নিজের ব্লগ বা ওয়েব সাইড গুগলে সার্চ এ পরিচয় করার জন্য আমরা উপরের ছবির মত FETCH AND RENDER ব্যবহার করে ছিলাম,এখন যখন আমরা পোষ্ট পরিচয় করব সে জন্য শুধু FETCH  এ ক্লিক করব ক্লিক করার আগে যে পোষ্ট পরিচয় করতে চান সেই পোষ্টের লিস্কস  নিচের মত

http://www.visitortunes.com/2015/03/2995-idm.html হয় তাহলে লাল করা লিস্কস বাদ দিয়ে শুধু

2015/03/2995-idm.html লিখে FETCH এ ক্লিক করুন,অন্য ধাপ গুলো আগের মত

কোন কিছু সমস্যা হলে কমেন্ট করত ভুলবেন না।

2

ব্লগার ( ব্লগস্পট ) এর জন্য Animated Page Loading Effect

বন্ধুরা সবাই আশাকরি ভালো আছেন সব সময় সুস্থ এবং ভালো থাকেন আল্লাহ্‌ এর কাছে সেটাই দোয়া করি । যাই হোক আজকে আমি আপনাদের জন্য Animated Page Loading Effect নিয়ে এলাম অনেকের মনে প্রশ্ন যাগতে পারে এটার কাজ কি ? হুম তাদের বলবো ভালো একটি প্রশ্ন ? এটার কাজ আসলে সেরকম কিছুই না জাস্ট ব্লগটিকে প্রফেশনাল লুক দেওয়া । আপনি এটা আপনার ব্লগে অ্যাড করলে আপনি নিজেই বুজতে পারবেন এটা কতটা মজার এটা কোথাই কিভাবে কাজ করে ,উপরের আমার ডেমো ব্লগে গিয়ে যেকোনো একটি পোস্টে ক্লিক করুন দেখুন পেজ লোডিং ইফেক্ট পেয়ে যাবে


 আশাকরি এতো ক্ষণে দেখে নিয়েছেন এবং বুঝেও গেছেন ,যাই হোক নীচে থেকে দেখে নিন কিভাবে এটাকে আপনার ব্লগে অ্যাড করবেন ।

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

১// আপনার ব্লগ লগইন করুন তারপর ড্যাশবোর্ড থেকে Template এ ক্লিক করুন ।

২// এবার ডান পাশ থেকে ব্যাকআপ বাটন এ ক্লিক করে আপনার টেম্পলেট এর ব্যাকআপ নিয়ে নিন ।

৩// এবার Edit HTML এ ক্লিক করে আপনার কীবোর্ড এরCtrl+F প্রেস করে নীচের কোডটি খুজে বের করুন ।

</body>

৪// উপরের কোড খুজে পেলে তার ঠিক উপরে নীচের কোড গুলো কপি করে পেস্ট করুন ।

<style>
#abt-page-loader {
position: fixed!important;
top: 0;
right: 0;
bottom: 0;
left: 0;
z-index: 9999;
background:#000 url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjXdskCGnJHdgB7POFSxhwi-rRzWRF-iL7FCh-uRNRIhsfq53BV4Hh5iR4ShsWTBN4WbSdkTJzS3ggCprQ5wFv56TJD7DhW5Wj82MLRRXlA9DowGjiIwRyRM7laHmIaYDqEcwft6VqW3Rs/s200/load6.gif') no-repeat 50% 30%;
color: #FFF;
display: none;
font: 0/0 a;
text-shadow: none;
padding: 1em 1.2em;
}
</style>
<script type='text/javascript'>
//<![CDATA[
$(document.body).append('<div id="abt-page-loader">Loading...</div>');
$(window).on("beforeunload", function() {
// ... Show the Animation `.fadeIn()`
$('#abt-page-loader').fadeIn(1000).delay(6000).fadeOut(1000);
});
//]]>
</script>

নোটঃ আপনি চাইলে উপরের কালার করা লিঙ্ক মুছে সেখানে অন্য কোন Animated ফটো অ্যাড করতে পারেন ।

৫// Save Template এ ক্লিক করে সেভ করে নিন ।

0

ব্লগ এর ওল্ডার পোস্ট লিঙ্ক, নিউয়ার পোস্ট লিঙ্ক এবং হোম লিঙ্ক এর বদলে দিন চেহারা

আপনারা  যারা ব্লগ ব্যবহার করেন তারা , দেখেছেন যে কোন পোস্ট এর নিচে ওল্ডার পোস্ট লিঙ্ক, নিউয়ার পোস্ট লিঙ্ক এবং হোম লিঙ্ক (নিচে চিত্র ন্যায়) থাকে , যা দেখতে তেমন একটা ভাল লাগে না। আপনি ইচ্ছা করলেই আমার তৈরি করা আইকন যোগ করতে পারেন। যা আপনি খুব সহজে করতে পারেন। কিভাবে করবেন নিন্মে চিত্র সহ ধাপে ধাপে বর্ননা করা হল।

১ম ধাপ

আপনি আপনার ব্লগ এ লগইন করুন । তারপর Layout > Edit HTML এ যান

২য় ধাপ

এবার আপনি নিচে দেয়া কোড টি অনুসন্ধান করুন।

<span id='blog-pager-newer-link'>
<a class='blog-pager-newer-link' expr:href='data:newerPageUrl' expr:id='data:widget.instanceId + &quot;_blog-pager-newer-link&quot;' expr:title='data:newerPageTitle'><data:newerPageTitle/></a>
</span>
</b:if>
<b:if cond='data:olderPageUrl'>
<span id='blog-pager-older-link'>
<a class='blog-pager-older-link' expr:href='data:olderPageUrl' expr:id='data:widget.instanceId + &quot;_blog-pager-older-link&quot;' expr:title='data:olderPageTitle'><data:olderPageTitle/></a>
</span>
</b:if>
<b:if cond='data:blog.homepageUrl != data:blog.url'>
<a class='home-link' expr:href='data:blog.homepageUrl'><data:homeMsg/></a>
<b:else/>
<b:if cond='data:newerPageUrl'>
<a class='home-link' expr:href='data:blog.homepageUrl'><data:homeMsg/></a>
</b:if>

৩য় ধাপ

যে কোড টি খুজে পেলেন তা মুছে  তার জায়গায় আমার edit  করা নিম্নের কোড গুলো পেষ্ট করুন

<span id='blog-pager-newer-link'>
<a class='blog-pager-newer-link' expr:href='data:newerPageUrl' expr:id='data:widget.instanceId + &quot;_blog-pager-newer-link&quot;' expr:title='data:newerPageTitle'><img alt='Next' border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhr7F0j5-5fF62LSMqtFDUba3pRQwODJ4Or2759hfyaH5auot-o7ZiPt1zIANnAPqNT8K-XJ8f6bWO5xsJVZN3pKbWtaHe_-FwuQ0-p4vOVgyJVTKG_e7u6JGpWjAsuGwVXLinG72dDgCEz/s1600/1.png' title='নবীনতর পোস্ট'/></a>
</span>
</b:if>
<b:if cond='data:olderPageUrl'>
<span id='blog-pager-older-link'>
<a class='blog-pager-older-link' expr:href='data:olderPageUrl' expr:id='data:widget.instanceId + &quot;_blog-pager-older-link&quot;' expr:title='data:olderPageTitle'><img alt='Next' border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhOst5h6Jia64XjHBEz7KaNlwoQ_cDWyXL368ewVAEL6RstqNR3K4HxengL91vB37zOqyq4Z0e_DRxZSfGBsvOfBqbDhVdJG-FisG7sy1_RcRH4wkpwa02RJAFiPsnImU5bFKpDb5VKXerO/s1600/3.png' title='পুরাতন পোস্ট'/></a>
</span>
</b:if>
<b:if cond='data:blog.homepageUrl != data:blog.url'>
<a class='home-link' expr:href='data:blog.homepageUrl'><img alt='home' border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjhWUuYyOIiyROe2ZOt4Biesm2Ro3SMmrd5bUf_YK2wUY5zVw9wj1fYlfDnO-v4OMFAjnCgr2V3rzVX05Kz6jc2c5fWlrqiwisfTphIudYtIesNJc8z0rgl0VHnf06EqbkLLpB85No4IUXV/s1600/4.png' title='হোম'/></a>
<b:else/>
<b:if cond='data:newerPageUrl'>
<a class='home-link' expr:href='data:blog.homepageUrl'><data:homeMsg/></a>
</b:if>
</b:if>

আপনার কাজ শেষ এবার সেভ করে নিন

যদি কেউ না বুঝে থাকেন কমেন্ট করতে ভুলবেন না

0