کیا آپ کا ورڈپریس بلاگ باسہولت چھپنے والا ہے؟

سی ایس ایس پرنٹ کریں

جیسا کہ میں نے کل کی پوسٹ مکمل کی سوشل میڈیا آر او آئی، میں اس کا ایک جائزہ ڈاٹسٹر سی ای او کلینٹ پیج کو بھیجنا چاہتا تھا۔ جب میں نے کسی پی ڈی ایف پر طباعت کی ، اگرچہ ، صفحہ گڑبڑ تھا!

ابھی بھی بہت سارے لوگ موجود ہیں جو کسی ویب سائٹ کی کاپیاں بانٹنا ، حوالہ کرنا ، یا کچھ نوٹ کے ساتھ فائل کرنا چاہتے ہیں۔ میں نے فیصلہ کیا ہے کہ میں اپنے بلاگ کو پرنٹر دوستانہ بنانا چاہتا ہوں۔ یہ اس سے کہیں زیادہ آسان تھا جتنا میں نے سوچا تھا۔

اپنے پرنٹ ورژن کو کیسے ظاہر کریں:

اس کو پورا کرنے کے ل You آپ کو سی ایس ایس کی بنیادی باتوں کو سمجھنے کی ضرورت ہوگی۔ سب سے مشکل حصہ آپ کے براؤزر کے ڈویلپر کنسول کا استعمال کرتے ہوئے جانچ کرنا ، چھپانا اور ایڈجسٹ کرنا ہے تاکہ آپ اپنے CSS لکھ سکیں۔ سفاری میں ، آپ کو ڈویلپر ٹولز کو فعال کرنے ، اپنے صفحے پر دائیں کلک کرنے ، اور معائنہ کرنے والے مواد کو منتخب کرنے کی ضرورت ہوگی۔ اس سے آپ کو وابستہ عنصر اور CSS دکھائے جائیں گے۔

سفاری کے پاس ویب انسپکٹر میں آپ کے صفحے کا پرنٹ ورژن ڈسپلے کرنے کے لئے ایک چھوٹا سا آپشن ہے۔

سفاری۔ ویب انسپکٹر میں پرنٹ ویو

اپنے ورڈپریس بلاگ کو باسہولت چھپنے والا متن بنانے کا طریقہ:

پرنٹ کے ل your اپنے اسٹائل کی وضاحت کرنے کے کچھ مختلف طریقے ہیں۔ ایک صرف آپ کی موجودہ اسٹائل شیٹ میں ایک ایسا حص addہ شامل کرنا ہے جو میڈیا پرنٹ سے متعلق ہے۔

@media print {
     header, 
     nav, 
     aside { 
         display: none; 
     }
     #primary { 
         width: 100% !important 
     }
     .hidden-print, 
     .google-auto-placed, 
     .widget_eu_cookie_law_widget { 
         display: none; 
     }
}

دوسرا طریقہ یہ ہے کہ آپ اپنے بچوں کے تھیم میں ایک مخصوص اسٹائل شیٹ شامل کریں جو پرنٹ کے اختیارات کی وضاحت کرے۔ یہ کیسے ہے:

  1. نامی اپنی تھیم ڈائرکٹری میں اضافی اسٹائل شیٹ اپ لوڈ کریں پرنٹ سی ایس ایس.
  2. اپنی اسٹائل شیٹ میں ایک حوالہ شامل کریں functions.php فائل آپ اس بات کو یقینی بنانا چاہیں گے کہ آپ کی پرنٹ۔ میں نے اس لوڈنگ پر 100 کی ترجیح بھی رکھی ہے تاکہ پلگ ان کے بعد یہ بوجھ آجائے یہاں میرا حوالہ ایسا لگتا ہے:

