Sign Up To The Free Email Newsletter!

Want to get notified whenever we produce the latest content ? Then subscribe now to start receiving hot updates from today.

Friday, February 12, 2016

ব্লগার সাইটে পেইজ লোডিং ইফেক্ট! বই থেকে নিয়া

By : Unknown
On : 9:10 PM



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

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

১। প্রথমে আপনার ব্লগার সাইটে লগইন করুন।
২। টেমপ্লেটের এডিট অপশনে গিয়ে সার্চ করুন </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>

0 comments:

Post a Comment