ایک موبائل ریسپانسیو ویب سائٹ کسی بھی آن لائن کاروبار کا ایک اہم حصہ ہے۔
گوگل موبائل پیج لوڈ کی رفتار کو کسی بھی ویب سائٹ کی سرچ رینکنگ کے کلیدی عامل کے طور پر استعمال کرتا رہا ہے۔ اس کی بنیادی وجہ یہ ہے کہ عالمی ویب ٹریفک کا نصف سے زیادہ موبائل ٹریفک سے آتا ہے۔
لہذا، آپ کی سائٹ کی صحت اور گوگل سرچ انجن میں بہتر درجہ بندی دونوں کے لیے ایک موبائل ریسپانسیو ویب سائٹ ناگزیر ہے۔ Elementor صفحہ بلڈر کے ساتھ موبائل ریسپانسیو ویب سائٹ کیسے بنا سکتے ہیں
ایک ریسپانسیو لے آؤٹ ہر اسکرین کے سائز کے مطابق تمام مواد کو خود بخود اسکیل کرکے اختراعی کام کرتا ہے۔ یہ موبائل اسکرین پر خود بخود تصاویر اور مواد کا سائز تبدیل کرتا ہے تاکہ آپ کے ناظرین بغیر کسی کوشش کے آپ کے مواد کو دیکھ سکیں۔
ہم میں سے اکثر ایک تھیم خریدتے ہیں جو موبائل کے ساتھ ساتھ جوابدہ ہونے کا دعویٰ کرتا ہے۔ تاہم، جب آپ کی تھیم کا ڈیزائن موبائل اسکرین پر مکمل طور پر ٹوٹ جاتا ہے تو چیزیں مایوس کن ہوسکتی ہیں۔
ایسے حالات پر قابو پانے کے لیے، ہم ایک موبائل ریسپانسیو حل لے کر آئے ہیں جہاں آپ Elementor پیج بلڈر کے ریسپانسیو لے آؤٹ ٹولز کا استعمال کرتے ہوئے اپنی ویب سائٹ کا ڈیزائن شروع سے ہی بنا سکتے ہیں۔ ان موبائل ریسپانسیو ٹولز کی مدد سے، آپ اپنی ویب سائٹ لے آؤٹ کے کسی بھی کونے کو خاص طور پر، ٹائپوگرافی، پیڈنگ، اور مارجن اور موبائل الائنمنٹ کو موافقت دے سکتے ہیں۔ اس کے علاوہ، آپ موبائل پر کالم کی ترتیبات اور آرڈر کو تبدیل کرنے کے قابل ہو جائیں گے۔
اب، آپ موبائل ویو موڈ پر سوئچ کر کے اپنے صفحہ کی موبائل سیٹنگ میں ترمیم کر سکتے ہیں اور موبائل لے آؤٹ کے مطابق ایڈجسٹ کرنے کے لیے درج ذیل آپشنز کو چیک کر سکتے ہیں۔
اب، آئیے گہرائی میں کھودیں اور معلوم کریں کہ ایلیمینٹر پیج بلڈر کے ساتھ چیزیں کیسے کام کر رہی ہیں۔
تقریباً تمام قابل تدوین خصوصیات میں موبائل، ڈیسک ٹاپ اور ٹیب کی ترتیبات کو ایڈجسٹ کرنے کا اختیار ہوتا ہے۔ اگر آپ مینو کے نیچے ریسپانسیو موڈ پر کلک کرتے ہیں۔
بعض اوقات ہم اپنی ڈیسک ٹاپ سائٹ پر ایک بولڈ اور نمایاں سرخی چاہتے ہیں، اور یہ ڈیسک ٹاپ ڈسپلے پر بالکل ٹھیک نظر آتا ہے، لیکن جب آپ موبائل ویو کو آن کرتے ہیں، تو سرخی پوری اسکرین کو لے لیتی ہے اور مناسب نہیں لگتی ہے۔
آپ ٹیب اور موبائل پر کسی بھی ٹیکسٹ عنصر کے ٹیکسٹ سائز کو ایڈجسٹ کر سکتے ہیں۔ آپ موبائل ہیڈنگز کے لیے مختلف ٹیکسٹ سائز بھی سیٹ کر سکتے ہیں جو موبائل اسکرین پر بہت اچھے لگتے ہیں اور بہتر طریقے سے اسکرین میں فٹ ہوتے ہیں۔ اس ڈیمو پیج میں، میں نے ایک سرخی بنائی ہے جو ڈیسک ٹاپ سائٹ پر بہت اچھی لگتی ہے، جب کہ موبائل اسکرین پر یہ پوری اسکرین لیتی ہے۔
اگر میں سرخی والے کالم کے ایڈٹ آپشن پر کلک کرتا ہوں تو میں ٹائپوگرافی سیکشن میں جا سکتا ہوں جہاں میں ہیڈنگ کا سائز ایڈجسٹ کر سکتا ہوں جو ڈیسک ٹاپ اور موبائل اسکرین پر بھی ٹھیک نظر آتا ہے۔ میں دونوں کو الگ الگ کنٹرول کر سکتا ہوں۔ میرے ڈیسک ٹاپ سائٹ کے منظر کے لیے، سرخی کا سائز 49px ہے، لیکن موبائل ویو پر، یہ فٹ نہیں ہوتا
ایڈجسٹ کرنے کے لیے، میں موبائل ریسپانسیو موڈ> اسٹائل> ٹائپوگرافی> px سائز کو 30 پر کلک کروں گا جو موبائل اسکرین میں آسانی سے فٹ ہوجاتا ہے۔
پیڈنگز کو ایڈجسٹ کرتے وقت، یہ تجویز کیا جاتا ہے کہ EM یا فیصد میں سیٹ ویلیوز کے بجائے پکسلز میں ویلیوز استعمال نہ کریں کیونکہ یہ سائز کو اسکرین کے مجموعی سائز کے مطابق رکھے گا۔
آپ دیکھ سکتے ہیں کہ ہم نے پیڈنگ کو 70px دائیں اور بائیں کے طور پر استعمال کیا ہے، جو ڈیسک ٹاپ سائٹ پر اچھی لگتی ہے۔ تاہم اس ترتیب کے لیے موبائل ویو ایک مکمل گڑبڑ ہے۔
ہم ہر طرف پیڈنگ کو 17 px پر ایڈجسٹ کر سکتے ہیں پھر یہ بالکل ٹھیک نکلا۔
متبادل طور پر، آپ پورے کالم کی ترتیب کو 750 px پر سیٹ کر سکتے ہیں جہاں آپ کا مواد ڈیسک ٹاپ یا موبائل دونوں منظروں پر اسکرین کو ایڈجسٹ کرنے کی ضرورت کے بغیر ایک باکس میں دکھایا جائے گا۔ یہ باکس کے اندر موجود مواد کو خود بخود ایڈجسٹ کر دے گا۔
ایک بار جب آپ افقی طور پر کالم بناتے ہیں، جسے ڈیزائنرز سب سے زیادہ پسند کرتے ہیں، تو آپ سیکشنز کو ڈپلیکیٹ کر سکتے ہیں اور وقت بچا سکتے ہیں۔ ایک وقت میں ایک سیکشن بنائیں اور پھر اسے دوبارہ استعمال کریں اگر یہ وقت بچانے کے لیے اچھا ہے۔
کچھ پس منظر کی تصاویر ڈیسک ٹاپ ویو پر اچھی لگتی ہیں، لیکن امکان یہ ہے کہ تصویر اتنی بڑی نہیں ہوگی جتنی موبائل اسکرین پر۔ لہذا، تخلیقی طور پر سوچیں اور موبائل اسکرین پر ایک مختلف تصویر کا انتخاب کریں۔ مختلف موبائل ویو کو منتخب کرنے کے لیے سیکشن> اسٹائل ٹیب پر کلک کریں> ڈیوائس آئیکن پر کلک کریں اور موبائل ویو کو منتخب کریں۔ اب آپ جو بھی تصویر منتخب کریں گے، وہ صرف موبائل ویو پر نظر آئے گی۔
آپ ڈیوائس کے مطابق کسی بھی سیکشن یا کالم کی مرئیت کو بھی کنٹرول کر سکتے ہیں۔
بعض اوقات، ہم اپنے مواد یا تصاویر کو دو یا تین حصوں یا مختلف کالموں میں ڈسپلے کرتے ہیں، لیکن ہم اسے موبائل پر ڈسپلے کرنا پسند نہیں کرتے۔ اسی لیے Elementor اس حصے کو چھپا سکتا ہے جسے آپ موبائل ویو پر ظاہر کرنا پسند نہیں کرتے۔
پر جائیں > سیکشن سیٹنگز > ایڈوانسڈ > ریسپانسیو وہاں آپ کو مختلف امکانات یا بصری ترجیحات نظر آئیں گی۔ آپ اپنی ترجیح کے لحاظ سے ڈیسک ٹاپ پر سیکشن کو چھپا سکتے ہیں، ٹیب پر چھپا سکتے ہیں یا موبائل پر چھپا سکتے ہیں۔
آپ سیٹنگز سیکشن سے کالم آرڈر بھی تبدیل کر سکتے ہیں۔ کے پاس جاؤ؛ سیکشن سیٹنگز> ایڈوانسڈ> ریسپانسیو> ریورس کالم اور ہاں پر کلک کریں۔
موبائل اور ڈیسک ٹاپ ویو پر متبادل حصے بنائیں۔ کبھی کبھی، سلائیڈر سیکشن موبائل پر اتنا کارآمد نہیں لگتا جتنا ڈیسک ٹاپ پر اس لیے آپ سلائیڈر سیکشن استعمال کرنے کے بجائے کوئی دوسرا سیکشن استعمال کر سکتے ہیں۔ آپ ایسا کر سکتے ہیں ایڈوانسڈ ٹیب پر جائیں> اس سیکشن کی مرئیت کو آن/آف کریں جسے آپ ڈسپلے نہیں کرنا چاہتے اور اس پر ایک متبادل تصویر شامل کریں۔
جب آپ انہیں موبائل ویو پر دیکھتے ہیں تو کالم کے تمام حصوں کو 100% چوڑائی ملتی ہے۔ تاہم، موبائل پر کالم کی چوڑائی کے مطابق چوڑائی کو تبدیل کیا جا سکتا ہے۔ اگر آپ کے پاس دو کالم ہیں، تو آپ ہر سیکشن کی زیادہ سے زیادہ چوڑائی 50% پر سیٹ کر سکتے ہیں۔
Elementor تمام طاقتور خصوصیات کے ساتھ آتا ہے تاکہ اسکرین کے تمام سائز کے جوابی کالم لے آؤٹ کو کنٹرول کیا جا سکے۔ یہ آپ کو ویو موڈ سلیکشن کے مطابق ہر سیکشن کو دوبارہ ایڈجسٹ کرنے کی اجازت دیتا ہے۔ موبائل دوستانہ ویب سائٹ رکھنا ناگزیر ہے کیونکہ گوگل الگورتھم موبائل دوستانہ ویب سائٹس کی درجہ بندی کو سب سے زیادہ سمجھتا ہے۔ ریسپانسیو ویب سائٹس نہ صرف بہتر SEO حاصل کرنے کے لیے ضروری ہیں، بلکہ آپ کو زیادہ ٹریفک حاصل کرنے کی بھی ضرورت ہے، کیونکہ 80% سے زیادہ ٹریفک موبائل ویوز سے آتی ہے۔
اب Elementor صفحہ بلڈر خصوصی خصوصیات کے ساتھ آتا ہے جو اس کے صارفین کو بغیر کسی کوشش کے موبائل کے موافق سائٹ بنانے کی اجازت دیتا ہے۔ امید ہے کہ، آپ کو میرا مضمون کارآمد معلوم ہوگا اور آپ کو Elementor کا استعمال کرتے ہوئے ایک ریسپانسیو ویب سائٹ بنانے کے طریقے کے بارے میں آپ کے تمام جوابات مل گئے ہیں۔
ویب سائٹ کے ہیڈر اور فوٹر ضروری عناصر ہیں۔ زیادہ تر معاملات میں، ہیڈر نیویگیشن فراہم کرتا ہے…
مارکیٹ میں سب سے زیادہ مقبول ورڈپریس تھیمز میں سے دو Astra اور OceanWP ہیں۔ پیشہ ورانہ…
ایک بہترین نیوز ویب سائٹ بنانے کے لیے ضروری نہیں کہ آپ ویب ڈیزائنر بنیں۔ ہم…
اخبار کی تھیم ایک اہم ترین ورڈپریس تھیم ہے جسے tagDiv نے ڈیزائن کیا ہے، ایک…
جب آن لائن اسٹور قائم کرنے کی بات آتی ہے تو، WooCommerce جانے والا plugin ہے۔ یہ…
ہیڈر عام طور پر پہلی چیز ہوتی ہے جب کوئی شخص آپ کی ویب سائٹ پر جانے پر دیکھتا ہے،…
تبصرے دیکھیں
اچھی پوسٹ! Bardzo odpowiada na moje potrzeby. Stworzyłam stronę ale widok mobilny mi się rozjechał. Dziękuję za wskazówki. Są bardzo pomocne 🙂
سپر! آپ اس معلومات کو اس وقت تک استعمال کرنے کے قابل نہیں ہوسکتے جب تک کہ آپ اسے پڑھنا ختم نہ کر لیں۔ اس کا مطلب بولوں:)
ہائے، کالم کی ترتیب کو تبدیل کرنے کے لیے آپ ڈریگ این ڈراپ براہ راست یا سیکشن ایکسپلورر استعمال کر سکتے ہیں۔ مرئیت کے بارے میں یہ سیکشن کا ایڈوانس سیٹ اپ ہے، آپ کو ڈیسک ٹاپ، ٹیبلیٹ اور موبائل کی مرئیت کو بند کرنا ہوگا۔
ذمہ دار پیڈنگ کیسے کریں؟
ہائے، پیڈنگ بالکل جوابی نہیں ہے، یہ ایک مقررہ قدر ہے۔ اگر آپ کو کوئی جوابی مسئلہ ہے تو آپ کو ڈیسک ٹاپ، ٹیبلیٹ اور فون کے لیے مختلف پیڈنگ ویلیو کی وضاحت کرنی ہوگی۔