ეს ყველას ემართება.

თქვენ იპოვით თქვენთვის სასურველ თემას, დააინსტალირებთ და რამდენიმე თვეს ატარებთ თქვენი საიტის იერსახით. მაგრამ შემდეგ, რამდენიმე თვის შემდეგ, თემა იწყებს გაფუჭებას. ცოტა მოსაწყენია.

ერთადერთი პრობლემა ის არის, რომ არ გინდა რამდენიმე საათი გაატარო რაღაც ახლის ძიებაში. თუ არსებობდა გზა, რომ დაამატოთ ცოტა სანელებელი თქვენს თემას, პატარა აურზაური, რათა ის გამორჩეულიყო.

სანამ სასოწარკვეთილი ხელები მაღლა ასწიოთ, ნება მიბოძეთ გაჩვენოთ მარტივი გზა, რომ გაახალისოთ თქვენი თემა ზედმეტი ძალისხმევის გარეშე და არასაჭირო სურათების დამატების გარეშე, რამაც შეიძლება შეანელოს თქვენი საიტი.

შეიყვანეთ Dashicons. Dashicons არის შრიფტის ხატები, რომლებიც დაინერგა WordPress 3.8-ში. ეს არის ის გასაოცარი და მაგარი ხატები, რომლებსაც ხედავთ, როდესაც შეხვალთ თქვენს დაფაზე. არ იქნება მაგარი, თუ მათაც დაამატეთ თქვენს თემაში?

მაშ, თქვენ შეგიძლიათ და მე გაჩვენებთ როგორ.

როგორ შეგიძლიათ გამოიყენოთ Dashicons თქვენს ნავიგაციის მენიუ?

დავიწყოთ მარტივი მაგალითით. Dashicons უკვე შედის WordPress-ში 3.8 ვერსიიდან, მაგრამ თქვენ მაინც გჭირდებათ მათი ჩართვა, რათა სწორად გამოჩნდნენ თქვენი საიტის წინა ბოლოში; ეს არის თქვენი თემა.

ნაბიჯი 1: მოამზადეთ თქვენი თემა Dashicons

თქვენი თემის Dashicons-ის დასამზადებლად ჯერ გახსენით თქვენი functions.php ფაილი (იპოვება Appearance&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' ); }

კარგი! ახლა თქვენი თემა მზად არის Dashicon-ების გამოსაყენებლად.

ნაბიჯი 3: მენიუს ელემენტებში Dashicon-ების დამატება

მოდით, დავამატოთ Dashicon თქვენი სახლის ბმულისთვის. გადადით Dashicons ვებსაიტზე და აირჩიეთ თქვენთვის სასურველი ხატულა.

განახლება: Dashicons თავდაპირველად ხელმისაწვდომი იყო GitHub.io-ზე, მაგრამ მას შემდეგ ისინი ხელმისაწვდომი გახდა WordPress.org-ზე.

ნაბიჯი 4:

დააწკაპუნეთ სასურველ ხატულაზე (ამ შემთხვევაში მე შევარჩიე სახლის ხატულა) და შემდეგ დააწკაპუნეთ Copy HTML-ზე. ის მოგცემთ ამომხტარ ფანჯარას თქვენთვის საჭირო კოდით.

ნაბიჯი 5:

დაბრუნდით თქვენს WordPress დაფაზე, დააწკაპუნეთ გარეგნობაზე > ; მენიუები და ჩასვით კოდი იქ, სადაც ნათქვამია ნავიგაციის ლეიბლი.

თუ კვლავ გსურთ სიტყვა გამოჩნდეს, აკრიფეთ ის დახურვის div ფრჩხილის შემდეგ.

დააწკაპუნეთ შეინახეთ და ჩატვირთეთ თქვენი საწყისი გვერდი. თქვენი სახლის ბმულმა ახლა უნდა აჩვენოს ლამაზი, მკვეთრი Dashicon.

ეს შეგიძლიათ გააკეთოთ ნავიგაციის მენიუს ყველა ელემენტისთვის ან უბრალოდ სახლისთვის. უბრალოდ გაიმეორეთ ზემოთ მოცემული ნაბიჯები შესაბამისი ხატებით. ეს ადვილი იყო, არა?

როგორ იყენებთ Dashicon-ებს პოსტ მეტა-ში?

შეგიძლიათ გადახვიდეთ წინ და დაამატოთ Dashicons თქვენს პოსტის მეტაში, ან სხვა სიტყვებით რომ ვთქვათ დაამატოთ Dashicons ავტორის წინ სახელი, თარიღი, კატეგორია ან ტეგი; დამოკიდებულიათქვენი თემა და ინფორმაცია, რომელიც მას აჩვენებს.

რადგან თქვენ უკვე ჩაწერეთ Dashicons თქვენს თემაში, ახლა მხოლოდ უნდა გახსნათ თქვენი style.css ფაილი (ან გამოიყენოთ მორგებული CSS რედაქტორი, რომელიც ყოველთვის უკეთესი ვარიანტია. არ დაკარგოთ ცვლილებები თემის განახლების შემდეგ!), იპოვეთ შესაბამისი ამომრჩეველი და დაამატეთ CSS კოდი.

ვთქვათ, რომ გსურთ დაამატოთ ხატულა თქვენი სახელის ან ავტორის სახელის წინ.

ნაბიჯი 1:

პირველ რიგში ჩვენ ვაპირებთ ავირჩიოთ სასურველი ხატულა.

ნაბიჯი 2:

შემდეგ დააჭირეთ მასზე და ამჯერად აირჩიეთ Copy 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 თქვენს backend-ში, რათა მიუთითოთ სხვადასხვახატები სხვადასხვა ტიპის პოსტებისთვის, ან შეგიძლიათ გამოიყენოთ ისინი პოსტის სათაურებში, ვიჯეტის სათაურებში, ან თუ თქვენ ქმნით მორგებულ სადესანტო გვერდს, შეგიძლიათ განასხვავოთ თქვენი საიტის სხვადასხვა გვერდები.

აქ არის ძირითადი მაგალითი იმისა, თუ რა თქვენ შეგიძლიათ მათი გამოყენება შექმნათ: