طراحی سایت | طراحی سایت تهران | طراحی سایت ارزان

با ما تماس بگیرید : 5-44251104-021
به نام بهترین طراح دنیا
  • طراحی سایت

امتیاز کاربران

ستاره غیر فعالستاره غیر فعالستاره غیر فعالستاره غیر فعالستاره غیر فعال
 

ریسپانسیو کردن عکسها در طراحی سایت وردپرس

وردپرس به نظر ما یکی از بهترین گزینه هاست برای اینکه بخواهیم طراحی سایت خود برنامه نویسی کنیم ولی چند تا باگ دارد که کاربر عادی اذیت می شود یکی از این باگ ها این هست وقتی کاربر در داخل پنل ادیتور وردپرس به عکسها سایز می دهد وقتی کاربر در موبایل یا دستگاه های دیگر طراحی سایت را مشاهده می کند عکسها بزرگ دیده می شوند و این برای یک سایت خیلی بد هست چون الان بیشتر کاربران سایت را در دستگاه های دیگر مانند موبایل ها و اسمارت فون ها مشاهده می کنند مخصوصا سایت های خبری را ما چند ماه پیش با این مشکل مواجه بودیم البته اگر از قالب های آماده و بسته های نصبی استفاده می کنید همه این آیتم ها هست و نیازی نیست که شما عکسها را کنید این برای کسانی هست که قالب اختصاصی دارد سایت آنها

می گفتیم مشتری عکس میزاشت و به آن طول عرض می داد و می گفت سایت من در موبایل عکسها بزرگ دیده می شوند ما هم چک می کردیم بله وردپرس وقتی اندازه آن را روی فول سایز بزارید شما می توانید از در سایت ما مشاهده کنید و استفاده کنید همان اندازه را در سایت های موبایلی هم نشان می دهد و بعد از جستجو در اینترنت در بین سایت های خارجی راه آن را پیدا کردیم تا دیگر عکسها ریسپانسیو نشان داده شود

ریسپانسیو کردن عکسهای وردپرس از طریق کد نویسی

ریسپانسیو کردن عکسهای وردپرس از طریق کد نویسی

برای اینکه بتوانید به صورت حرفه ای عکسهای طراحی سایت وردپرسی خود را ریسپانسیو کنید اول باید به فایل function.php در پوشه قالبی که ساختید بروید و بعد از آن این تکه کد و تابع را در داخل آن وارد کنید شما باید تابع add_image_size را در فایل function.php فراخوانی کنید


add_image_size( 'sml_size', 300 );

add_image_size( 'mid_size', 600 );

add_image_size( 'lrg_size', 1200 );

add_image_size( 'sup_size', 2400 );

نصب پلاگین ریسپانسیو کردن عکسها

 راه دوم : نصب پلاگین ریسپانسیو کردن عکسها

خوب ما ایرانی ها همیشه راه آسان تر را دوست داریم و آن نصب پلاگین هست و نمی دانیم که همین پلاگین چقدر باعث کاهش سرعت در طراحی سایت ما شود و در  راه اول اضافه کردن کد را پیشنهاد می کنیم از موضوع خارج نشویم شما برای اینکه عکسهای خود را در وردپرس ریسپانسیو کنید باید پلاگین RICG Responsive Images را نصب کنید اگر دقت کرده باشید قبل از نصب پلاگین کدی در ادیتور html  به شما می دهد اینجوری هست


<img class="aligncenter wp-image–176 size-full" src="http://signwebdesign.ir/wp-content/uploads/2017/05/img1.jpg" >

ولی وقتی شما پلاگین را نصب می کنید به این شکل در می آید

 

<img class="aligncenter wp-image–137 size-full" src="http://signwebdesign.ir/2/wp-content/uploads/2017/05/onavo.jpg" srcset="http://signwebdesign.ir/2/wp-content/uploads/2017/05/onavo–169x300.jpg 169w, http://signwebdesign.ir/2/wp-content/uploads/2017/05/onavo–576x1024.jpg 576w, http://signwebdesign.ir/2/wp-content/uploads/2017/05/onavo–300x534.jpg 300w, http://localhost/SebastianGreen/2017/wp_dev/wp-content/uploads/2017/05/onavo–600x1067.jpg 600w, http://signwebdesign.ir/2/wp-content/uploads/2017/05/onavo.jpg 600w" alt="onavo" width="600" height="1067" sizes="(max-width: 600px) 100vw, 600px">

 

خوب تصاویر سایت وردپرسی شما ریسپانسیو شد به همین راحتی و آسانی خیلی راحت نبود؟

با نظرات خود ما را در جهت نوشتن مطالب بروز یاری دهید

 

 

درباره نويسنده

رضا رجب پور هستم کارشناسي رشته فناوري اطلاعات و ارتباطات 4 سال تجربه کاري در زمينه طراحي سايت و بهينه سازي سايت را دارم و به زبانهاي Html , CSS , CSS3 , Jquery , JavaScript , PHP تسلط کافي را دارم و مدير تيم مهندسين ساين وب که با چند تن از دوستان رشته نرم افزار و گرافيک يک تيم خلاق و با تجربه را ايجاد کرده ايم و بيش از 80 نمونه کار طراحي سايت و بهينه سازي سايت در ايران و خارج از ايران انجام داده ايم و خوشحال مي شويم که اطلاعات و تجربيات خود را در اختيار ديگران و هموطنان عزيز قرار دهيم لطفا ما را در شبکه هاي اجتماعي دنبال کنيد تا از مطالب جديد ما اطلاع پيدا کنيد با تشکر و احترام







لطفا نظر خود را بنویسید

لطفا نظر خود را بنویسید

0

نظرات کاربران

  • نظری وجود ندارد


نظرات مشتریان در مورد ما

جناب مهندس موسوی مدیر بخش IT شرکت پارس سرام : ما چهار سایت هلدینگ خود را به تیم مهندسین ساین وب سپردیم فکر نمی کردیم بتوانیم با همچین قیمتی سایتی با این کیفیت و جذاب برایمان طراحی کنند . با اینکه خودم برنامه نویس هستم ایده ها و افکت های جذابی طراحی کردند و هر چهار سایت با هم فرق دارد الان هم سایتی دیگر را به تیم مهندسین ساین وب سپرده ایم

جناب مهندس هاشمی مدیر سایت خرید سهام : برنامه نویسی سایت و الگوریتم پیچیده و کاری که می خواستم از سایت را به نحو احسن و برنامه نویسی و پیاده سازی کردند واقعا تیم فوق العاده ای هستند سایتی که من خواستم ایده خودم بود و نمونه آن در ایران نبود این سایت را از پایه برام طراحی کردند

جناب موسوی مدیر شرکت آژند : واقعا از طراحی سایت و ایده های خلاقانه و جذاب تیم مهندسین ساین وب شگفت زده شدم سایت من بیش از چیزی که انتظار داشتم بهتر شد ما هم در حوزه کاری خود با چند کلمه رتبه خوبی در گوگل داریم بعد از مدتی کوتاهی از آقای مهندس رجب پور مدیر تیم مهندسین ساین وب کمال تشکر را دارم

مهندس هراتی مدیر سایت تهران آهن : از نحوه طراحی سایت و گرافیک سایت و پشتیبانی عالی ساین وب واقعا راضی هستم ما بعد از دو ماه با کلمه قوطی و پروفیل صفحه یک گوگل هستیم از خانم گرایلی مسئول پشتیبانی سایت و کارشناس سئو کمال تشکر را دارم

لطفا مارا در گوگل محبوب کنید