हे प्रत्येकाला घडते.

तुम्हाला तुमच्या आवडीची थीम सापडते, तुम्ही ती स्थापित करता आणि काही महिने तुमच्या साइटच्या स्वरूपाचा आनंद लुटता. पण, काही महिन्यांनंतर, थीम शिळी वाटू लागते. थोडे कंटाळवाणे.

एकच समस्या आहे, तुम्ही काही नवीन शोधण्यात काही तास घालवू इच्छित नाही. जर तुमच्या थीममध्ये थोडासा मसाला घालण्याचा मार्ग असेल तर, तो वेगळा बनवण्यासाठी थोडासा भडका.

तुम्ही निराश होण्याआधी, मी तुम्हाला तुमचा मसाला वाढवण्याचा एक सोपा मार्ग दाखवतो. थीम जास्त प्रयत्न न करता, आणि अनावश्यक इमेज न जोडता ज्यामुळे तुमची साइट धीमी होऊ शकते.

डॅशिकॉन्स एंटर करा. डॅशिकॉन्स हे फॉन्ट आयकॉन आहेत जे वर्डप्रेस 3.8 मध्ये सादर केले गेले होते. जेव्हा तुम्ही तुमच्या डॅशबोर्डवर लॉग इन करता तेव्हा तुम्हाला दिसणारे ते अप्रतिम आणि मस्त चिन्ह आहेत. तुम्ही त्यांना तुमच्या थीममध्ये देखील जोडू शकलात तर छान होईल का?

ठीक आहे, तुम्ही हे करू शकता आणि मी तुम्हाला ते कसे दाखवणार आहे.

तुम्ही तुमच्या थीममध्ये Dashicons कसे वापरू शकता नेव्हिगेशन मेनू?

एका साध्या उदाहरणाने सुरुवात करूया. Dashicons आधीपासूनच वर्डप्रेसमध्ये आवृत्ती 3.8 पासून समाविष्ट केले आहेत परंतु तरीही तुम्हाला ते तुमच्या साइटच्या समोरील टोकावर योग्यरित्या प्रदर्शित करण्यासाठी ते समाविष्ट करणे आवश्यक आहे; म्हणजेच तुमची थीम.

चरण 1: तुमची थीम Dashicons तयार करा

तुमची थीम Dashicons तयार करण्यासाठी प्रथम तुमची functions.php फाइल उघडा (स्वरूप> मध्ये आढळते. ;संपादक – डीफॉल्टनुसार ते तुमच्या वर्तमान थीमची CSS फाइल उघडेल. पुढे जा आणि शोधाfunctions.php फाइल आणि एडिटरमध्ये लोड करण्यासाठी त्यावर क्लिक करा.)

स्टेप 2: स्क्रिप्ट एन्क्यू करा

सर्व प्रकारे तळाशी स्क्रोल करा आणि या ओळी पेस्ट करा शेवटी कोड:

//Enqueue the Dashicons script add_action( 'wp_enqueue_scripts', 'load_dashicons_front_end' ); function load_dashicons_front_end() { wp_enqueue_style( 'dashicons' ); }

ठीक आहे! आता तुमची थीम Dashicons वापरण्यासाठी तयार आहे.

चरण 3: मेनू आयटममध्ये Dashicons जोडणे

तुमच्या होम लिंकसाठी Dashicon जोडू. Dashicons वेबसाइटवर जा आणि तुम्हाला आवडेल ते चिन्ह निवडा.

अपडेट: Dashicons मूळत: GitHub.io वर उपलब्ध होते, परंतु त्यानंतर ते WordPress.org वर उपलब्ध केले गेले आहेत.

चरण 4:

इच्छित चिन्हावर क्लिक करा (या प्रकरणात मी होम आयकॉन निवडले आहे) आणि नंतर कॉपी HTML वर क्लिक करा. ते तुम्हाला आवश्यक असलेल्या कोडसह एक पॉप-अप विंडो देईल.

चरण 5:

तुमच्या WordPress डॅशबोर्डवर परत जा, स्वरूप > वर क्लिक करा. ; मेनू आणि कोड पेस्ट करा जिथे ते नेव्हिगेशन लेबल म्हणते.

