वेब ब्राउज़र में WYSIWYP (आप जो देखते हैं उसे कैसे प्रिंट करें) प्राप्त करें?


70

जब मैं अपने ब्राउज़र से एक वेब पेज प्रिंट करता हूं, तो मुझे कागज पर उस सामग्री के प्राप्त होने की उम्मीद होती है जो मैं ब्राउज़र में देख रहा हूं। सटीक होने के लिए: मुझे उम्मीद है कि ब्राउज़र एक ही पृष्ठ की सामग्री को उसी तरह से रेंडर करेगा, जिसमें अनंत ऊंचाई के साथ एक कैनवास को छोड़कर, और फिर मुद्रण-विशिष्ट तरीके से यह निर्णय लिया जाए कि परिणाम को कागज के भौतिक पृष्ठों में कैसे वितरित किया जाए।

हालाँकि, यह बिल्कुल नहीं है कि कई वेबसाइटों पर क्या हो रहा है। वे कुछ अलग तरह से छाप सकते हैं। मैंने ऐसा करने के लिए ब्राउज़र कभी नहीं पूछा और मैं नहीं चाहता कि ऐसा हो।

वहाँ एक तरीका है जो मैं चाहता हूँ (स्क्रीनशॉट लेने के अलावा, श्रमसाध्य रूप से काटने और उन्हें एक साथ चिपकाने, और परिणामस्वरूप छवियों को मुद्रित करना है)? क्या मेरे द्वारा उपयोग किए जाने वाले वेब ब्राउज़र (फ़ायरफ़ॉक्स, क्रोम, सफारी, IE, या ओपेरा) को बताने का कोई तरीका है: "इस पृष्ठ को प्रिंट करें क्योंकि आप इसे मनमाने ढंग से उच्च ब्राउज़र विंडो पर प्रस्तुत करेंगे"?

(पुनश्च: यह भी देखें: स्क्रीन सीएसएस का उपयोग करके ब्राउज़र से प्रिंट करें ?)



Chrome एक्सटेंशन "निंबस स्क्रीन कैप्चर ऐप" पूरे वेब पेज की एक छवि ले सकता है क्योंकि यह स्क्रीन पर दिखाया गया है (उस भाग को जिसमें आप स्क्रॉल किए बिना नहीं देख सकते हैं)। यानी यह ऐसा है जैसे आपने स्क्रीनशॉट्स की एक श्रृंखला ली है और उन्हें एक साथ सिले किया है, लेकिन यह केवल एक बटन-क्लिक है।
AE

1
प्रिंट स्टाइलशीट मौलिक रूप से उपयोगी हैं। जब मैं इस पृष्ठ को उदाहरण के लिए प्रिंट करता हूं, तो क्या मुझे प्रश्न और उत्तर चाहिए या क्या मुझे शीर्षक, संबंधित प्रश्न और पाद लेख भी चाहिए? मैं भी सराहना करता हूं कि सभी टिप्पणियां दिखाई दे रही हैं। वेबसाइट इंटरैक्टिव हैं, कागज के टुकड़े (अधिकतर समय) नहीं होते हैं, और वे स्टाइलशीट सामग्री पर ध्यान केंद्रित करने में मदद कर सकते हैं, जिससे आप स्याही और कागज की बचत कर सकते हैं।
SBoss 15

1
@SBoss: एक पेज प्रिंट करने वाले सभी लोगों को समान चीजों में दिलचस्पी नहीं होगी। मेरा सुझाव है कि एक प्रिंट-फ्रेंडली पेज को एक उपयोगकर्ता को यह चुनने देना चाहिए कि किन चीजों को प्रिंट किया जाना चाहिए, और प्रिंट संस्करण को स्क्रीन संस्करण के अलावा मैच करना चाहिए - आमतौर पर - उन नियंत्रणों के लिए जो दिखाते हैं कि क्या प्रिंट होगा (एक विकल्प होना चाहिए) प्रिंटआउट में उन्हें सक्षम और अक्षम करें, लेकिन उन्हें आम तौर पर स्क्रीन पर वैसे भी दिखाई देना चाहिए)।
सुपरकैट

1
जैसा कि एक डुप्लिकेट होने के सवाल के रूप में: मैंने छपाई से पहले प्रिंट स्टाइलशीट को अलग करने की कोशिश की , और यह काम नहीं करता है, इसलिए मुझे नहीं लगता कि सवाल डुप्लिकेट है।
रिस्टोरियरपोस्ट 22

जवाबों:


37

Chrome में यह सुविधा डेवलपर टूल में निर्मित है, लेकिन बहुत ही गैर-स्पष्ट स्थान पर है।

  • डेवलपर टूल खोलें (Windows: F12या Ctrl+ Shift+ I, Mac: Cmd+ Opt+ I)
  • क्लिक करें अनुकूलित और नियंत्रण DevTools हैमबर्गर मेनू बटन और चुनें प्रतिपादन सेटिंग्स अधिक टूल> (या प्रतिपादन नए संस्करण में)।
  • रेंडरिंग टैब पर इम्यूलेट प्रिंट मीडिया चेकबॉक्स की जांच करें और स्क्रीन मीडिया प्रकार का चयन करें ।

ज्यादातर इस जवाब से उद्धृत । अंतर के लिए नीचे देखें।

अब जब आप प्रिंट करते हैं, तो प्रिंट आउट वही होगा जो आप देखते हैं। जब तक आप प्रिंट न करें तब तक डेवलपर टूल्स को खुला रखना सुनिश्चित करें। एक बार जब आप डेवलपर टूल को बंद कर देंगे तो रेंडरिंग सेटिंग वापस सामान्य पर रीसेट हो जाएगी।

नोट: इस उत्तर के लिए प्रेरणा https://superuser.com/a/568847/176146 से आई । लेकिन इस उत्तर का वास्तविक पाठ lmeurs के उत्तर से है । यह लगभग समान है, लेकिन हम उनके उत्तर के ठीक विपरीत करने की कोशिश कर रहे हैं, इसलिए इसे प्रिंट करने के लिए ओवरराइड सेट करने के बजाय स्क्रीन पर सेट किया गया है ।


फ़ायरफ़ॉक्स ने यह सुविधा पिछले वर्ष में भी प्राप्त की है। यह स्पष्ट रूप से बेहतर है, लेकिन क्या मुझे उस कारण से एक पुराने उत्तर को स्वीकार करना चाहिए?
रीइनियरिएपोस्ट

@reinierpost यह निश्चित रूप से आप पर निर्भर है। लेकिन निम्नलिखित आपके निर्णय में सहायक हो सकते हैं - meta.stackexchange.com/q/93969/226780
बेंजामिन

धन्यवाद; उन जवाबों में कहा गया है कि मुझे बदलना चाहिए, इसलिए मैं पहले ही स्वीकार किए गए उत्तर को लगता है कि यह उस समय लिखा गया सबसे उपयोगी उत्तर हो सकता है।
रीयरियरपोस्ट

अभी, जब मैं क्रोम में यह कोशिश करता हूं, तो मैं केवल विकल्प देखता हूं जब वह मोबाइल व्यू मोड में होता है; मैं इसे पृष्ठ के नियमित डेस्कटॉप दृश्य के लिए प्राप्त नहीं कर सकता।
रिस्टोरियरपोस्ट

फ़ायरफ़ॉक्स में यह क्षमता भी है, लेकिन एक अलग तरीके से। मुझे लगता है कि दस्तावेज़ के लिए एक अलग उत्तर की आवश्यकता है। मुझे अन्य ब्राउज़रों के बारे में निश्चित नहीं है।
रीयरियरपोस्ट

22

मेरे ब्राउज़र में मेरे वेबपेजों को क्यों नहीं प्रिंट किया जाता है?

