ساخت نسخه موبایل وبسایت

می خواستم ببینم کاری میشه کرد که کاربری اگه با موبایل از سایت ما دیدن کرد نسخه موبایل وبسایت نمایش داده بشه ؟

مثل کاری که در گوگل میبینیم یا همین مجید آنلاین خودمون

از اونجایی که اپراتورهای کشور ما دارن این سرویس رو کم کم همگانی میکنند این مورد برای وبسایت های ایرانی خیلی با اهمیت خواهد شد


تو سایتم
از سیتم فیوژن استفاده کردم

راهی هست ؟
 

marSoul

Member
شما باید یک css جدا برای نسخه موبایل طراحی کنید و کد زیر را در Head قرار دهید :

کد:
<link rel="stylesheet" type="text/css" media="handheld" href="mobile.css">
 

maysam.m

Well-Known Member
البته توضیحات بیشتر اینکه :
شما باید تمام سبک دهی قالب خود برای موبایل را در فایل مثلا : mobile.css بنویسید و سپس لینکی که marSoul خان قرار داد را در قالب سایتت قرار دهی .
دوست من حتما باید با Css آَشنا باشی تا بتونی از قالب اصلیت یک نمونه هم برای موبایل یا چاپ یا .... تهیه کنی.
موفق باشید
 

marSoul

Member
خب شما نباید انتظار داشته باشی کل مبحث css رو توی این پست بشه توضیح داد ! به طور خلاصه شما باید از css طوری استفاده کنید که قسمتهایی را که برای نمایش در نسخه mobile لازم دارید در اندازه mobile screen نمایش بده و بقیه قسمتهای سایت که ضروری نیست را نشان ندهد.
به طور مثال اگه Adobe CS3 رو نصب کرده باشید در قسمت device central می تونید روی موبایلهای مختلف این کار رو تست کنید
 
با این توضیح یک قدم جلوتر رفتیم

ولی حدس میزنم خیلی زحمت میخواد تا به مقصودم برسم


سوال دیگه من اینه که رو سیستم فیوژن میشه چنین کاری رو بدون مشکل انجام داد ؟

چون میدونین که فیوژن .....


www.Mobilearena.ir <~~~
 

marSoul

Member
من با این سیستم کار نکردم، ولی اصولا ربطی به نوع سیستم نداره چون css یک استاندارد است و همه سیستمها باید آنرا رعایت کنند
 

maysam.m

Well-Known Member
یک راه ساده تر اینه که یه کپی از صفحه سبک خارجی CSS قالبت را ویرایش کنی و ستونها و منوهایی که مناسب نمایش در موبایل نیستند را با ویژگی Display : none مخفی کنی تا هر کسی که با موبایل و یا PDA سایت شما را تماشا کند سایت شما به راحتی و بدون لینکها و قسمتهای اضافی و همچنین بدون اسکرول کردن خیلی زیاد در صفحه نمایش موبایل به نمایش در بیاید.
به این نمونه توجه کنید:
مثلا قالب سایت شما 3 ستون دارد 2 ستون در سمت چپ و راست که اصطلاحا ناوبر یا سایدبار گفته میشود و این ستونها اصلا مناسب نمایش در صفحه موبایل نیستند بنابراین با ویژگی Display : none مخفی میشوند.



#side1 {
display:none;
width: 160px; /* left column width */
margin-left: -160px; /* negative left column width */
float: left;
position: relative;
z-index: 10;
}


در اینجا ما به فرض یکی از ستونها را با ای دی یا شناسه #side1 مخفی کردیم برای قسمتهای دیگر هم میتونید از دستور عمل بالا استفاده کنید
موفق باشید
 

جدیدترین ارسال ها

بالا