Sunday, August 9, 2015

ভিজিটরদের তাক লাগাতে ব্লগার সাইটে খুব সহজেই যোগ করে নিন মনোমুদ্ধকর পেইজ লোডিং ইফেক্ট!

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



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

১ম প্রক্রিয়া

১। প্রথমে আপনার ব্লগার সাইটে লগইন করুন।
২। টেমপ্লেটের এডিট অপশনে গিয়ে সার্চ করুন </head> (এখানে আপনাকে গুগলের জাভাস্ক্রীপ্ট অপশন যোগ করতে হবে)
৩। </head> অংশটি পাইলে এর ঠিক উপরে নিচের কোডটি যুক্ত করুন:
<script src="http://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js" type="text/javascript"></script>
(বি:দ্র- যদি পূর্বে এটি সংযুক্ত থাকে তাহলে নতুন করে যোগ করার দরকার নাই)

২য় প্রক্রিয়া

১। পূনরায়  search করুন </body>

এই লেখাটি পাইলে ঠিক উপরে নিচের কোডগুলো যোগ করুন-
<style>
#nbl-page-loader {
position: fixed!important;
top: 0;
right: 0;
bottom: 0;
left: 0;
z-index: 9999;
background:#fff url('http://2.bp.blogspot.com/-kIrasdB82T0/U6eA_bnDmlI/AAAAAAAADzw/UUio00Tw4gM/s1600/Loader2.gif') no-repeat 50% 50%;color:#fcfcfc;padding:1em 1.2em;display:none;}
color: #FFF;
display: none;
font: 0/0 a;
text-shadow: none;
padding: 1em 1.2em;
opacity: 0.5;
}
</style>
<script type='text/javascript'>
//<![CDATA[
$(document.body).append('<div id="nbl-page-loader">Loading...</div>');
$(window).on("beforeunload", function() {
// ... Show the Animation `.fadeIn()`
$('#nbl-page-loader').fadeIn(1000).delay(6000).fadeOut(1000);
});
//]]>
</script>
(উল্লেখ্য কোড যোগ করার পর তা টেমপ্লেটটি সেইভ  করতে হবে।) > ব্যাস এবার কাজের ফলাফলটি নিজেই যাচাই করুন এবং ডেমো প্রিভিউ দেখুন এখানে
Previous Post
Next Post

0 comments: Post Yours! Read Comment Policy ▼
লক্ষ্য করুনঃ
পোষ্টের সাথে সম্পৃক্ত নয় এমন কোন কমেন্ট করা যাবে না। কোন কারণ ব্যতীত আপনার ব্লগের লিংক শেয়ার করতে যাবেন না। সবসময় গঠনমূলক মন্তব্য প্রদানের চেষ্টা করবেন। আমরা সবার মতামত সমানভাবে মূল্যায়ন করি এবং যথাসময়ে প্রতি উত্তর দেয়ার চেষ্টা করি।

Post a Comment

 
Copyright © বিডি.পয়সা ক্লিক,নিবন্ধিত ও সংরক্ষিত. মডিফাইঃ পিসি টীম, সার্ভার হোস্টেডঃ গুগল সার্ভিস