PhpThumbOf का उपयोग करके छवियों के साथ काम करना

phpThumbOf लोकप्रिय phpThumb स्क्रिप्ट के आधार पर MODx के लिए एक ऐडऑन है। यह आपको मक्खी पर विभिन्न ग्राफिक पुस्तकालयों का उपयोग करके छवियों को संशोधित करने की अनुमति देता है।

मैं भंडार से ऐडऑन को स्थापित करने की प्रक्रिया का वर्णन नहीं करूंगा। हम मान लेंगे कि आपने इसे पहले ही डाउनलोड कर लिया है और इसे इंस्टॉल कर लिया है।

पोस्ट लिखने का कारण यह था कि आधिकारिक phpThumbOf प्रलेखन केवल भयानक है। मानस को पढ़ने के बाद, मैंने सोचा कि एकमात्र फ़ंक्शन जिसका उपयोग छवि को संशोधित करने के लिए किया जा सकता है जब यह प्रदर्शित होता है कि यह एक ज़ूम फसल (ज़ूम-क्रॉप) है, क्योंकि वहां कुछ और नहीं कहा जाता है। लेकिन बाद में, कुछ अन्य phpThumb विकल्पों का उपयोग करने की कोशिश करने के बाद, मुझे पता चला कि वे बहुत अच्छे हैं!

PhpThumbOf एनाटॉमी - आउटपुट फ़िल्टर

MODx आउटपुट फ़िल्टर आपको पृष्ठ पर प्रदर्शित होने से पहले फ़िल्टर के किसी भी सेट के माध्यम से एक तत्व के मूल्य को चलाने की अनुमति देता है। सिंटैक्स निम्नानुसार है:

[[तत्व: संशोधक = `मान`]]

PhpThumbOf का उपयोग करने का पहला और सबसे सही तरीका बिल्कुल आउटपुट फ़िल्टर है , जिसे "छवि" प्रकार के टीवी पैरामीटर में जोड़ा जाता है।

बस कहानी को पूरा करने के लिए, मैं दिखाऊंगा कि इस तरह के टीवी पैरामीटर को टेम्पलेट में कैसे जोड़ा जाए।

आरंभ करने के लिए, एक नया टीवी पैरामीटर बनाएं और इसे फिट होने के रूप में नाम दें। मेरा विकल्प:


अगला, "इनपुट प्रकार" टैब में, "छवि" चुनें:


हमारे लिए वह सब कुछ है जो टीवी पैरामीटर को सेट करने के तरीके को इंगित करने के लिए है - एसआरसी सेट करें।

प्रयोगों के लिए, हम कुछ दिलचस्प तस्वीर चुनेंगे। मैंने खुद को यह पाया:


अब, जब हमने कुछ संसाधन में चुने गए पर्दे को अतिरिक्त पैरामीटर के मान के रूप में इंगित किया जो हमने बनाया था, तो यह निर्माण का उपयोग करते हुए संसाधन की सामग्री में प्रदर्शित किया जा सकता है:

<img src = "[[* tvImage]]" />

जैसा कि मैंने लेख की शुरुआत में उल्लेख किया है, आउटपुट फ़िल्टर पृष्ठ पर आने से पहले तत्व को संशोधित करता है। हम अपने टीवी पैरामीटर का मान phpThumbOf आउटपुट फ़िल्टर से पास करते हैं:

[[* tvImage : phpthumbof = `w = 120 & h = 120` ]]

  टिप्पणी: यदि हम टेम्प्लेट या चंक में टीवी पैरामीटर प्रदर्शित करते हैं, तो तारांकन "*" को प्लस "+" द्वारा प्रतिस्थापित किया जाना चाहिए: [[+ tvImage: phpthumbof = `w = 120 & h = 120'`] 

नतीजतन, हमें उस छवि के आधार पर एक नई उत्पन्न छवि मिलती है जिसे हमने संसाधन के लिए चुना था, लेकिन इसे 120x120 पिक्सेल तक बढ़ाया गया। लेकिन जैसा कि आपने देखा होगा, छवि सफेद क्षेत्रों में दिखाई दी जो मूल छवि के अनुपात के उल्लंघन के कारण उत्पन्न हुई।


इससे बहुत आसानी से बचा जा सकता है, बस चौड़ाई या ऊँचाई निर्दिष्ट न करें। आइए केवल एक निश्चित चौड़ाई छोड़ें:

[[+ tvImage: phpthumbof = `w = 120`]]

अब परिणामी छवि को केवल निर्दिष्ट चौड़ाई से बढ़ाया जाता है, ऊंचाई मूल पहलू अनुपात के अनुपात में होगी।


जैसा कि आप देख सकते हैं, छवियों को आकार देने की संभावनाएं असीम रूप से लचीली हैं। यहां 270 पिक्सेल की चौड़ाई के साथ एक और उदाहरण दिया गया है। इसके अलावा, आप मूल छवि से अधिक प्राप्त कर सकते हैं, लेकिन यह एक शातिर अभ्यास है;)।

[[* tvImage: phpthumbof = ` w = 270`]]

सटीक छवि फसल

अगर हम एक चित्र को 120 के हिसाब से 120 पिक्सल के साथ प्राप्त करना चाहते हैं, तो हम इसे क्रॉप कर सकते हैं। ऐसा करने के लिए, फसल विकल्प (ज़ूम-क्रॉप) &zc=1.

[[* tvImage: phpthumbof = `w = 120 & h = 120 & zc = 1`]]

अब हमारे पास सटीक आयामों के साथ और सफेद मार्जिन के बिना हमारी छवि का एक फसली संस्करण है।

PhpThumb फ़िल्टर - मज़ा बस शुरुआत है

अब जब आप छवि आकार को नियंत्रित करना जानते हैं, तो मैं आपको phpThumb फ़िल्टर की वास्तविक शक्ति दिखाऊंगा। मैं phpThumb में उपलब्ध फ़िल्टरों के कुछ उदाहरण दूंगा। ध्यान दें कि मैं पिछले उदाहरणों के अंत में सभी नए फ़िल्टर जोड़ता हूं। इसके अलावा, उनकी स्थिति मायने रखती है! फिल्टर बाएं से दाएं से लगाए जाते हैं।

धुंधला (कलंक)

[[* tvImage: phpthumbof = `w = 120 & h = 120 & zc = 1 & fltr [] = blur | 10` ] |

ग्रेस्केल (ग्रेस्केल में पट्टियाँ बदलना)

[[* tvImage: phpthumbof = `w = 120 & h = 120 & zc = 1 & fltr [] = ग्रे` ]]

गोल कोनों

[[* tvImage: phpthumbof = `w = 120 & h = 120 & zc = 1 & fltr [] = ric | 20 | 20` ]]

कृपया ध्यान दें कि छवि में उन स्थानों पर सफेद कोने हैं जहां छवि "गोल" है। परिणामी छवि को पीएनजी प्रारूप में परिवर्तित करके हम इस समस्या को दूर कर सकते हैं।

[[* tvImage: phpthumbof = `w = १२० & h = १२० & zc = १ & f = png & fltr [] = ric | २० | २०`]]

ढांचा

समय-समय पर, छवि में एक फ्रेम जोड़ना आवश्यक हो जाता है। बेशक, यह सीएसएस का उपयोग करके किया जा सकता है। लेकिन कभी-कभी ऐसे समय होते हैं जब सीएसएस बेकार होता है। मैं आपको एक ऐसा उदाहरण दिखाना चाहता हूं।

[[* tvImage: phpthumbof = `w = १२० & h = १२० & zc = १ & f = png & fltr [] = bord | ५ | ० | ० | FFFFFF & fltr [] - Rot -15। E4F6FE` ]]

छवि रोटेशन

रोटेशन के लिए थोड़ा स्पष्टीकरण की आवश्यकता होती है। आपको कोनों में गैर-ग्राफिक क्षेत्रों के लिए पृष्ठभूमि का रंग निर्दिष्ट करना होगा। इस उदाहरण में, हम # 006699, रोटेशन -45 ° का उपयोग करते हैं।

[[* tvImage: phpthumbof = `w = १२० & h = १२० & zc = १ & fltr [] = rot | -45 | 006699` ]

यदि आप JPG = कलाकृतियों की संख्या कम करना चाहते हैं, तो आप छवि गुणवत्ता (1-100) बढ़ा सकते हैं:

[[* tvImage: phpthumbof = `w = १२० & h = १२० & zc = १ & fltr [] = रोट | -45 | 006699 & q = 100`] |

यदि आप एक पारदर्शी पृष्ठभूमि चाहते हैं, तो आउटपुट को PNG में बदलें, जैसा कि हमने पहले किया था:

[[* tvImage: phpthumbof = `w = 120 & h = 120 & zc = 1 & fltr [] = rot | -45 | & f = png `]

रंग ओवरले

यह फ़िल्टर आपको छवि पर कोई भी हेक्स रंग लगाने की अनुमति देता है। पहला मान प्रतिशत है, दूसरा हेक्साडेसिमल प्रारूप में रंग है।

[[* tvImage: phpthumbof = `w = १२० & h = १२० & zc = १ & fltr [] = clr | ३५ | ९९ ००३३ ]]

यदि आप दो-रंग की छवि प्राप्त करना चाहते हैं, तो आपको पहले छवि को डिस्कनेक्ट करने के लिए एक ग्रेस्केल फ़िल्टर लागू करना होगा।

[[* tvImage: phpthumbof = `w = १२० & h = १२० & zc = १ & fltr [] = ग्रे और फ्ल्ट [] = clr | ३५ | ९९ ००३३]]

सरल पाठ वॉटरमार्क।

PhpThumb के साथ आप छवि पर पाठ और छवि वॉटरमार्क ओवरले कर सकते हैं। टेक्स्ट वॉटरमार्क के मामले में, आप आकार, स्थिति, पारदर्शिता और TTF फ़ॉन्ट निर्दिष्ट कर सकते हैं।

सामान्य तौर पर, बहुत सारे उपलब्ध हैं। मेरा सुझाव है कि आप अपने आप को दस्तावेज के साथ परिचित करें।

यहाँ एक साधारण वॉटरमार्क एक मानक सर्वर फ़ॉन्ट पर आधारित है:

[[* tvImage: phpthumbof = `w = १२० & h = १२० & zc = १ & fltr [] = ग्रे और फ्लोर्ट [] = wmt | बेलाफोंटे कोड | ३ | T | FFFPF: १०० | २० | ० | २० | ० | `]]

फिनिश लाइन

शायद यही सब मैं बात करना चाहता था। आप प्रोजेक्ट के आधिकारिक पृष्ठ पर phpThumb का उपयोग करने के अधिक उदाहरण पा सकते हैं।

PS मैं ब्लॉग में "MODx CMS" प्रकाशित करना चाहता था, लेकिन हमेशा की तरह हब पर, पर्याप्त कर्म नहीं था।
PSS "MODx CMS" में चला गया