একটি ফ্রেম হল একটি সাইটের (উইন্ডো) একটি এলাকা যেখানে অন্য একটি ওয়েব পৃষ্ঠা দৃশ্যমান। ওয়েবমাস্টাররা তাদের বন্ধুদের বা অংশীদারদের সাইটের হোম পেজ প্রদর্শন করার জন্য এই সুযোগটি ব্যবহার করে। একই কৌশলটি বাক্সে সার্চ ফর্মটি এর পাশের ফলাফল ইত্যাদি প্রদর্শন করতে ব্যবহৃত হয়।
কিন্তু বেশিরভাগ ফ্রেমগুলি বড় ওয়েব পোর্টাল তৈরিতে ব্যবহৃত হয়, যেখানে যথেষ্ট সংখ্যক মেনু আইটেম এবং সাবমেনুর প্রয়োজন হয়। তারা সাধারণত এই ধরনের লোকদের সম্পর্কে বলে: "ফ্রেমে ওয়েবসাইট"। এই ধরনের রিসোর্স তৈরি করার জন্য এইচটিএমএল সম্পর্কে ভালো জ্ঞান প্রয়োজন।
ওয়েবসাইট বিল্ডারে ফ্রেম তৈরি করা
কিছু ওয়েবসাইট নির্মাতা এই ধরনের কোডের স্বয়ংক্রিয় প্রজন্ম প্রদান করে। সাধারণত অ্যাড ফ্রেম বোতামটি প্রোগ্রামের প্রধান মেনুতে থাকে। প্রথমে আপনাকে পৃষ্ঠার সঠিক জায়গায় কার্সার রাখতে হবে, তারপর বোতামে ক্লিক করুন, একটি উইন্ডো খুলবে (স্ক্রিনশটে দেখানো হয়েছে)। এটিতে, আপনি ফ্রেমে খোলা পৃষ্ঠার ঠিকানা সেট করতে পারেন এবং মাত্রাগুলি সামঞ্জস্য করতে পারেন: প্রস্থ এবং উচ্চতা৷
কিন্তু বেশিরভাগ ফ্রেমগুলি বড় ওয়েব পোর্টাল তৈরিতে ব্যবহৃত হয়, যেখানে যথেষ্ট সংখ্যক মেনু আইটেম এবং সাবমেনুর প্রয়োজন হয়। তারা সাধারণত এই ধরনের লোকদের সম্পর্কে বলে: "ফ্রেমে ওয়েবসাইট"। এই ধরনের একটি সম্পদ তৈরি করতে ভাল জ্ঞান প্রয়োজনHTML ভাষা।
এই "পরিষেবা" এর সাহায্যে পৃষ্ঠায় বেশ কয়েকটি ফ্রেম তৈরি করা সম্ভব, তবে আপনি এইভাবে আন্তঃসংযুক্ত উপাদান পাবেন না।
CMS এ ফ্রেম
ওয়েবসাইট তৈরির জন্য অনেক প্রোগ্রামে, সংশ্লিষ্ট মডিউল ইনস্টল করা সম্ভব। উদাহরণস্বরূপ, জুমলার জন্য, একটি ফ্রেম হল একটি "র্যাপার" মডিউল৷
এটি জুমলা সিএমএস কন্ট্রোল প্যানেলে পাওয়া এবং তৈরি করা যেতে পারে: "এক্সটেনশন" - "মডিউল ম্যানেজার" - "তৈরি করুন" (ভিতরে প্লাস সাইন সহ একটি গোল কমলা বোতাম)। পপ-আপ উইন্ডোতে, তালিকায়, আপনি "র্যাপার" মডিউল দেখতে পাবেন।
যদি এটি এখানে না থাকে তবে এটি অন্তর্ভুক্ত নয়৷ এটি ব্যবহার করার জন্য, আপনাকে প্রথমে এটি এখানে সক্রিয় করতে হবে: "এক্সটেনশন" ট্যাব, তারপর "এক্সটেনশন ম্যানেজার", তারপর "ম্যানেজমেন্ট" ট্যাব৷ এবং আমরা যে তালিকাটি খোলে তা খুঁজছি, "ফিল্টার" ক্ষেত্রে দ্রুত অনুসন্ধানের জন্য, শব্দটি লিখুন: মোড়ানো। এই মডিউলের বিপরীতে ভিতরে একটি চেক মার্ক সহ একটি সবুজ আইকন থাকা উচিত। ভিতরে একটি বিন্দু সহ একটি লাল বৃত্তের অর্থ এই প্লাগইনটি অক্ষম করা হয়েছে৷
এই পদ্ধতির পরে, আপনি "মডিউল ম্যানেজার"-এ ফিরে যেতে পারেন, একটি ফ্রেম তৈরি করুন এবং এর পরামিতি সেট করুন৷
আপনি ছবিতে দেখতে পাচ্ছেন, মডিউল আপনাকে সেট করতে দেয়: ফ্রেমের উপরে শিরোনাম, মডিউলের অবস্থান, সাইটের পৃষ্ঠাগুলি নির্বাচন করুন যেখানে এটি প্রদর্শিত হবে। এবং প্রস্থ, উচ্চতাও সামঞ্জস্য করুন; একটি ফ্রেম যোগ করুন এবং আসলেএকটি ওয়েব পেজ লিঙ্ক. যদি একটি ফ্রেমে আপনি একটি সাইটের মূল পৃষ্ঠাটি সম্পূর্ণ প্রস্থে প্রদর্শন করতে চান, তাহলে 100%, ডিফল্টরূপে সেট করা যথেষ্ট হবে না। আপনি অবিলম্বে নিরাপদে 400% রাখতে পারেন। পৃষ্ঠার উপরের মেনু প্রদর্শনের জন্য সাধারণত 200 এর উচ্চতা যথেষ্ট। ব্যবহারকারী (ওয়েবসাইট ভিজিটর) স্ক্রলবার ব্যবহার করলে অন্যান্য সমস্ত সামগ্রী দৃশ্যমান হবে৷
জুমলায় ফ্রেম কী তার একটি উদাহরণ এখানে দেওয়া হল।
ফ্রেম তৈরির জন্য জুমলা মডিউল খুবই সুবিধাজনক এবং ব্যবহার করা সহজ। যাইহোক, এর ক্ষমতা সীমিত, যেমন কনস্ট্রাক্টরের ক্ষমতা।
ইতিহাস ও বাস্তবতা
ফ্রেম থেকে সাইট তৈরির অনুশীলনে, এই ট্যাগটি (এর প্রয়োগ) অনেক আগেই পটভূমিতে বিবর্ণ হয়ে গেছে। তারা মডিউল দ্বারা প্রতিস্থাপিত হতে সক্ষম হয়েছিল, কনস্ট্রাক্টর প্রোগ্রামগুলির সেটিংস যা কোনও সাইট নির্মাতার অংশগ্রহণ ছাড়াই একটি ওয়েব পৃষ্ঠার জন্য কোড তৈরি করে৷ যাইহোক, কিছু ক্ষেত্রে এটি যথেষ্ট নয়। উদাহরণস্বরূপ, যখন একটি ফ্রেম ব্রাউজারে প্রদর্শিত এলাকাগুলির একটি সামগ্রিক জটিল কাঠামো। জটিলভাবে স্ট্রাকচার্ড সাইটের মালিকরা এটা দেখেন। এটির সৃষ্টি শুধুমাত্র চরম ক্ষেত্রে ব্যবহার করা হয়, যেহেতু ফ্রেম সাইটগুলি বিশেষ ট্যাগগুলির সাহায্যে একচেটিয়াভাবে তৈরি করা হয়৷
জটিলভাবে কাঠামোবদ্ধ সাইট
তাদের জন্য, রিসোর্স পৃষ্ঠাগুলিতে বিষয়বস্তু সংগঠিত করার জন্য বেশ কয়েকটি আন্তঃসংযুক্ত ফ্রেম তৈরি করা হল সেরা সমাধান। এইগুলি, একটি নিয়ম হিসাবে, বড় পোর্টাল, প্রতি বছর শক্তিশালী হচ্ছে৷
কিভাবে একই ফলাফল অর্জন করবেন? ফ্রেম গঠন কিভাবে তৈরি হয়?
কীভাবেপৃষ্ঠা কোডে ফ্রেম ঢোকান
HTML-এ ফ্রেমগুলি ট্যাগ ব্যবহার করে যোগ করা হয়:
- ফ্রেম (একটি পৃথক উইন্ডোর জন্য);
- ফ্রেমসেট (একটি সম্পূর্ণ কাঠামো তৈরি করতে এটি ব্যবহার করে);
- iframe ("ভাসমান" ফ্রেম);
- নোফ্রেম (যদি ফ্রেমটি ব্যবহারকারীর ব্রাউজারে প্রদর্শিত না হয়)।
প্রথম নির্দিষ্ট ট্যাগটি সর্বদা এবং এর জোড়ায় ফিট করে। এবং এটি প্রতিস্থাপন করে এবং. এবং উপযুক্ত বৈশিষ্ট্যগুলির সাহায্যে, আপনি প্রতিটি উপাদানের বৈশিষ্ট্যগুলি সামঞ্জস্য করতে পারেন: নাম (নাম=), আকার (cols=এবং সারি=), একটি সীমানা (সীমানা), স্ক্রলবারের উপস্থিতি এবং, অবশ্যই, ওয়েব পেজের লিঙ্কটি প্রদর্শন করার জন্য।
নকশা বৈচিত্র্য
সাইটের পুরো পৃষ্ঠাটিকে এলাকায় ভাগ করা যায়। উদাহরণস্বরূপ, এই মত:
| বাম | শীর্ষ ফ্রেম |
| ঠিক |
এই জাতীয় কাঠামো (এটিকে নেস্টেড বলা হয়) ট্যাগের ভিতরে cols অ্যাট্রিবিউট লিখে পাওয়া যেতে পারে, যার অর্থ ফ্রেমের অবস্থান অনুভূমিকভাবে এবং সারিগুলি - উল্লম্বভাবে। এর পরে,=চিহ্নটি বসানো হয় এবং মাত্রাগুলি নির্ধারিত হয়। উদাহরণস্বরূপ, 60%, 40% - শতাংশ (একটি উইন্ডো ব্রাউজারের 60% স্থান নেবে, অন্যটি যথাক্রমে 40%)। অথবা 100, 200 - পিক্সেলে আকৃতির অনুপাত। ফ্রেমের একটির আকার মোটেও সেট করা যাবে না (এটি ডিফল্টরূপে সেট করা হবে)। এটি করার জন্য, কমার পরে বা আগে, আপনাকেচিহ্নটি নির্দিষ্ট করতে হবে।
নেস্টিংপ্রতিটি নতুন এলাকা একটি নতুন ফ্রেমসেট দ্বারা চিহ্নিত করা হয়৷
কোড উদাহরণ:
মনে রাখবেন যে আমাদের উদাহরণে, দ্বিতীয় এবং তৃতীয় ফ্রেমের জন্য, মাপগুলি শুধুমাত্র একবার নির্দিষ্ট করা হয়েছে৷
অনেক ধারণা আপনাকে ফ্রেম সম্পূর্ণ করার অনুমতি দেয়। ব্রাউজার উইন্ডোতে তাদের অবস্থানের উদাহরণ অবিরামভাবে দেওয়া যেতে পারে (অনুযায়ী কোড পরিবর্তন করা)। যাইহোক, এই তথ্য দীর্ঘ সময় ব্যবহারিক প্রয়োগ খুঁজে পাওয়া যায় নি. ফ্রেম, যদি আজকে সাইট তৈরি করার সময় ব্যবহার করা হয়, তা শুধুমাত্র বিনামূল্যের CMS-এ মডিউল আকারে বা আইফ্রেমের আকারে।
ভাসমান ফ্রেম
এটা আশ্চর্যজনক যে কেন এটি এমন একটি নাম পেয়েছে, এখানে "বিল্ট-ইন" শব্দটি আরও উপযুক্ত। এই ফ্রেমটি একটি ফাইলের বিষয়বস্তু প্রদর্শন করার জন্য তৈরি করা হয়েছে। আপনি ডাটাবেসে যেকোন নথি বা ফাইল আপলোড করুন, iframe ট্যাগ ব্যবহার করে এটির পথ লিখুন - এবং দর্শকরা ফাইলটির পাঠ্য (ভিডিও বা চিত্র) দেখতে পাবেন। দুর্ভাগ্যবশত, ব্রাউজার সবসময় কন্টেন্ট রেন্ডার করে না। এটি করার জন্য, ওয়েব নির্মাতারা খোলার এবং বন্ধ করার ট্যাগের মধ্যে বাক্যাংশটি প্রবেশ করান: "আপনার ব্রাউজার সামগ্রী প্রদর্শন করছে না।"
উদাহরণস্বরূপ, Seopult.ru হল প্রমোশন মাস্টারদের জন্য একটি সুপরিচিত পরিষেবা। শুধুমাত্র তার প্রধান সাইট নয়, কিন্তু একটি মিরর I.seopult.pro, পোর্টাল ক্লায়েন্টদের জন্য তৈরি। iframe কোড এখানে নিম্নরূপ লেখা হয়েছে:
নির্দেশ
ট্যাগটি কোথায়
-
একটি তালিকা আইটেম সংজ্ঞায়িত করার জন্য তৈরি করা হয়েছিল৷ সমস্ত ব্রাউজার দ্বারা সমর্থিত৷
মিরর পৃষ্ঠাতেই, আপনি একটি বোতাম আকারে "নির্দেশ" শব্দটি দেখতে পাবেন। ব্রাউজার উইন্ডোর কেন্দ্রে এটিতে ক্লিক করলে উপস্থাপনাটি খোলে৷
সব বড়সিনেমা এবং সিরিজ দেখার জন্য সাইটগুলি আইফ্রেম ব্যবহার করে তৈরি করা হয় (উদাহরণস্বরূপ, "ইমহোনেট"), পাশাপাশি সামাজিক নেটওয়ার্কগুলি। এমনকি "Yandex" এর মূল পৃষ্ঠাতে এই ট্যাগটি এবং একাধিক জোড়া রয়েছে৷
কিভাবে একটি আইফ্রেম লিখবেন
আপনি সাইটের যেকোনো স্থানে একটি স্ক্রল বার সহ একটি উইন্ডো আকারে একটি নথি আপলোড করতে পারেন৷ সাধারণত ট্যাগগুলি শরীরের ভিতরে স্থাপন করা হয়। মান ছাড়িয়ে
এবং, উপরের উদাহরণে দেখানো হয়েছে, তালিকা ট্যাগটিও ব্যবহার করা যেতে পারে -
-
।
আইফ্রেমে অ্যাট্রিবিউট যোগ করা হয়েছে:
- প্রস্থ (প্রস্থ) এবং উচ্চতা (উচ্চতা=);
- প্রান্ত প্রান্তিককরণ সারিবদ্ধ;
- ইনডেন্ট যা নির্দিষ্ট করা যেতে পারে বা নাও হতে পারে: ডিফল্ট মান 6 - এটি যথেষ্ট;
- অনুমোদিত স্বচ্ছতা ব্যবহার করে, আপনি ফ্রেম এলাকার স্বচ্ছতা সেট করতে পারেন যাতে পৃষ্ঠার পটভূমি দেখা যায়;
- প্লাস পরিচিত scr, নাম, স্ক্রলিং, বর্ডার।
আইফ্রেম দিয়ে নেভিগেট করা
সবচেয়ে আকর্ষণীয় ফ্রেমিং দক্ষতা হল কোড লেখা যা আপনাকে একটি লিঙ্কের মাধ্যমে একটি উইন্ডোতে বিষয়বস্তু খুলতে দেয়, যেটি সিওপল্ট মিররের নির্মাতারা করেছিলেন, শুধুমাত্র একবারে কয়েকটি লিঙ্কের সাথে (একসাথে ব্যবহারকারীর কাছে উপলব্ধ একই পৃষ্ঠা)।
এর জন্য, একটি আইফ্রেম নেওয়া হয়, নামটি নাম=এর মাধ্যমে অতিরিক্ত লেখা হয়। উদাহরণস্বরূপ, হেডার। আরও, ট্যাগগুলিতে এর আগে এবং লিঙ্কগুলি একটি HREF=তাদের পরে বৈশিষ্ট্যের বাধ্যতামূলক ইঙ্গিত সহ লেখা হয়৷ ক্লোজিং ট্যাগ a ব্যবহার করার আগে, একটি শিলালিপি নির্দেশিত হয় যা একটি লিঙ্ক-বোতাম হিসাবে কাজ করবে৷ ট্যাগ "a" খোলা এবং বন্ধট্যাগ p. এ আবদ্ধ আছে
আপনি কোডে এই ধরনের বেশ কয়েকটি লাইন লিখতে পারেন যাতে অবশেষে সাইটে এক সারিতে একাধিক লিঙ্ক বোতাম পেতে পারেন, যার উপর ক্লিক করার মাধ্যমে নীচের উইন্ডোতে বিভিন্ন বিষয়বস্তু প্রদর্শিত হবে।
কোডটি দেখতে এরকম হবে:
একটি বিজ্ঞাপন পোস্ট করুন
বিজ্ঞাপন দেখুন
Image ওয়েবসাইটটিতে এটি কেমন দেখাবে:
কিভাবে একটি জুমলা সাইটে একটি আইফ্রেম সন্নিবেশ করান
একটি স্ট্যান্ডার্ড হিসাবে, জুমলা কন্ট্রোল প্যানেলে একটি সক্রিয় (ব্যবহারের জন্য প্রস্তুত) "HTML-কোড" মডিউল রয়েছে। এটির সাহায্যে, আপনি সাইটের যে কোনও জায়গায় যে কোনও কোড সন্নিবেশ করতে পারেন। যাইহোক, তিনি একগুঁয়েভাবে iFrem ট্যাগের কোডটিকে উপেক্ষা করেন। অতএব, আমরা একটি বিশেষ জুমি মডিউল ব্যবহার করব৷
প্রথমত, আপনাকে এটি ইন্টারনেট থেকে ডাউনলোড করতে হবে এবং জুমলা প্রশাসনিক প্যানেলের মাধ্যমে এটি ইনস্টল করতে হবে: "এক্সটেনশন" - "এক্সটেনশন ম্যানেজার" - "ফাইল নির্বাচন করুন"। ডাউনলোড করা আর্কাইভের পাথ নির্দিষ্ট করুন এবং "ডাউনলোড" এ ক্লিক করুন।
সফল ইনস্টলেশনের পরে, "মডিউল ম্যানেজার" এ যান এবং একটি নতুন তৈরি করুন৷ জুমির ধরন নির্বাচন করুন। যে উইন্ডোটি খোলে, তাতে, "কাস্টম কোড" ক্ষেত্রে, নিবন্ধের পূর্ববর্তী অনুচ্ছেদে দেখানো হিসাবে প্রস্তুত iFrem লিখুন। মডিউলটিকে একটি শিরোনাম দিন, স্থান নির্ধারণের অবস্থান এবং সাইটের পৃষ্ঠাগুলি উল্লেখ করুন৷ সংরক্ষণ করুন ক্লিক করুন এবং এটি পরীক্ষা করে দেখুন৷
ব্রাউজার এবং ফ্রেম
সমস্ত জনপ্রিয় ব্রাউজার ফ্রেম উইন্ডোর বিষয়বস্তু ভালোভাবে প্রদর্শন করে: Chrome, Safari, Firefox, Android, iOS। ইন্টারনেট এক্সপ্লোরার এবং অপেরার এই ক্ষেত্রে বিশেষ করে উচ্চ হার রয়েছে। এবং এখনও কোন গ্যারান্টি নেইযাতে আপনার সাইটের ভিজিটর সমস্ত উইন্ডোর বিষয়বস্তু দেখতে পাবে। এই ক্ষেত্রে, আপনি noframe ট্যাগ (খোলা এবং বন্ধ) ব্যবহার করে একটি বার্তা ছেড়ে যান। আপনি এটিতে নিম্নলিখিতগুলি লিখতে পারেন: "আপনার ব্রাউজারটি পুরানো। সাইটের বিষয়বস্তু প্রদর্শন করতে সংস্করণটি আপডেট করুন।" ব্যবহারকারীর ব্রাউজার সঠিকভাবে ফ্রেম রেন্ডার করলে, তারা এই বার্তাটি দেখতে পাবে না৷
সুতরাং ফ্রেম হল একটি সাইটের একটি এলাকা বা উইন্ডো যার নিজস্ব URL আছে। একই সাথে একটি ব্রাউজার ক্ষেত্রে বেশ কয়েকটি ওয়েব পৃষ্ঠা বা স্বাধীন নথি প্রদর্শন করতে ব্যবহৃত হয়, তাদের নিজস্ব URL রয়েছে। ফ্রেমগুলি আপনাকে একটি জটিল সাইট ভালভাবে সংগঠিত করার অনুমতি দেয় তা সত্ত্বেও, আইফ্রেম ব্যতীত সেগুলি দীর্ঘ সময়ের জন্য ব্যবহার করা হয়নি। একটি নির্দিষ্ট উইন্ডোতে উপস্থাপনা, একটি ভিডিও প্লেয়ার, পাঠ্য নথি লোড করার জন্য এই ট্যাগের ব্যবহার এখনও প্রাসঙ্গিক৷ এটি সক্রিয়ভাবে বড় এবং সুপরিচিত ওয়েব সংস্থান দ্বারা ব্যবহৃত হয়৷
-