आपके कुछ वेब पेज अलग-अलग तरीके से प्रिंट हो रहे हैं इसका कारण यह है कि उनके पास प्रिंट स्टाइलशीट है


Print Stylesheet क्या है?

एक प्रिंट स्टाइलशीट एक वेब पेज को प्रारूपित करती है, इसलिए मुद्रित होने पर, यह स्वचालित रूप से उपयोगकर्ता के अनुकूल प्रारूप में प्रिंट करता है। प्रिंट स्टाइलशीट कई वर्षों से आसपास हैं और बहुत कुछ लिखा गया है। फिर भी कुछ वेबसाइटें उन्हें लागू करती हैं, जिसका अर्थ है कि हम उन वेब पेजों से बचे हुए हैं, जो निराशाजनक रूप से कागज पर ठीक से मुद्रित नहीं होते हैं।

यह उल्लेखनीय है कि कुछ वेबसाइटें प्रिंट स्टाइलशीट का उपयोग करती हैं:

  • प्रिंट शैलियाँ बहुत अधिक उपयोग की सामग्री वाले पृष्ठों के लिए विशेष रूप से प्रयोज्य में सुधार करती हैं (जैसे कि यह एक!)
  • वे अभूतपूर्व त्वरित और स्थापित करने में आसान हैं

कुछ वेबसाइटें पेज के एक प्रिंट-फ्रेंडली संस्करण के लिए एक लिंक प्रदान करती हैं, लेकिन निश्चित रूप से इसे स्थापित करने और बनाए रखने की आवश्यकता होती है। इसके लिए यह भी आवश्यक है कि उपयोगकर्ता इस लिंक को स्क्रीन पर देखें, और फिर इसे नियमित रूप से प्रिंट पेज (जैसे कि स्क्रीन के शीर्ष पर प्रिंट बटन का चयन करके) के आगे उपयोग करें। प्रिंट-फ्रेंडली संस्करण हालांकि एक ही समय में कई वेब पेज को प्रिंट करते समय उपयोगी होते हैं जैसे कि एक लेख जो कई वेब पेजों पर फैलता है।

किसी वेबसाइट को प्रिंट करते समय स्रोत मुद्रण शैलियाँ (सीएसएस) को अक्षम करें


मैं एक प्रिंट स्टाइलशीट को कैसे अक्षम कर सकता हूं?

मुझे हाल ही में एक वेबसाइट का स्नैपशॉट प्राप्त करने की आवश्यकता है, जैसा कि मेरी स्क्रीन पर दिखाया गया है। यही है, मुझे पृष्ठभूमि का रंग चाहिए था, मुझे विज्ञापन चाहिए थे, मुझे पूरा लेआउट चाहिए था।

एक विकल्प यह है कि अनुक्रमिक स्क्रीनशॉट लेने के लिए जैसे ही आप पृष्ठ को नीचे स्क्रॉल करते हैं, फिर उन्हें फ़ोटोशॉप में एक साथ वापस कर दें। यह समय लेने वाली है और आपको कम-रिज़ॉल्यूशन (72 डीपीआई) वाली छवि के साथ छोड़ती है।

ऐसा करने का एक अन्य तरीका पृष्ठ को प्रिंट करना है, फिर वास्तव में मुद्रण के बजाय एक पीडीएफ के रूप में "सहेजें"। यह उन पृष्ठों के लिए बहुत अच्छी तरह से काम करता है जो पृष्ठ को देखने के लिए पृष्ठ को देखने के लिए एक अलग लेआउट को परिभाषित नहीं करते हैं।

दुर्भाग्य से मेरे लिए, एक वेबसाइट पर "प्रिंट" स्टाइलशीट को शामिल करना तेजी से लोकप्रिय हो गया है, जो एक उपयोगकर्ता द्वारा वेबसाइट को प्रिंट करने की कोशिश करने पर नए पृष्ठ शैलियों को परिभाषित करता है। यह हेडर में परिभाषित किया गया है और कुछ इस तरह दिखता है:

