ব্লগে ফটো গ্যালারী তৈরী করবেন যেভাবে II How to add a simple image gallery to Blogger - UHC বাংলা

Untitled+2

...মুক্ত চিন্তায় বিশ্বাসী একটি গ্লোবাল বাংলা প্লাটফর্ম!

Home Top Ad

Friday, January 3, 2020

demo-image

ব্লগে ফটো গ্যালারী তৈরী করবেন যেভাবে II How to add a simple image gallery to Blogger

Screenshot+%252894%2529

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



ভিডিওটিতে কোনও সমস্যা থাকলে নিচেই   ভিডিওতে উল্লিখিত HTML কোডিংও দেয়া হয়েছে।
চলুন  শুরু করি!

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

<table style="width:100%">
<tr>
<td> </td>
<td> </td>
<td> </td>
</tr>
</table>

কোডটি নিচের ছবির মতো দেখাবে।
gallerytutorial1

কোডটি ৩টি ছবিটি জন্য। আপনি যদি বেশি ছবি অ্যাড করতে চান তবে এই ট্যাগের </tr> and </table মধ্যে কোডটি অ্যাড করুন।

3 টি কলামের 2 সারি  টেবিলের কোডিংটি এরকম দেখাবে:
blopggallery2


এখন পর্যন্ত সব ভাল? গ্রেট! আসুন এখন কিছু ভালো ফটো আপলোড করি।

এখনও  HTML কম্পোজারে নিশ্চিত করুন যে আপনার কার্সারটি <td> </td> ট্যাগের প্রথম জোড়াটির মধ্যে রয়েছে। ফটো আপলোডার আনতে 'Insert image' আইকনে ক্লিক করুন। আপনার ছবিগুলি সংরক্ষণ করুন সেখান থেকে আপলোড বা আমদানি করুন। একটি মাত্র ফটো সিলেক্ট করুন এবং 'Insert image' এ ক্লিক করুন। অন্য একটি ডায়লগ বাক্স পপ আপ হবে। কম্পিউটার/ ব্লগ বা মোবাইল থেকে ফটো আপলোড করুন।  এবং ফটোর জন্য small সাইজও সিলেক্ট করুন। এই চিত্রটির জন্য HTML  কোডিং সারণীতে এই <td> </td> ট্যাগের মধ্যে ফটো আপলোড হবে। পরবর্তী <td> </td> ট্যাগের  মধ্যে কার্সার রাখুন এবং পরবর্তী চিত্রটি সন্নিবেশ করার জন্য প্রক্রিয়াটি পুনরাবৃত্তি করুন। আপনার আপলোড করা সমস্ত চিত্র অ্যাড ইমেজ কম্পোজ  বাক্সের "From this blog" ট্যাবে থাকবে । আপনি যখন শেষ করেন তখন  HTML এরকম  দেখতে পাবেন:
gallerytutorial8


এখন আপনার পোস্টটি প্রিভিউ  দেখুন। Preview  দেখতে এরকম  হবে। এখানে  স্যাম্পল প্রিভিউ দিলাম:
gallerytutorial6

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

এখন আপনি যখন নিজের পৃষ্ঠাটি বা পোস্ট দেখেন তখন আপনি আপনার গ্যালারীটিতে থাকা চিত্রগুলিতে ক্লিক করতে সক্ষম হবেন এবং এরকম কিছু পাবেন:
gallerytutorial7

ঝরঝরে! এখন আপনার কাছে একটি গ্যালারী রয়েছে যাতে আপনি আরও সারি ইমেজ যুক্ত করতে পারেন। আপনি সহজেই ছবিটি আপনার ব্লগে বা অন্য কোনও সাইটের অন্য কোনও লিঙ্কে তৈরি করতে ব্যবহার করতে পারেন। যদি আপনি কীভাবে জানতে চান তবে আমাকে মন্তব্যে জানাতে দিন এবং আমি আপনাকে দেখানোর জন্য আরও একটি টিউটোরিয়াল তৈরি করতে পারি! আমি আশা করি এটি কার্যকর হয়েছে। দয়া করে কমেন্ট বক্সে  কোনও গঠনমূলক প্রতিক্রিয়া, পরামর্শ বা প্রশ্ন রেখে দিন এবং যত তাড়াতাড়ি সম্ভব আপনার কাছে ফিরে আসব।

চিয়ার্স!!!

অন্যান্য

Post Bottom Ad

আকর্ষণীয় পোস্ট

code-box

Contact Form

Name

Email *

Message *