اهو هر ڪنهن سان ٿئي ٿو.

توهان هڪ موضوع ڳوليو جيڪو توهان پسند ڪيو، توهان ان کي انسٽال ڪريو ۽ ڪجهه مهينا گذاريو پنهنجي سائيٽ جي شڪل مان لطف اندوز ٿيڻ ۾. پر پوءِ، چند مهينن کان پوءِ، موضوع بيڪار محسوس ٿيڻ شروع ٿئي ٿو. ٿورڙو بورنگ.

صرف مسئلو آهي، توهان ڪجهه ڪلاڪ ڪجهه نئين ڳولڻ ۾ خرچ ڪرڻ نٿا چاهيو. جيڪڏھن توھان جي موضوع ۾ ھڪڙو ننڍڙو مصالحو شامل ڪرڻ جو ھڪڙو طريقو ھو، ان کي نمايان بڻائڻ لاءِ ٿورو بھڙو.

ان کان اڳ جو توھان نااميدي ۾ پنھنجا ھٿ مٿي اٿاريو، اچو ته مان توھان کي ھڪڙو آسان رستو ڏيکاريان توھان کي پنھنجي موضوع ۾ مصالحو وڌائڻ لاءِ. موضوع تمام گهڻي ڪوشش کان سواءِ، ۽ غير ضروري تصويرون شامل ڪرڻ کان سواءِ جيڪي توهان جي سائيٽ کي سست ڪري سگهن ٿيون.

Dashicons داخل ڪريو. Dashicons فونٽ آئڪن آھن جيڪي ورڈپریس 3.8 ۾ متعارف ڪرايا ويا آھن. اهي اهي شاندار ۽ سٺا آئڪن آهن جيڪي توهان ڏسندا آهيو جڏهن توهان پنهنجي ڊيش بورڊ ۾ لاگ ان ٿيندا آهيو. ڇا اهو سٺو نه ٿيندو جيڪڏهن توهان انهن کي پڻ پنهنجي موضوع ۾ شامل ڪري سگهو ٿا؟

چڱو، توهان ڪري سگهو ٿا ۽ مان توهان کي ڏيکاريان ٿو ته ڪيئن.

توهان پنهنجي موضوع ۾ ڊيشيڪن کي ڪيئن استعمال ڪري سگهو ٿا نيويگيشن مينيو؟

اچو ته هڪ سادي مثال سان شروع ڪريون. Dashicons اڳ ۾ ئي ورزن 3.8 کان ورڈپریس ۾ شامل ڪيا ويا آھن پر توھان اڃا تائين انھن کي شامل ڪرڻ جي ضرورت آھي انھن کي حاصل ڪرڻ لاءِ توھان جي سائيٽ جي اڳئين آخر تي صحيح نموني ڏيکاري. اهو آهي، توهان جو موضوع.

قدم 1: پنهنجي موضوع کي تيار ڪريو Dashicons

پنهنجي موضوع Dashicons کي تيار ڪرڻ لاءِ پهريان پنهنجي functions.php فائل کوليو (جي ظاهري ۽ gt ۾ مليل آهي) ايڊيٽر - ڊفالٽ طور اهو توهان جي موجوده موضوع جي 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 استعمال ڪرڻ لاءِ.

Step 3: Dashicons کي مينيو آئٽمز ۾ شامل ڪرڻ

اچو توھان جي ھوم لنڪ لاءِ Dashicon شامل ڪريون. Dashicons ويب سائيٽ ڏانهن وڃو ۽ آئڪن کي چونڊيو جيڪو توهان پسند ڪيو.

تازه ڪاري: Dashicons اصل ۾ GitHub.io تي دستياب هئا، پر اهي بعد ۾ WordPress.org تي دستياب ڪيا ويا آهن.

قدم 4:

گهربل آئڪن تي ڪلڪ ڪريو (هن صورت ۾ مون چونڊيو هوم آئڪن) ۽ پوءِ ڪلڪ ڪريو ڪاپي HTML. اهو توهان کي ڪوڊ سان گڏ هڪ پاپ اپ ونڊو ڏيندو جنهن جي توهان کي ضرورت آهي.

قدم 5: 7>

پنهنجي ورڈپریس ڊيش بورڊ ڏانهن واپس وڃو، ظاهري تي ڪلڪ ڪريو > ؛ مينيو ۽ ڪوڊ کي صحيح پيسٽ ڪريو جتي اھو چوي ٿو نيويگيشن ليبل.