मुझे केवल एक ही विकल्प मिला है जो वास्तव में मेरी आवश्यकताओं को संबोधित करता है: क्रिस पेडरिक द्वारा विकसित "वेब डेवलपर" ऐड-ऑन / एक्सटेंशन।

इस प्लगइन के साथ आप बहुत आसानी से सभी शैलियों, डिफ़ॉल्ट शैलियों, इनलाइन शैलियों, एम्बेडेड शैलियों को अक्षम कर सकते हैं, और, आपने अनुमान लगाया, प्रिंट शैलियों!

यह वर्तमान में फ़ायरफ़ॉक्स और क्रोम के लिए उपलब्ध है। मुझे वास्तव में उम्मीद है कि एक सफारी एक्सटेंशन किसी दिन आएगा, क्योंकि मैं मुख्य रूप से सफारी का उपयोग करता हूं। एकमात्र विकल्प जो मैंने सफारी के लिए पाया है, वह सभी शैलियों को अक्षम करना है - एक ऐसी सुविधा जो ब्राउज़र के नवीनतम संस्करण (5.0.3) के साथ डिफ़ॉल्ट रूप से आती है। यह देखने के लिए विकास के दौरान उपयोगी है कि आपकी साइट को केवल-पाठ ब्राउज़र पर कैसे देखा जाएगा, लेकिन यह चुनने की क्षमता के बिना कि आप किस शैली को अक्षम कर रहे हैं, इसकी सीमित उपयोगिता है।

फ़ायरफ़ॉक्स में उपरोक्त एक्सटेंशन के साथ प्रिंट शैलियों को अक्षम करने का एक उदाहरण है:

यहाँ छवि विवरण दर्ज करें

स्रोत प्रिंट स्टाइलशीट - निश्चित गाइड


2
धन्यवाद, लेकिन यह उस वेबसाइट के लिए मदद नहीं करता है जिसे मैंने इसे (trelloprinter.com) पर आज़माया था। मुझे आश्चर्य है कि इन लोगों को यह लिखने की हिम्मत कैसे हुई कि "निराशा से, इसलिए कई वेबसाइटें उन्हें लागू नहीं करती हैं" जब वे समस्या को हल करने के लिए मौलिक रूप से टूट जाते हैं, तो वे हल करने की कोशिश कर रहे हैं। मुद्रण के लिए अलग-अलग स्टाइलशीट होने का मतलब है कि आपने उपयोगकर्ता इंटरफ़ेस डिज़ाइन 101 को विफल कर दिया है, या इसे पहले कभी नहीं लिया है।
रीवरियरपोस्ट

1
शायद ScreenshotCaptor वही करेगा जो आपको प्राप्त करने की आवश्यकता है ... अन्य चीजों के बीच यह स्क्रॉलिंग क्षेत्रों पर कब्जा करेगा ... लेकिन मुझे याद है कि यह Google मैप्स के साथ बहुत अच्छा नहीं खेलता है।
DavidPostill

1
यह ज्यादा मदद नहीं करेगा। यदि आप IE का उपयोग कर रहे हैं (मुझे पता है, बाद के लिए अपनी चट्टानों को बचाएं), तो आप Greenshot ( getgreenshot.org ) का उपयोग कर सकते हैं, जिसमें IE पेज को स्क्रॉल करने और इसके प्रिंट करने का विकल्प है। यह पूरे पृष्ठ को 1 स्क्रीनशॉट में इकट्ठा करेगा। फिर आप इसे अपने दिल की इच्छा के लिए संपादित कर सकते हैं।
इस्माइल मिगुएल

18
@reinierpost "मुद्रण के लिए अलग स्टाइलशीट होने का मतलब है कि आप उपयोगकर्ता इंटरफ़ेस डिज़ाइन 101 में विफल रहे हैं" - यह एक भयानक रूप से विस्तृत ब्रश है जो आप वहां से पेंटिंग कर रहे हैं। क्या आप मुझे बता रहे हैं कि यदि आपने इस पृष्ठ का प्रिंट आउट लिया है, तो आप चाहते हैं कि हॉट नेटवर्क प्रश्न पक्ष में हों, या चैट रूम के बारे में जानकारी हो? किसी पृष्ठ के कुछ भाग केवल एक संवादात्मक संदर्भ में उपयोगी होते हैं - क्यों अंतरिक्ष और स्याही उन्हें मुद्रित करते हैं?
क्रिस हेस

4
@reinierpost क्या हास्यास्पद बयान है। मान लीजिए कि किसी साइट में हल्के अग्रभूमि के साथ एक अंधेरे पृष्ठभूमि है। मैं आपके लिए नहीं बोलूंगा, लेकिन मैं व्यक्तिगत रूप से खुश हूं कि ब्राउज़र की अपनी प्रिंट शैली के साथ-साथ कई साइटें भी हैं, ताकि मैं प्रिंट करते समय अपनी सारी स्याही बर्बाद न करूं। ऐसे कई कारण हैं कि आप सामग्री को स्वयं प्रिंट करना चाहते हैं, और स्क्रीनशॉट नहीं।
ब्रैड

9

फ़ायरफ़ॉक्स के लिए कोई प्लग-इन समाधान नहीं: डिफ़ॉल्ट डेवलपर टूल (गियर आइकन) में वेब डेवलपर टूल खोलें "पूरे पृष्ठ का स्क्रीनशॉट लें।" आपको केवल एक बार इस भाग को करने की आवश्यकता है।

फिर डेवलपर टूल्स में, कैमरा आइकन पर क्लिक करें। पूरा पृष्ठ .png के रूप में सहेजा जाएगा। यहां से आप इसे प्रिंट कर सकते हैं, पीडीएफ में बदल सकते हैं, आदि।


वाह .. वही, जो मैं ढूंढ रहा था। धन्यवाद!
रीयरियरपोस्ट

4
इस सुविधा के लिए अब डेवलपर टूल की आवश्यकता नहीं है! पता बार के दाईं ओर, तीन बिंदुओं का चयन करें, "स्क्रीनशॉट लें" पर क्लिक करें, फिर "पूर्ण पृष्ठ सहेजें" चुनें।
नंबरमानस

यह आश्चर्यजनक है, धन्यवाद!
कोडिंगजेरेमी

8

मैं Chrome एक्सटेंशन: वेबपेज स्क्रीनशॉट का उपयोग कर रहा हूं । दो क्लिक के साथ पूरा वेबपेज jpg या पीडीएफ में बदल जाता है। कोई ज़रूरत नहीं है अपने आप को एक साथ स्क्रीनशॉट को गोंद करने के लिए। यह पृष्ठ इस तरह दिखता है: वेबपेज स्क्रीनशॉट डेमो


1
यह काम भी प्रतीत होता है। मैं उम्मीद कर रहा था कि पीडीएफ मुझे स्केलेबल ग्राफिक्स देगा, लेकिन यह सिर्फ एक बिटमैप है।
रीइनियरियरपोस्ट

1
अपने जवाब को साबित करने का कितना बढ़िया तरीका! :) मैंने इसे उत्तर के रूप में स्वीकार किया होगा ..
विजय चावड़ा

अद्भुत विस्तार! यह परिदृश्य मोड में पीडीएफ बनाने के लिए लगता है। क्या पोर्ट्रेट मोड में पीडीएफ बनाना संभव है? @reinierpost
user674669

3

मैं भी इसी तरह की समस्या का सामना कर रहा था। वर्तमान में मैं Chrome के लिए Print Friendly और PDF Extenstion का उपयोग कर रहा हूं ।

सबसे अच्छी विशेषता यह है कि मैं अपने प्रिंट / पीडीएफ में उन वस्तुओं को मैन्युअल रूप से हटा सकता हूं जो मैं नहीं चाहता।


