قرار دادن عکس در پشت زمینه سایت وردپرس با CSS

قرار دادن عکس در پشت زمینه سایت وردپرس با CSS

قرار دادن عکس در پشت زمینه سایت وردپرس با CSS

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

ما در سایت های که طراحی می کنیم به مشتریان خود اول از همه سفارش می کنیم که هیچ زمانی از این روش که یک تصویر در پشت زمینه سایت خود قرار دهند ، استفاده نکنند چون که قرار دادن تصویر به عنوان پشت زمینه در سایت حداقل 100K از حجم فضای سایت شما افزایش پیدا خواهد کرد

چرا پشت زمینه سایت خود را باید تصویر قرار دهیم :

یک توصیه برادرانه ، پشت زمینه سایت خود را به تصویر تغییر ندهید و دلیل آن را هم در ادامه به شما توضیح می دهم ، قرار دادن تصویر زمینه به صورت تصویر به شما کمک می کند تا نرخ بازدید بیشتر و تعامل بیشتری با کاربران خود داشته باشید ولی از یک نظر دیگر هم قرار دادن عکس در پشت زمینه سایت شما می تواند سرعت سایت شما را کاهش دهد

چون خود عکس به فرض مثال اگر که حجم بالایی داشته باشد به فرض مثال حجم تصویر شما 300 کیلوبایت باشد و حجم قالب و کد نویسی های قالب سایت شما هم 300 کیلوبایت باشد باهم می شود 600 کیلوبایت و سایت شما برای لود شدن نیاز به زمان بیشتری دارد و هر چه قدر که سرعت لود سایت شما پایین تر باشد می تواند در نرخ بازدید کننده سایت شما را کاهش دهد و مشتری های محصولات شما کمتر شود و باعث می شود تا سئو سایت شما هم افت داشته باشد.

قرار دادن پشت زمینه در چه سایت های کاربرد دارد :

یکی از سوالات کاربران این است که قرار دادن پشت زمینه چه سایت های مناسب می باشد و در چه سایت های نامناسب می باشد ، قرار دادن پشت زمینه برای سایت های تفریحی مانند سایت های دانلود موزیک و فیلم و سریال و برنامه های کامپیوتر مناسب می باشد و برای سایت های شرکتی و خدماتی و تور و گردشگری و فروشگاهی نا مناسب می باشد و شما می توانید اگر که سایت تفریحی دارید از این قابلیت برای سایت خود استفاده کنید.

اگر که می خواهید در سایت خود پشت زمینه عکس یا تصویر قرار دهید ، اول از همه سعی کنید که در سایت خود تصویر کم حجم قرار دهید تا سرعت لود سایت شما را کند نکند تا باعث کم شدن مشتری های شما نشود.

چطور می توانیم یک عکس در پشت زمینه سایت خود قرار دهیم :

همانطور که می دانید وردپرس یک سیستم مدیریت محتوا منبع باز یا همان اوپن سورس می باشد که به شما این امکان را می دهد تا بتوانید خیلی راحت برای خودتان هر بخشی را که می خواهید در سایت خود اضافه کنید و یا حذف و ویرایش کنید ما این بار به شما با کد نویسی دانش CSS می خواهیم این بار به شما کمک کنیم تا بتوانید یک عکس را به عنوان پشت زمینه در سایت خود نمایش دهید

برای اینکه شما بتوانید یک عکس به عنوان پشت زمینه در سایت خود نمایش دهید باید کد نویسی انجام دهید و می توانید این کار را با افزونه های صفحه ساز مانند المنتور انجام داد ولی زمانی که از افزونه صفحه ساز استفاده نمی کنید باید با کد نویسی این کار را انجام دهید

برای انجام کد نویسی باید وارد پنل مدیریت سایت خود شوید و از بخش نمایش وارد بخش ویرایشگر پرونده پوسته شوید و در این بخش باید وارد فایل Style.css شوید و کد زیر را در انتهای این فایل قرار دهید.

body{
	background:url(آدرس عکس شما) no-repeat;
}

اینجا شما در کد بالا در بخش آدرس عکس شما باید آدرس عکس یا همان URL تصویر خود را مشخص کنید و حواستان باشد که در کد بالا با معرفی کد no-repeat تعریف شده است که عکس تکرار نشود ولی اگر که می خواهید عکس تکرار شود باید no-repeat را به Repeat تغییر دهید.

تمام صفحه کردن عکس پشت زمینه با CSS :

شما می دانید که بعضی وقت ها ممکن است که عکس یا همان تصویر ما سایز آن مناسب برای تکرار شدن نباشد و نیاز باشد تا عکس خود را به صورت پشت زمینه تمام صفحه در سایت نمایش دهیم برای این کار باید کد زیر را در Style.css استفاده کنیم :

background-size:cover;

در کد بالا معرفی شده است که تصویر زمینه سایت را به تمام صفحه تبدیل می کند

به همین راحتی شما می توانید یک پشت زمینه را در سایت خود قرار دهید.

موفق و پیروز باشید.

مهران حسینی راد وب‌سایت
من مهران حسینی راد هستم ! از سال 94 در زمینه طراحی سایت با وردپرس در حال فعالیت هستم و با تیم های محبوب زیاد فعالیت داشته ام تا اینکه تصمیم گرفتم میهن آکادمی راه اندازی کنم و تجربه این 9 سال فعالیتم را با شما به اشتراک بگذارم

دیدگاهتان را بنویسید