جيڪڏھن توھان اڃا چاھيو ٿا ته لفظ ڏيکاريو، ان کي ٽائيپ ڪريو بند ٿيڻ واري ڊيو بریکٹ کان پوءِ.

تي ڪلڪ ڪريو محفوظ ڪريو ۽ پنھنجي گھر واري صفحي کي لوڊ ڪريو. توھان جي گھر جي لنڪ ھاڻي ھڪ سٺي، ڪرپٽ ڊيشيڪن کي ڏيکارڻ گھرجي.

ڏسو_ پڻ: متاثر ڪندڙ پئسا ڪيئن ٺاهيندا آهن؟ مڪمل ھدايت

توھان ھي ڪري سگھو ٿا سڀني نيويگيشن مينيو آئٽمز لاءِ يا صرف گھر لاءِ. صرف ملندڙ آئڪن سان مٿي ڏنل قدمن کي ورجايو. اهو آسان هو صحيح؟

توهان پوسٽ ميٽا ۾ ڊيشيڪن کي ڪيئن استعمال ڪندا آهيو؟

توهان هڪ قدم اڳتي وڌي سگهو ٿا ۽ ڊيشيڪن کي پنهنجي پوسٽ ميٽا ۾ شامل ڪري سگهو ٿا، يا ٻين لفظن ۾ ڊشڪنز کي ليکڪ جي سامهون شامل ڪريو نالو، تاريخ، درجو يا ٽيگ؛ تي منحصر ڪري ٿوتوهان جو موضوع ۽ اها معلومات جيڪا اها ڏيکاري ٿي.

جيئن ته توهان پنهنجي موضوع ۾ Dashicons اڳ ۾ ئي قطار ۾ رکيا آهيو، هاڻي توهان کي صرف پنهنجي style.css فائل کولڻو آهي (يا ڪسٽم CSS ايڊيٽر استعمال ڪريو جيڪو هميشه لاءِ هڪ بهتر آپشن آهي. تبديلين کي نه وڃايو هڪ دفعو توهان جي موضوع جي تازه ڪاري!)، ملندڙ چونڊيندڙ ڳولهيو ۽ CSS ڪوڊ شامل ڪريو.

چون ٿا ته توهان پنهنجي نالي يا ليکڪ جي نالي جي اڳيان هڪ آئڪن شامل ڪرڻ چاهيو ٿا.

5>قدم 1: 7>>

پوءِ ان تي ڪلڪ ڪريو، ۽ هن ڀيري ڪاپي CSS چونڊيو. ٻيهر، اهو توهان کي ڪوڊ سان هڪ پاپ اپ ونڊو ڏيندو جنهن کي توهان پيسٽ ڪرڻ جي ضرورت آهي.

قدم 3:

هاڻي کوليو پنهنجو style.css ۽ لاڳاپيل چونڊيندڙ کي ڳوليو، هن صورت ۾ - .entry-author. شامل ڪرڻ سان : کان اڳ ۽ پوءِ پيسٽ ڪيو سي ايس ايس ڪوڊ جيڪو توهان ڊيشيڪنز ويب سائيٽ تان ڪاپي ڪيو آهي، مصنف جي نالي جي سامهون هڪ سٺو آئڪن هوندو. توهان کي اهو به بيان ڪرڻ جي ضرورت آهي ته توهان استعمال ڪري رهيا آهيو 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 استعمال ڪري سگهو ٿا – توهان جي تخليقيت کي پڪڙڻ ڏيو ۽ ڏسو ته توهان ڇا ڪري سگهو ٿا.

سڀني کي گڏ ڪرڻ

مٿين مثالن کان علاوه، توهان مختلف وضاحت ڪرڻ لاءِ پنهنجي پس منظر ۾ ڊيشڪن استعمال ڪري سگهو ٿامختلف پوسٽن جي قسمن لاءِ icons، يا توهان انهن کي پنهنجي پوسٽ جي عنوانن، ويجيٽ عنوانن ۾ استعمال ڪري سگهو ٿا، يا جيڪڏهن توهان هڪ ڪسٽم لينڊنگ صفحو ٺاهي رهيا آهيو ته توهان پنهنجي سائيٽ جي مختلف صفحن ۾ فرق ڪري سگهو ٿا.

هتي هڪ بنيادي مثال آهي ڇا توھان انھن کي ٺاھڻ لاءِ استعمال ڪري سگھو ٿا: