আমার প্রতিক্রিয়াশীল ওয়েবসাইট কাজ করছে না। ফিক্স: ভিউপোর্ট।

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

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

কেন প্রতিক্রিয়াশীল নকশা কাজ করে না

HTML ফাইলের শিরোনাম থেকে কোডের একটি লাইন অনুপস্থিত থাকলে প্রতিক্রিয়াশীল ডিজাইন কাজ করা বন্ধ করে দেয়। যদি কোডটির এই একক লাইনটি অনুপস্থিত থাকে তবে আপনার আইফোন, অ্যান্ড্রয়েড এবং অন্যান্য মোবাইল ডিভাইসগুলি ধরে নেবে যে আপনি যে ওয়েবসাইটটি দেখছেন এটি একটি সম্পূর্ণ আকারের ডেস্কটপ সাইট এবং এর আকারটি সামঞ্জস্য করে ভিউপোর্ট পুরো পর্দা আবদ্ধ।

ভিউপোর্ট এবং ভিউপোর্টের আকার বলতে কী বোঝ?

সমস্ত ডিভাইসে, ভিউপোর্টের আকারটি বর্তমানে কোনও ওয়েবপৃষ্ঠার ক্ষেত্রের আকারকে বোঝায় যা বর্তমানে ব্যবহারকারীর কাছে দৃশ্যমান। কল্পনা করুন আপনি 320 পিক্সেলের প্রস্থ সহ একটি আইফোন 5 রেখেছেন। অন্যথায় স্পষ্টভাবে না বলা পর্যন্ত, আইফোনগুলি ধরে নেয় যে আপনি যে ওয়েবসাইটটি দেখেন সেগুলি 980px প্রস্থের ডেস্কটপ সাইট।

এখন, আপনার কাল্পনিক আইফোন 5 ব্যবহার করে,আপনি 800px প্রশস্ত ডেস্কটপের জন্য ডিজাইন করা একটি ওয়েবসাইট দেখুন। এটিতে কোনও প্রতিক্রিয়াশীল বিন্যাস নেই, তাই আপনার আইফোনটি পূর্ণ-প্রস্থের ডেস্কটপ সংস্করণ প্রদর্শন করে।

বাটন ছাড়া আইফোন বন্ধ করুন

তবে একটি আইফোন 5 কেবল 320 পিক্সেল প্রশস্ত। সবসময় ভিউপোর্টের আকার হয় না?

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

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

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

ইমেসেজে অ্যাক্টিভেশনের জন্য অপেক্ষা করার অর্থ কী?

আমার প্রতিক্রিয়াশীল ওয়েবসাইট ভাঙা। আমি কীভাবে এটি ঠিক করব?

উত্তরটি এইচটিএমএল এর একক লাইন যা কোনও ওয়েবপৃষ্ঠার শিরোনামে সন্নিবেশ করা হলে ডিভাইসকে তার নিজস্ব প্রস্থে আইফোনটি সেট করতে (আইফোন 5 এর ক্ষেত্রে 320px) সেট করতে এবং পৃষ্ঠাটি স্কেল (বা জুম) না করতে বলে।

এই মেটা ট্যাগ সম্পর্কিত সমস্ত বিকল্পের আরও প্রযুক্তিগত আলোচনার জন্য, দেখুন tutsplus.com এই নিবন্ধ ।

ওয়ার্ডপ্রেস এক্স থিম এটি প্রতিক্রিয়াশীল না হলে কীভাবে ঠিক করবেন

আগের থেকে আমার বন্ধুর কাছে ফিরে আসুন: তিনি এক্স থিম আপডেট করার সময় কোডের এই এক লাইনটি অদৃশ্য হয়ে গেল। আপনার ফিক্স করার সময়, মনে রাখবেন যে এক্স থিমটি কেবল একটি হেডার ফাইল ব্যবহার করে না - এটি প্রতিটি স্ট্যাকের জন্য আলাদা আলাদা শিরোনাম ফাইল ব্যবহার করে, তাই আপনাকে নিজের সম্পাদনা করতে হবে।

আমি imessage গ্রুপ ছাড়তে পারি না কেন?

যেহেতু নিক থিমের ইথোস স্ট্যাকটি এক্স থিমটি ব্যবহার করে, তাই আমি x এর মধ্যে অবস্থিত শিরোলেখ ফাইলটিতে তার আগে কোডের কোড লাইন যুক্ত করতে হয়েছিল / ফ্রেমওয়ার্কস / ভিউস / পৃথক / ডাব্লুপি- হেডার.পিপি । আপনি যদি অন্য কোনও স্ট্যাক ব্যবহার করেন তবে সঠিক শিরোনাম ফাইলটি খুঁজে পেতে আপনার স্ট্যাকের (ইন্টিগ্রিটি, পুনর্নবীকরণ ইত্যাদির নাম) পরিবর্তিত করুন যে এক লাইন andোকান, এবং voila! আপনি যেতে ভাল।

সুতরাং এটি আমার সিএসএস মিডিয়া প্রশ্নগুলিও ঠিক করে দেয়?

আপনি যখন এইচটিএমএল ফাইলের শিরোনামে সেই লাইনটি সন্নিবেশ করবেন তখন আপনার প্রতিক্রিয়াশীল @ মিডিয়া প্রশ্নগুলি হঠাৎ করে আবার কাজ শুরু করবে এবং আপনার ওয়েবসাইটের মোবাইল সংস্করণ আবার ফিরে আসবে। পড়ার জন্য ধন্যবাদ এবং আমি আশা করি এটি সাহায্য করে!

পেয়েট ফরওয়ার্ড মনে রাখবেন,
ডেভিড পি।