How to Hide and Show Different Blogger Content on Mobile and Desktop in Bangla

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

সর্বাধিক গুরুত্বপূর্ণ: আপনি যে কোনও পোস্ট বা যে কোনও উইজেটে এটি করতে পারেন। ডেস্কটপে মোবাইল সামগ্রী এবং মোবাইলে ডেস্কটপ সামগ্রী লুকানোর জন্য এই সাধারণ পদক্ষেপগুলি অনুসরণ করুন।

এই উদ্দেশ্যে আমরা এইচটিএমএল কোড তৈরি করব। আমরা এই পোস্টগুলি যে কোনও পোস্ট বা পৃষ্ঠায় এবং যে কোনও উইজেটে যুক্ত করতে পারি।

<div id=”content-desktop”>

This is the content that will display on DESKTOPS.

</div>

<div id=”content-mobile”>

This is the content that will display on MOBILE DEVICES.

</div>

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

১/ blogger.com ব্লগার যান

২/ থিম ক্লিক করুন

৩/ এইচটিএমএল সম্পাদনা ক্লিক করুন

৪/ সমস্ত কোড প্রসারিত করুন

৫/ এখন Ctrl + F টিপুন

৬/ লিখুন   ]] </ b: skin>  এবং অনুসন্ধান করুন

৭/ এখন এই কোড আগে এই CSS কোড যুক্ত করুন

#content-desktop {display: block;}

#content-mobile {display: none;}

@media screen and (max-width: 768px) {

#content-desktop {display: none;}

#content-mobile {display: block;}

}

গুরুত্বপূর্ণ দ্রষ্টব্য: এখন যখনই কোনও পৃষ্ঠাতে বা কোনও পোস্টে বা কোনও উইজেটে আপনি এইচটিএমএল কোড ব্যবহার করবেন তবে তারা কাজ করবে। আপনি ডেস্কটপে কী প্রদর্শন করতে চান এবং মোবাইলে আপনি কী দেখাতে চান তা এটি নির্ভর করে।