तुम्हाला अजूनही शब्द दिसायचा असेल तर तो बंद div ब्रॅकेट नंतर टाइप करा.

वर क्लिक करा तुमचे मुख्यपृष्ठ जतन करा आणि लोड करा. तुमच्या होम लिंकवर आता एक छान, कुरकुरीत डॅशिकॉन प्रदर्शित झाला पाहिजे.

तुम्ही हे सर्व नेव्हिगेशन मेनू आयटमसाठी किंवा फक्त घरासाठी करू शकता. जुळणार्‍या चिन्हांसह फक्त वरील चरणांची पुनरावृत्ती करा. ते सोपे होते बरोबर?

तुम्ही पोस्ट मेटामध्ये Dashicons कसे वापरता?

तुम्ही एक पाऊल पुढे जाऊन तुमच्या पोस्ट मेटामध्ये Dashicons जोडू शकता किंवा दुसऱ्या शब्दांत लेखकाच्या समोर Dashicons जोडू शकता. नाव, तारीख, श्रेणी किंवा टॅग; अवलंबूनतुमची थीम आणि ती दाखवत असलेली माहिती.

तुम्ही तुमच्या थीममध्ये आधीच Dashicons रांगेत ठेवल्यामुळे, तुम्हाला आता फक्त तुमची style.css फाइल उघडायची आहे (किंवा कस्टम CSS एडिटर वापरा जो नेहमीच चांगला पर्याय असतो. तुमची थीम अपडेट झाल्यावर बदल गमावू नका!), जुळणारे निवडक शोधा आणि CSS कोड जोडा.

तुम्हाला तुमच्या नावासमोर किंवा तुमच्या लेखकाच्या नावासमोर एक चिन्ह जोडायचे आहे असे समजा.

पायरी 1:

प्रथम आम्ही आम्हाला आवडेल ते चिन्ह निवडणार आहोत.

चरण 2:

नंतर त्यावर क्लिक करा आणि यावेळी कॉपी CSS निवडा. पुन्हा, ते तुम्हाला पेस्ट करण्‍यासाठी आवश्यक असलेल्या कोडसह एक पॉप-अप विंडो देईल.

चरण 3:

आता तुमचे style.css उघडा. आणि या प्रकरणात संबंधित निवडकर्ता शोधा - .entry-author. आपण Dashicons वेबसाइटवरून कॉपी केलेला CSS कोड :पूर्वी आणि नंतर पेस्ट करून, लेखकाच्या नावासमोर एक छान चिन्ह असेल. आपण Dashicons फॉन्ट वापरत आहात हे देखील निर्दिष्ट करणे आवश्यक आहे. सुधारित कोड असा दिसतो:

.entry-author:before { font-family: "dashicons"; content: "\f110"; }

चला थोडी शैली देखील जोडू, आणि आता पूर्ण केलेला कोड असा दिसतो:

.entry-author:before { font-family: "dashicons"; content: "\f110"; color: #f15123; display: inline-block; -webkit-font-smoothing: antialiased; font: normal 20px/1; vertical-align: top; margin-right: 5px; margin-right: 0.5rem; } 

शेवटचा परिणाम

तर काय हे शेवटी असे दिसेल का?

असे काहीतरी:

तुम्ही Dashicons वापरू शकता असे अनेक मार्ग आहेत – तुमची सर्जनशीलता पकडू द्या आणि तुम्ही काय करू शकता ते पहा.

हे सर्व एकत्र ठेवणे

वरील उदाहरणे बाजूला ठेवून, तुम्ही तुमच्या बॅकएंडमधील Dashicons वापरू शकता भिन्न निर्दिष्ट करण्यासाठीवेगवेगळ्या पोस्ट प्रकारांसाठी चिन्ह, किंवा तुम्ही ते तुमच्या पोस्टच्या शीर्षकांमध्ये, विजेट शीर्षकांमध्ये वापरू शकता किंवा तुम्ही सानुकूल लँडिंग पेज तयार करत असाल तर तुम्ही तुमच्या साइटच्या वेगवेगळ्या पेजेसमध्ये फरक करू शकता.

काय याचे मूळ उदाहरण येथे आहे तुम्ही ते तयार करण्यासाठी वापरू शकता: