📩 ☕️ 😴 हम XenForo के लिए पहला एडऑन लिख रहे हैं। MVC, टेम्प्लेट, स्टाइल, सेटिंग्स, नेविगेशन

साइरस ने मंच पर एक प्रशिक्षण एडऑन पोस्ट किया, जहां आप एक्सनफोरो के लिए ऐड-ऑन लिखने का तरीका प्रदर्शित कर सकते हैं। अब हम यही करेंगे। इस ट्रेनिंग एडऑन में कुछ त्रुटियां हैं, शायद इसलिए हम उनका पता लगाकर और उन्हें सुधार कर खुद को साबित कर सकते हैं। हम शुरुआत से ही एक ही ऐड-ऑन बनाएंगे और साइरस को जो मिला उसे थोड़ा सुधारने / ठीक करने की अनुमति देंगे।

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

सबसे पहले, आपको फोरम को डिबग मोड में डालने की आवश्यकता है। यह फ़ाइल /library/config.php में एक पंक्ति जोड़कर किया जा सकता है

$config['debug'] = true;

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

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

सहेजने के बाद, आप सेटिंग्स के इस समूह में खुद को पाएंगे। प्रारंभ में, यह खाली है और हमें यहां एक सेटिंग बनाने की आवश्यकता है। "विकल्प जोड़ें" पर क्लिक करें। विकल्प नाम के लिए, LikeReviewRusMaxToDisplay दर्ज करें। एक ऐड-ऑन चुनें, एक शीर्षक और व्याख्यात्मक पाठ के साथ आएं। हमें केवल पूर्णांक दर्ज करने की आवश्यकता है, इसलिए, प्रारूप के रूप में हमें "तीर के साथ संख्या इनपुट फ़ील्ड" का चयन करने की आवश्यकता है। आप प्रारूप पैरामीटर निर्दिष्ट कर सकते हैं

 min=1 step=5 max=100

इसका मतलब है कि न्यूनतम सेटिंग मान 1 है, जब भी आप तीर दबाते हैं, तो 5 को जोड़ा / घटाया जाएगा, और आपके द्वारा दर्ज की जाने वाली अधिकतम संख्या 100 हो जाएगी। डेटा प्रकार को "अनइंस्टॉल पूर्णांक" होने दें। डिफ़ॉल्ट मान 30 है। अभी के लिए, बाकी सेटिंग को छोड़ दें। सहेजें। आप तुरंत जांच कर सकते हैं कि आपने क्या किया है।

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

अब हमें कुछ वाक्यांश बनाने की आवश्यकता है ताकि एडोन को अन्य भाषाओं में अनुवाद किया जा सके। प्रकटन पृष्ठ पर वाक्यांश लिंक पर क्लिक करें। विवरण के रूप में नीचे प्रदर्शित करने के लिए LikeReviewRus_Header (पृष्ठ के शीर्ष पर प्रदर्शित करने के लिए) और LikeReviewRus_Description शीर्षक के साथ वाक्यांश बनाएं। इस अंतिम वाक्यांश के पाठ के लिए, "यह {numPosts} उपयोगकर्ता की पसंदीदा पोस्ट है।" नीचे आप देखेंगे कि {numPosts} के बजाय टेम्प्लेट में एक मात्रा कैसे डाली जाएगी।

अब हमें उस पृष्ठ के लिए एक टेम्पलेट बनाने की आवश्यकता है जिसे हम प्रदर्शित करेंगे। Appearance टैब पर टेम्प्लेट सेक्शन पर क्लिक करें। अब एक नया टेम्पलेट बनाएं। टेम्प्लेट नाम के लिए, likereviewrus.css निर्दिष्ट करें और निम्नलिखित सामग्री को चिपकाएँ।

 .mostLikedPosts { } .mostLikedPosts .avatar { float: left; margin-right: 10px; } .mostLikedPosts .avatar img { width: 64px; height: 64px; border: 3px solid {xen:property LikeReviewRusAvatarBorder}; } .mostLikedPosts .likedPost { position: relative; } .mostLikedPosts .primaryContent { padding: 0; padding-top: 10px; } .mostLikedPosts h3 { font-size: 12pt; margin-bottom: 5px; } .mostLikedPosts .likes { display: block; position: absolute; right: 0px; top: 10px; width: 24px; height: 24px; line-height: 24px; text-align: center; border-radius: 13px; font-weight: bold; background: {xen:property primaryLighterStill}; border: 1px solid {xen:property primaryLighter}; } .mostLikedPosts .likes:hover { background-color: {xen:property secondaryLightest}; border-color: {xen:property secondaryLighter}; color: {xen:property secondaryDark}; text-decoration: none; box-shadow: 0 0 10px {xen:property secondaryMedium}; } .mostLikedPosts .meta { font-size: 11px; padding-top: 5px; padding-bottom: 5px; margin-left: 80px; margin-bottom: -1px; margin-top: 10px; border: 1px solid {xen:property primaryLighterStill}; border-right: none; border-top-left-radius: 10px; } .mostLikedPosts .meta dd { margin-right: 10px; } .mostLikedPosts .meta dd strong { font-weight: bold; }

एक ऐड-ऑन चुनें, सहेजें और बाहर निकलें। हमने सीएसएस शैलियों की एक सूची भर दी है जिसका उपयोग हम सिर्फ खाके में करेंगे। टैग {xen: property} उन स्थानों को दर्शाते हैं जहां मुख्य शैली सेटिंग्स से डेटा डाला जाएगा (उन्हें खोजें, वैसे)। कृपया ध्यान दें कि हमने वहाँ एक शैली सेटिंग भी डाली है जो हमने खुद बनाई है, लेखक की गलती को सुधारना (थोड़ा और बेस्वाद) भी।

अब एक और टेम्प्लेट बनाएं और इसे nameereviewrus_index नाम दें। इसमें निम्नलिखित सामग्री डालें:

 <xen:title>{xen:phrase LikeReviewRus_Header}</xen:title> <xen:navigation> <xen:breadcrumb href="{xen:link likes-review}">{xen:phrase LikeReviewRus_Header}</xen:breadcrumb> </xen:navigation> <xen:require css="likereviewrus.css" /> <div class="sectionMain mostLikedPosts"> <h2 class="subHeading">{xen:phrase LikeReviewRus_Description, 'numPosts={xen:count $likedPosts}'}</h2> <ol> <xen:foreach loop="$likedPosts" value="$post"> <li class="likedPost"> <div class="primaryContent"> <xen:avatar user="$post" size="m" img="true" /> <h3><a href="{xen:link posts, $post}">{$post.title}</a></h3> <div class="muted">{xen:helper wordTrim, $post.message, 140}</div> <a href="{xen:link posts/likes, $post}" class="likes OverlayTrigger"><strong>{xen:number $post.likes}</strong></a> <dl class="secondaryContent pairsInline meta"> <dt>{xen:phrase posted_by}</dt> <dd><a href="{xen:link members, $post}" class="username">{$post.username}</a></dd> <dt>{xen:phrase date}</dt> <dd><xen:datetime time="$post.post_date" /></dd> <dt>{xen:phrase likes}</dt> <dd><a href="{xen:link posts/likes, $post}" class="OverlayTrigger">{xen:number $post.likes}</a></dd> </dl> </div> </li> </xen:foreach> </ol> <div class="sectionFooter">{xen:phrase showing_x_posts, 'numPosts={xen:count $likedPosts}'}</div> </div>

अब हम उन सभी टैग को देखते हैं जो हम यहां मिले थे।

<xen: title> - टैग पृष्ठ शीर्षक को इंगित करता है।
<xen: आवश्यकता> - निर्दिष्ट सीएसएस फ़ाइल को आरोहित करता है
<xen: नेविगेशन> और <xen: ब्रेडक्रंब> - निर्धारित करें कि नेविगेशन श्रृंखला के रूप में क्या दिखाया जाएगा। इस मामले में, यह सिर्फ एक लिंक है। हम अब तक यहां अधिक जटिल विकल्पों पर विचार नहीं करेंगे।
{xen: link} - फोरम रूटिंग के नियमों के अनुसार पैरामीटर (पसंद-समीक्षा) का उपयोग करके एक URL बनाता है। थोड़ा रूटिंग के बारे में बाद में।
{xen: वाक्यांश} केवल उस भाषा में वाक्यांश मान सम्मिलित करता है जिसे उपयोगकर्ता ने अपनी सेटिंग में निर्दिष्ट किया है। यदि इस भाषा में वाक्यांश के लिए कोई अनुवाद नहीं है, तो मुख्य भाषा में मूल संस्करण प्रदर्शित किया जाएगा। एकल उद्धरण में, वाक्यांश के लिए विकल्पों की एक सूची का पालन कर सकते हैं। वाक्यांश के अंदर के पैरामीटर निर्धारित किए जाते हैं, जैसा कि आपने पहले ही देखा है, घुंघराले कोष्ठक के साथ।
{xen: count} - डेटाबेस के लिए एक क्वेरी के परिणामस्वरूप प्राप्त रिकॉर्ड की संख्या देता है। अनुरोध स्वयं बाद में निर्धारित किया जाएगा।
<xen: foreach> - जैसे कि PHP में एक foreach लूप को परिभाषित करता है
<xen: avatar> - उपयोगकर्ता के अवतार को सम्मिलित करता है, उपयोगकर्ता पैरामीटर में निर्दिष्ट डेटा के अनुसार इसकी पहचान करता है।
{xen: हेल्पर} लंबे टेक्स्ट को ट्रिम करने के लिए टेम्पलेट के अंदर एक मानक फ़ंक्शन है। आप ऐसे कार्यों को स्वयं परिभाषित कर सकते हैं।
{xen: number} और <xen: डेटाइम> - वर्तमान भाषा में निर्दिष्ट सेटिंग्स (जिसमें उपयोगकर्ता पृष्ठ को देखता है) के अनुसार प्रेषित डेटा को प्रारूपित करता है।
{$ Post.username} जैसे कंस्ट्रक्शन - बस एरे से यूजरनेम कुंजी के साथ वैल्यू को $ पोस्ट टेम्पलेट वेरिएबल में डालें। टेम्प्लेट में वेरिएबल्स को कैसे ट्रांसफर किया जाए मैं थोड़ी देर बाद दिखाऊंगा

वह सब है। कृपया ध्यान दें कि टेम्पलेट अपूर्ण है (बिना, और इसी तरह)। यही है, यह बस पृष्ठ के अंदर है, जिसके बाहर मानक XenForo तत्व होंगे।

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

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

नियंत्रण कक्ष में सेटअप पूरा हो गया है। अब हम कोडिंग शुरू करते हैं। सबसे पहले, रूटिंग उपसर्ग को संभालने के लिए हमारी कक्षा को भरें। लाइब्रेरी फ़ोल्डर में जाएं और वहां एक LikeReviewRus उपनिर्देशिका बनाएं, इसमें रूट फ़ोल्डर, उपसर्ग के अंदर। वास्तव में, काशीचेव की मृत्यु वास्तव में हुई है। अब फाइल को लाइक करेंReview.php इसकी सामग्री:

 <?php class LikeReviewRus_Route_Prefix_LikesReview implements XenForo_Route_Interface { /** * Match a specific route for an already matched prefix. * * @see XenForo_Route_Interface::match() */ public function match($routePath, Zend_Controller_Request_Http $request, XenForo_Router $router) { return $router->getRouteMatch('LikeReviewRus_ControllerPublic_Index', 'index', 'likes-review'); } }

इस मामले में, हम कहते हैं कि जब पसंद-समीक्षा उपसर्ग पाया जाता है (हमने इसे व्यवस्थापक पैनल में कॉन्फ़िगर किया है), तो हमें लाइकReview_ControllerPublic_Index नियंत्रक पर नियंत्रण स्थानांतरित करने की आवश्यकता है, इसे "इंडेक्स" एक्शन पास करें, और एक मेजर्सफेक्शन के रूप में पसंद-समीक्षा। साइरस की दूसरी गलती :)

अब path \ Library \ LikeReviewRus \ ControllerPublic बनाएं, वहां जाएं और वहां Index.php फ़ाइल बनाएं। इसकी सामग्री:

 <?php class LikeReviewRus_ControllerPublic_Index extends XenForo_ControllerPublic_Abstract { public function actionIndex() { $maxResults = XenForo_Application::get('options')->LikeReviewRusMaxToDisplay; $likedPosts = $this->_getLikeReviewModel()->getMostLikedPosts($maxResults); $viewParams = array( 'likedPosts' => $likedPosts ); return $this->responseView('LikeReviewRus_ViewPublic_Index', 'likereviewrus_index', $viewParams); } /** * @return LikeReview_Model_LikeReview */ protected function _getLikeReviewModel() { return $this->getModelFromCache('LikeReviewRus_Model_LikeReview'); } }

यहां क्या हो रहा है? इस नियंत्रक के लिए केवल एक क्रिया परिभाषित की गई है (सूचकांक, कैमलकेस का उपयोग विधि नाम में किया गया है)। इस क्रिया में, अधिकतम परिणाम के लिए सेटिंग्स की सामग्री निकाली जाती है (याद रखें, हमने इसे बनाया है)। फिर एक डेटा मॉडल को सबसे अच्छे पदों की सूची के लिए बनाया जाता है, फिर दृश्य में स्थानांतरित करने के लिए पैरामीटर बनाया जाता है (बस टेम्पलेट के लिए पैरामीटर, $ व्यूप्रैम) और उसके बाद दृश्य बनाया जाता है (इसी तरह ,ereere_index, responseView टेम्पलेट प्रदान किया जाता है) और मापदंडों को इसे पारित किया जाता है। _GetLikeReviewModel हेल्पर विधि केवल मॉडल को साझा कैश से बाहर खींचती है यदि इसे कैश किया गया है।

अब अपने डेटा मॉडल पर चलते हैं। पथ लाइब्रेरी \ LikeReviewRus \ मॉडल बनाएँ और वहाँ लॉग इन करें। LikeReview फ़ाइल बनाएँ। इसकी सामग्री:

 <?php class LikeReviewRus_Model_LikeReview extends XenForo_Model { /** * Gets the most liked posts in descending order * * @param integer Maximum posts to fetch * * @return array */ public function getMostLikedPosts($limit) { //    -    xf_liked_content, //    $limitedSql = $this->limitQueryResults(" SELECT content_id, COUNT(*) AS likes FROM xf_liked_content WHERE content_type = 'post' GROUP BY content_id ORDER BY likes DESC ", $limit); //       (fetchCol)  ID     $postIds = $this->_getDb()->fetchCol($limitedSql); //            ID  //,            $postResults = $this->_getPostModel()->getPostsByIds($postIds, array ( 'join' => XenForo_Model_Post::FETCH_THREAD | XenForo_Model_Post::FETCH_USER )); //   ,       "" . $posts = array(); foreach ($postResults AS $post) { $posts["$post[likes].$post[post_date]"] = $post; } // krsort($posts); // return $posts; } /** * @return XenForo_Model_Post */ protected function _getPostModel() { //       return $this->getModelFromCache('XenForo_Model_Post'); } }

अब www.xenforo.local / likes-review पर जाने की कोशिश करें। आपको धन्यवाद पोस्ट की एक सूची देखनी चाहिए। मोटी बदसूरत अवतार फ्रेम पर ध्यान दें :)

अब मुख्य नेविगेशन में इस पृष्ठ पर एक बुकमार्क जोड़ने का प्रयास करते हैं। विकास टैब पर व्यवस्थापक टैब पर जाएं और एक नया ईवेंट हैंडलर बनाएं। हम नेविगेशन_टैब्स घटना को संभाल लेंगे। LikeReviewRus_Tabs_MainTab हैंडलर वर्ग का नाम, addTab विधि नाम।

निम्नलिखित सामग्री के साथ एक पसंद-नापसंद_कमल टेम्पलेट बनाएँ:

 <ul class="secondaryContent blockLinksList"> <li><a href="{xen:link likes-review}">{xen:phrase LikeReviewRus_Header}</a></li> </ul>

यह मुख्य अनुभाग के लिए उप-लिंक बनाने के लिए एक टेम्पलेट है। अब तक हमारे पास केवल एक मुख्य लिंक है।

पथ लाइब्रेरी \ LikeReviewRus \ Tabs बनाएं, वहां जाएं और वहां MainTab.php फ़ाइल बनाएं। इसकी सामग्री:

 <?php class LikeReviewRus_Tabs_MainTab { public static function addTab(array &$extraTabs, $selected) { $extraTabs['likes-review'] =array( 'title' => new XenForo_Phrase('LikeReviewRus_Header'), //   'href' => XenForo_Link::buildPublicLink('likes-review'), //   'selected' => ($selected == 'likes-review'), //,      'linksTemplate' => 'likesreviewrus_links', //    - ); } }

नेविगेशन तैयार है। इसे खूबसूरती से प्रदर्शित करने के लिए, आपको एसईओ फोरम की सेटिंग में सीएनसी लिंक को सक्षम करना चाहिए। यह देखने के लिए कि पृष्ठ किस अनुरोध का उपयोग करता है, इसे अंत में / _debug = 1 जोड़कर खोलें। विशेष रूप से, आप देखेंगे कि नए XenForo_Phrase को कॉल करने से एक अलग अनुरोध उत्पन्न होता है, जो अच्छा नहीं है। इससे बचने के लिए, वाक्यांश LikeReviewRus_Header खोलें और इसे वैश्विक कैश में जोड़ने के लिए बॉक्स की जांच करें।

वह सब है। मुझे आशा है कि आपको अच्छा लगा है :) अगर कोई टाइपो - मुझे बताएं। हालांकि, मुझे लगता है कि वर्णित सब कुछ के बाद, आपके लिए उन्हें स्वयं को ठीक करना मुश्किल नहीं होगा, यदि कोई हो।

PS वैसे, XenForo के रूसी समुदाय ने अपने ऐड-ऑन विकसित करना शुरू कर दिया है। विशेष रूप से, हाल ही में हमारे मंच पर पेप्लेक द्वारा लिखित एक पंक्ति में उपयोगकर्ता द्वारा भेजे गए gluing पदों के लिए addon VBulletin का एक एनालॉग दिखाई दिया ।

हम XenForo के लिए पहला एडऑन लिख रहे हैं। MVC, टेम्प्लेट, स्टाइल, सेटिंग्स, नेविगेशन - हम सब कुछ उपयोग करते हैं

More articles: