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

<img src="http://files.makingasite.webnode.com/200000001-64af265abd/Razib101.jpg"/>

এই কোডটি আমরা সাইটে পেস্ট করব। তবে তার আগে কোডটি এডিট করে নেব।

Src= এর পর “...............” এর মধ্যে আমরা নির্দিস্ট ছবির URL বসাব। এ জন্য আপনি আপনার ছবিটিকে কোন ইমেজ আপলোডার সাইটে আপলোড করে এখানে তার লিঙ্ক দিয়ে দিন। আমি সাধারনত এই কাজের জন্য ফেসবুককে ইউজ করি। চাইলে আপনিও ফেস বুকে আপলোড করতে পারেন। ছবি আপলোড করার পর ছবিটি ওপেন করুন। ছবির উপর রাইট ক্লিক করে Copy Image Location এ ক্লিক করুন।উপরের কোডের তারপর সেটি “............” এর মধ্যে বসিয়ে দিন। তার পর এই কোডটি আপনার সাইটের উপরে কন্ট্রোল বারের widgets থেকে Embed Code এ ক্লিক করুন। একটি বক্স আসবে।

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

<a target href=" http://www.chonnochara.com " title="CHONNOCHARA">

এখানে href= এরপর “............” এর মধ্যে আপনার কাক্ষিত সাইটের এড্ড্রেস লিখুন। এবং title এর জায়গায় আপনার কাক্ষিত সাইটের নাম বা টাইটেল লিখুন। অবশ্য টাইটেল না লিখলেও সমস্যা নাই। তবে টাইটেল যদি লেখেন তবে উক্ত ছবির উপর যদি মাউস পয়েন্টার নিয়ে যাওয়া হয় তবে সেই ছবির বা সাইটের নাম দেখাবে। পুরো কাজটি করার পর কোডটি দেখাবে এরকম......

<a target href=" http://www.chonnochara.com " title="CHONNOCHARA"><img src="http://files.makingasite.webnode.com/200000001-64af265abd/Razib101.jpg"/>

চলুন কোডটির সাথে আরও কিছু এড করি,
উপরের কোডটি বসালে ছবির উপরে ক্লিক করলে সরাসরি নির্দিস্ট সাইটে চলে যায়। এখন আপনি চাচ্ছেন ছবির উপরে ক্লিক করলে লিঙ্কের এড্ড্রেসে চলে না গিয়ে অটোমেটিক ব্রাউজারে নতুন একটা ট্যাব খুলে উক্ত সাইটে যাবে। সে ক্ষেত্রে আপনাকে উক্ত কোডের target লেখাটির পরে ="_blank" লেখাটি যুক্ত করতে হবে। পুরো কোডটি তাহলে হবে এরকম......

<a target="_blank"  href=" http://www.chonnochara.com " title="CHONNOCHARA"><img src="http://files.makingasite.webnode.com/200000001-64af265abd/Razib101.jpg"/>

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