दिलचस्प ... फ़ायरफ़ॉक्स में, मैं इस उद्देश्य के लिए PrintWhatYouLike बुकमार्क का उपयोग करता हूं । यह अच्छी तरह से काम करता है, लेकिन यह "अनंत" स्क्रॉलिंग (eq Quora) को संभालता नहीं है - न तो यह विस्तार करता है।
रिस्टोरियरपोस्ट

अच्छा टिप - धन्यवाद! डिफ़ॉल्ट रूप से यह पाठ को पाठ के रूप में रखता है, लिंक के रूप में लिंक करता है और छवियों को पूर्ण आकार के रूप में दिखाता है। कई बड़े चित्रों के साथ 6 पेज का यात्रा लेख अब 500kb पर बेदाग पीडीएफ है।
माइक हनी

1

यहाँ एक और OpenScreenShoot कहा जाता है । मुझे यह पसंद है क्योंकि यह ओपन सोर्स है, जो GitHub में उपलब्ध है, और इसने मेरे लिए बहुत लंबे वेबपेज के लिए काम किया, जिस पर वेबपेजस्क्रीनशॉट जैसे अन्य विकल्प विफल रहे।


मुझे लगता है कि आपको "ओपन स्क्रीनशॉट" के बजाय "1-क्लिक वेबपेज स्क्रीनशॉट" कहने का मतलब था। सही?
user674669

1

( सॉफ़्टवेयर अनुशंसा उत्तरों के एक सेट में इसे बदलने के जोखिम पर , लेकिन अब तक, ब्राउज़र एक्सटेंशन X को स्थापित और उपयोग करना एकमात्र ऐसा उत्तर लगता है जो वास्तव में काम करता है :)

हाल ही में मैं इस उद्देश्य के लिए ओपन स्क्रीनशॉट क्रोम एक्सटेंशन का उपयोग कर रहा हूं, और मैं इससे बहुत खुश हूं। लंबे Quora पेज के साथ इसे कोई समस्या नहीं थी ।

अद्यतन (नवंबर, 2017): यह अब सबसे अच्छा विकल्प नहीं है: फ़ायरफ़ॉक्स और क्रोम अब अपने डेवलपर टूल में पूर्ण-पृष्ठ स्क्रीनशॉट लेने का समर्थन करते हैं


मुझे लगता है कि आपको "ओपन स्क्रीनशॉट" के बजाय "1-क्लिक वेबपेज स्क्रीनशॉट" कहने का मतलब था। सही?
user674669

नहीं। जाहिर है, उन्होंने अपना नाम बदल लिया। मुझे यकीन नहीं है कि इस उत्तर के साथ क्या करना है।
रीइनियरियरपोस्ट

1

आज, यह फ़ायरफ़ॉक्स में किया जा सकता है (मैं अभी 65.0.2 का उपयोग कर रहा हूँ) निम्नानुसार है:

  1. F12 दबाएं। डेवलपर टूल फलक दिखाई देगा।
  2. दाहिने ऊपरी हाथ के कोने के पास, एक कैमरा आइकन है। पूरे पृष्ठ का स्क्रीनशॉट लेने के लिए, उस पर क्लिक करें।

में सेटिंग्स , आप थोड़ा अपने व्यवहार को अनुकूलित कर सकते हैं (उपयोग करने के लिए उन्हें, तीन बिंदुओं कैमरा आइकन की दाईं के लिए क्लिक करें); डिफ़ॉल्ट रूप से, यह स्क्रीनशॉट को आपके फ़ायरफ़ॉक्स डाउनलोड फ़ोल्डर में बचाएगा।

यदि कैमरा आइकन गायब है, तो आपको पहले सेटिंग्स में इसे सक्षम करना होगा ।

फ़ायरफ़ॉक्स डेवलपर टूल में स्क्रीनशॉट टूल

हमारी साइट का प्रयोग करके, आप स्वीकार करते हैं कि आपने हमारी Cookie Policy और निजता नीति को पढ़ और समझा लिया है।
Licensed under cc by-sa 3.0 with attribution required.