Curățați secțiunea HEAD a temei WordPress și fișierele JS și CSS inutile

Publicat: 2018-09-04

WordPress anunțuri de bază destul de mult cod în secțiunea de head HTML a site-ului, indiferent dacă doriți sau nu. Acest cod este departe de a fi inutil și are un scop pe majoritatea site-urilor. Cu toate acestea, dacă sunteți un ciudat al codului curat sau utilizați WordPress pentru a alimenta un SaaS, veți dori să curățați HTML. Ca și în cazul majorității lucrurilor din WP, este doar o chestiune de a elimina câteva acțiuni și filtre.

#WordPress este o platformă excelentă pentru a construi site-uri #SaaS. Dar înainte de a face asta, este nevoie de puțină curățare.

CLICK PENTRU A TWETE

De ce aș elimina acele etichete din fișierele HEAD, CSS sau JS?

Există câteva motive. Unora le place să-și păstreze codul și site-urile cât mai ordonate posibil. De ce să aveți o linie de cod în HTML dacă știți că nu aveți nevoie de ea și știți cum să o eliminați. Fără motiv. Același lucru este valabil și pentru fișierele CSS și JS suplimentare. Dacă nu utilizați emoji-uri pe site-ul dvs. de ce ați include acel JS pe fiecare pagină?

Apoi mai este securitatea. Există câteva bucăți de HTML pe care WordPress le adaugă automat, afișează adrese URL care au fost exploatate în trecut. Trebuie să subliniez că aceste adrese URL (în special punctul final XML RPC) nu sunt un secret. Ar trebui să fie publice. Dar, schimbarea lor în ceva personalizat și ascunderea lor este o practică cunoscută. În acest caz, este evident că nu doriți acele adrese URL în HTML.

Viteza este, de asemenea, un motiv valid pentru curățarea HTML. Deși trebuie să spun că nu sunt sigur cât de mult vei câștiga eliminând câteva sute de caractere din HTML, este un pas în direcția corectă. Eliminarea fișierelor JS și CSS inutile vă va economisi câteva solicitări HTTP și pe asta ar trebui să vă concentrați optimizarea. Tidy Repo a testat recent peste 100 de teme WordPress pentru viteză, iar numărul de solicitări are un impact semnificativ asupra vitezei generale a site-ului.

Având cod HTML curat, vă asigură că știți ce se întâmplă pe site-ul dvs. și este un început excelent pentru optimizarea vitezei site-ului.

În sfârșit, dar nu în ultimul rând, motivul și motivul pentru care avem acest cod la îndemână sunt SaaSe-urile bazate pe WordPress. Când construiți un SaaS, doriți control complet asupra a ceea ce este în HTML, iar majoritatea lucrurilor pe care WP le adaugă la HTML de la sine nu sunt ceva pe care le veți folosi. Deci, de dragul tuturor motivelor menționate mai sus - curățăm lucrurile cât mai mult posibil. Acest lucru ne oferă o platformă excelentă, simplă, pe care să construim soluții personalizate, păstrând în același timp 99% din funcționalitatea de bază a WP, care este folosită pentru a alimenta SaaS.

Pot elimina în siguranță aceste lucruri? Nu au un scop?

Da, au un scop, dar numai în anumite situații. Pe un site web „mediu”, câteva etichete suplimentare de link în antet nu reprezintă o problemă și toate facilitează anumite operațiuni și integrări. Dar, ele nu sunt cruciale pentru funcționarea oricărui site și cu siguranță nu pentru un SaaS.

Să curățăm un cod

Puteți testa codul de mai jos cu orice temă. 2017 implicit se va descurca bine. Cu toate acestea, dacă utilizați teme WordPress „normale” (și unele plugin-uri pe lângă acestea), nu puteți ști niciodată cine a adăugat codul – nucleu WP, temă sau un plugin. Vă sugerez să vă resetați site-ul pentru a elimina toate pluginurile și apoi să utilizați o temă care are numai wp_head() și wp_footer() în ea. Iată cum arată acel index.php și iată întreaga temă de testare pe care o puteți folosi pentru testare.

<!DOCTYPE html>
<html>
<head>
  <?php
    wp_head();
  ?>
</head>
<body>
  <h1>The Most Basic WP Theme</h1>
  <?php
    wp_footer();
  ?>
</body>
</html>

Dacă activați tema noastră de testare și deschideți sursa de pe prima pagină, veți observa mult mai mult cod decât este vizibil în index.php de mai sus. Asta o să curățăm. Plasați codul de mai jos în funcțiile.php ale temei. Dacă nu doriți să eliminați/dezactivați o funcție, comentați rândul care o menționează.

add_action('after_setup_theme', 'cleanup');

function cleanup() {
  remove_action('wp_head', 'rsd_link');
  remove_action('wp_head', 'wp_generator');
  remove_action('wp_head', 'feed_links', 2); 
  remove_action('wp_head', 'feed_links_extra', 3);
  remove_action('wp_head', 'index_rel_link');
  remove_action('wp_head', 'wlwmanifest_link');
  remove_action('wp_head', 'start_post_rel_link', 10, 0);
  remove_action('wp_head', 'parent_post_rel_link', 10, 0);
  remove_action('wp_head', 'adjacent_posts_rel_link', 10, 0);
  remove_action('wp_head', 'adjacent_posts_rel_link_wp_head', 10, 0);
  remove_action('wp_head', 'wp_shortlink_wp_head', 10, 0);
  remove_action('wp_head', 'print_emoji_detection_script', 7);
  remove_action('wp_head', 'rel_canonical');
  remove_action('wp_head', 'rel_alternate');
  remove_action('wp_head', 'wp_oembed_add_discovery_links');
  remove_action('wp_head', 'wp_oembed_add_host_js');
  remove_action('wp_head', 'rest_output_link_wp_head');
  
  remove_action('rest_api_init', 'wp_oembed_register_route');
  remove_action('wp_print_styles', 'print_emoji_styles');
  
  remove_filter('oembed_dataparse', 'wp_filter_oembed_result', 10);
  remove_filter('pre_oembed_result', 'wp_filter_pre_oembed_result', 10);
  
  add_filter('embed_oembed_discover', '__return_false');
  add_filter('show_admin_bar', '__return_false');
}

Ce face ce

Acțiunea rsd_link este responsabilă pentru afișarea linkului de descoperire cu adevărat simplu, în timp ce wp_generator arată versiunea WP și este eliminat de aproape fiecare plugin de securitate scris vreodată pentru WP. Cele două acțiuni feed_links adaugă diverse linkuri la mai multe fluxuri RSS. Diverse acțiuni _rel_link adaugă linkuri către postări, astfel încât acestea să poată fi mai accesibile și mai ușor de găsit de către diverse servicii. Dacă nu utilizați Windows Live Writer, chiar nu aveți nevoie de acțiunea wlwmanifest_link . Nu avem nevoie de emoji, așa că print_emoji_detection_script poate funcționa și același lucru este valabil și pentru diferite link-uri oembed , inclusiv suport pentru oembed în API-ul REST. Eliminarea acțiunii oembed_dataparse se va asigura că WP nu se încurcă cu niciun link din postările tale și nu le transformă în rich-media prin oembed. Ultimul filtru show_admin_bar va împiedica afișarea barei de administrare WP pe front-end, indiferent de setările pentru fiecare cont.

Există doar câteva lucruri în #WordPress care nu pot fi modificate cu acțiuni și filtre. Din fericire, controlul conținutului HEAD nu este unul dintre ele.

CLICK PENTRU A TWETE

Flexibilitatea WordPress este grozavă

Multe articole plutesc cu titluri precum „Cum să eliminați nedorit din antetul WP”. Nu este gunoi. Sunt lucruri care oferă o mare putere WordPress direct din cutie. Mulți oameni prețuiesc acest lucru și nu trebuie să petreacă ore întregi la pregătirea lucrurilor. Pe de altă parte, curățarea este doar o chestiune de a elimina câteva acțiuni. Aveți control deplin asupra a ceea ce este introdus în HTML și puteți utiliza cu ușurință WordPress pentru a alimenta site-uri fără conținut, cum ar fi SaaSes.