function theme_enqueue_styles() {
    global $wp_version;
    wp_enqueue_style( 'parent-style', get_template_directory_uri() . '/style.css' );
    wp_enqueue_style( 'child-style', get_stylesheet_directory_uri() . '/style.css', array('parent-style') );
    wp_enqueue_style( 'child-style-print', get_stylesheet_directory_uri() . '/print.css', array(), $wp_version, 'print' );
}
add_action( 'wp_enqueue_scripts', 'theme_enqueue_styles' , 100);

اب آپ پرنٹ سی ایس ایس فائل کو اپنی مرضی کے مطابق کرسکتے ہیں اور ان تمام عناصر کو تبدیل کرسکتے ہیں جن کو آپ پوشیدہ یا مختلف طریقے سے ظاہر کرنا چاہتے ہیں۔ اپنی سائٹ میں ، مثال کے طور پر ، میں تمام نیویگیشن ، ہیڈرز ، سائڈبارز اور فوٹر چھپاتا ہوں تاکہ صرف وہی مواد چھپی ہو جو میں ظاہر کرنا چاہتا ہوں۔

My پرنٹ سی ایس ایس فائل ایسی نظر آتی ہے۔ نوٹ کریں کہ میں نے مارجن بھی شامل کیا ہے ، ایک ایسا طریقہ جس کو جدید براؤزرز نے قبول کرلیا ہے۔

header, 
nav, 
aside { 
    display: none; 
}
#primary { 
    width: 100% !important 
}
.hidden-print, 
.google-auto-placed, 
.widget_eu_cookie_law_widget { 
    display: none; 
}

پرنٹ ویو کس طرح لگتا ہے

اگر Google Chrome سے طباعت شدہ ہے تو یہاں میرا پرنٹ نظارہ کس طرح لگتا ہے:

ورڈپریس پرنٹ دیکھیں

اعلی درجے کی پرنٹ اسٹائلنگ

یہ نوٹ کرنا ضروری ہے کہ تمام براؤزر برابر نہیں بنتے ہیں۔ آپ ہر براؤزر کو یہ جانچنے کے لئے جانچ سکتے ہیں کہ آپ کا صفحہ ان کے اوپر کیسے دکھتا ہے۔ یہاں تک کہ کچھ مواد کو شامل کرنے ، حاشیے اور صفحہ کے سائز کو مقرر کرنے کے ساتھ ساتھ متعدد دوسرے عناصر کی مدد کے لئے کچھ جدید صفحات کی خصوصیات کی بھی حمایت کرتے ہیں۔ توڑ رسالہ ایک بہت ہے ان جدید پرنٹ کے بارے میں تفصیلی مضمون اختیارات.

یہاں صفحے کی کچھ تفصیلات ہیں جو میں نے نیچے بائیں طرف کاپی رائٹ کا تذکرہ ، نیچے دائیں جانب ایک صفحہ کاؤنٹر ، اور ہر صفحے کے سب سے اوپر بائیں طرف دستاویز کا عنوان شامل کرنے کے لئے شامل کی ہیں۔

@page { 
    size: 5.5in 8.5in;
    margin: 0.5in; 
}
@page:right{ 
  @bottom-left {
    margin: 10pt 0 30pt 0;
    border-top: .25pt solid #666;
    content: "©  " attr(data-date) " DK New Media, LLC. All Rights Reserved.";
    font-size: 9pt;
    color: #333;
  }

  @bottom-right { 
    margin: 10pt 0 30pt 0;
    border-top: .25pt solid #666;
    content: counter(page);
    font-size: 9pt;
  }

  @top-right {
    content:  string(doctitle);
    margin: 30pt 0 10pt 0;
    font-size: 9pt;
    color: #333;
  }
}

۰ تبصرے

  1. 1
  2. 2

آپ کا کیا خیال ہے؟

سپیم کو کم کرنے کے لئے یہ سائٹ اکزمیت کا استعمال کرتا ہے. جانیں کہ آپ کا تبصرہ کس طرح عملدرآمد ہے.