انجمن سایت کلیدستان


رتبه موضوع:
  • 0 رای - 0 میانگین
  • 1
  • 2
  • 3
  • 4
  • 5
آموزش افزودن قابلیت پرینت در طراحی سایت

آموزش افزودن قابلیت پرینت در طراحی سایت

#1
Tongue 
آموزش افزودن قابلیت پرینت در طراحی سایت:همانطور که در مطلب قبل به آن اشاره کردیم، فاکتورهای بسیار زیادی در موفقیت طراحی سایت شما دخیلند، اما در تمامی این موارد یک نقطه اشتراک وجود دارد و آن توجه هرچه بیشتر به نیازهای کاربران است.در این بخش با نحوه افزودن قابلیت پرینت خواهید آموخت که چگونه به کاربران خود اجازه بدهید تا مطالب مفید و مورد نظرشان در وب سایت شما را به طور فیزیکی و در برگه به همراه داشته باشند.با این کار شما یک گام بزرگ در جهت برطرف کردن نیاز کاربران و در ادامه سرازیر کردن شمار بیشتری از آنان برداشته اید.

[/url]
[عکس: %D8%A7%D9%81%D8%B2%D9%88%D8%AF%D9%86-%D9...8%AA-3.jpg]


چگونگی افزودن قابلیت پرینت به وب سایت
بسیاری از کاربران از نحوه پرینت گرفتن به وسیله امکانات پیش فرض مرورگر خود بی اطلاعند و یا اینکه دکمه چاپ پیش فرض موجود در مرورگر، عناصر اضافی دیگر (منوها، تبلیغات و…) را نیز در کنار مطلب مورد نظر آن ها در نسخه پرینت نشان می دهد.
این جایی است که شما باید با قرار دادن امکان افزودن قابلیت پرینت محتوای اصلی به تنهایی، کاربران خود را در سطح بالایی ار رضایت و خشنودی نگه دارید.در نظر داشته باشید که این کار بوسیله کدهای CSS و جاوااسکریپت میسر خواهد شد.
اگرچه روش های گوناگونی برای پیاده سازی این امکان وجود دارد، اما ما به ذکر یک روش کاربردی بسنده خواهیم کرد.
روشی مناسب برای افزودن قابلیت پرینت
روش اول : با استفاده از این روش قسمت های زائدی را که نمی خواهید در نسخه چاپی وجود داشته باشد را شناسایی و در یک فایل  CSS معرفی و حذف خواهید کرد.در ادامه قسمت های باقی مانده را در همان فایل CSS برای چاپ با ظاهر دلخواه در افزودن قابلیت پرینت، استایل دهی می کنیم.


[عکس: %D8%A7%D9%81%D8%B2%D9%88%D8%AF%D9%86-%D9...8%AA-2.jpg]

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

قدم اول افزودن قابلیت پرینت
نخست می بایست استایل های مورد نظر خود بر روی نسخه چاپی را در یک فایل CSS جداگانه نوشته، سپس به بخش header  کدهای صفحه وب خود آن را متصل کنید.
<link rel=”stylesheet” href=”Print.css” type=”text/css” media=”print”>
پارامتر media=”print” در این دستور برای افزودن قابلیت پرینت حائز اهمیت است.این پارامتر به صفحه وب سایت اشاره می کند که فایل CSS ضمیمه شده تنها برای استایل دهی عناصر نسخه پرینت بوده و برای دیگر موارد باید از استایل های اصلی صفحه استفاده شود.


[عکس: %D8%A7%D9%81%D8%B2%D9%88%D8%AF%D9%86-%D9...8%AA-4.jpg]

دقت کنید برای جدا کردن عناصری که نمی خواهید در نسخه پرینت نشان داده شوند، باید به کمکid و یا class مربوط به آن عنصر، با نوشتن دستور زیر آن را در صفحه پرینت غیرقابل مشاهده کنید.دستورات ذکر شده در فایل CSS مربوط به پرینت نوشته می شوند:
1     .adverise       {
2     display: none;
3                         }
کد بالا همه عناصری دارای ویژگی class=”adverise ” را مخفی می کند.
قدم دوم افزودن قابلیت پرینت
قدم بعد به کدهای HTML اختصاص دارد.
حال دکمه ای مورد نیاز است تا با اشاره کردن بر روی آن ماحصل تلاش شما برای افزودن قابلیت پرینت تولید شود، یعنی ایجاد نسخه چاپی

[url=https://inten.asia/wp-content/uploads/2016/02/%D8%A7%D9%81%D8%B2%D9%88%D8%AF%D9%86-%D9%82%D8%A7%D8%A8%D9%84%DB%8C%D8%AA-%D9%BE%D8%B1%DB%8C%D9%86%D8%AA-1.jpg]
[عکس: %D8%A7%D9%81%D8%B2%D9%88%D8%AF%D9%86-%D9...8%AA-1.jpg]

کد پایین برای این کار مورد استفاده قرار می گیرد.

<a href=”javascript:window.print()”>چاپ این صفحه!</a>

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


پرش به انجمن:


کاربران در حال بازدید این موضوع: 1 مهمان