Eklenti Olmadan WordPress HTML Küçültme

Eklenti Olmadan WordPress HTML Küçültme

HTML’yi küçülttüğünüzde, kaynak koddaki gereksiz karakterleri ve satırları kaldırır. HTML’de girinti, yorumlar, boş satırlar vb. Gerekli değildir. Sadece, dosyanın okunmasını kolaylaştırırlar. Tüm bu gereksiz şeyleri kısaltmak, dosya boyutunuzu, önemli ölçüde azaltabilir. Peki, bu kodları sıkıştırmak için, eklenti kullanmadan WordPress HTML küçültme işlemi nasıl yapılır?

Web sitenizdeki HTML kodu küçüldüğünde, sunucu; müşteriye web sitenizin daha hızlı yüklenmesini sağlayan, çok daha küçük bir sayfa gönderecektir.

WordPress HTML Küçültme Nedir?

WordPress, sitenizin HTML sürümünü bir araya getirmek için, PHP kodunu çalıştırarak ve bu HTML’ye eklenecek içeriği almak için, veritabanınızı sorgulayarak talep üzerine sayfalar oluşturur. İndirebileceğimiz ve küçültebileceğimiz fiziksel bir dosya yok, bu yüzden temanızın functions.php dosyasında biraz PHP kodu kullanmamız gerekecek.

Öncelik olarak, değişiklik yapacağınız functions.php dosyasının yedeğini almayı, unutmamanızı tavsiye ediyoruz.

Bu kod ile siteniz, ziyaretçilerinize gönderilmeden önce; HTML’yi sıkıştıracaktır. Aşağıda, HTML Küçültme öncesi ve sonrası bir web sayfasını gösteren iki ekran görüntüsü bulunmaktadır.

HTML Küçültmeden Öncesi

HTML Küçültme Sonrası

Sonrası

1. Adım: Bir Alt Tema Oluşturun

Functions.php dosyasını düzenlemeden önce, bir alt tema oluşturmak her zaman en iyisidir. Bir alt tema kullanmak, sorunlar varsa ana temaya geri dönmenizi sağlar.

Ayrıca, ana temanız güncellenirse, yaptığınız hiçbir değişiklik silinmeyecektir.

Çocuk temayı oluşturmamayı tercih ediyorsanız veya bunu kendi başınıza yapmaktan çekiniyorsanız, Kod ekleme adı verilen, harika bir hafif kod eklentisi var.

Kodlar, sitenize kod parçacıkları eklemenin kolay, temiz ve basit bir yoludur. Temanızın, functions.php dosyasına özel parçacıklar ekleme ihtiyacını ortadan kaldırır.

Adım 2: Alt Tema functions.php Dosyanızı Düzenleyin

Alt temanızdaki functions.php dosyasını düzenlemenin ve eklenti olmadan WordPress HTML küçültmenin 2 farklı yolu vardır.

WordPress Kontrol Panelinin İçinde

WordPress’te oturumunuz açıkken, Görünüm> Düzenleyici’ye gidip sayfanın sağ tarafındaki Tema İşlevleri’ni seçerek temanızın functions.php dosyasına erişebilir ve düzenleyebilirsiniz.

Dosyayı Doğrudan cPanel’de Düzenleyin

CPanel Dosya Yöneticinize giriş yapın. Public_html/wp-content/themes/ konumuna gidin ve mevcut temanızın veya alt temanızın klasörünü seçin, eğer bir tane oluşturduysanız.

Functions.php dosyası tema klasörünüzün içinde olacaktır.

Aşağıdaki kodu, functions.php dosyanızın içine kopyalayıp yapıştırın ve kaydedin.

class FLHM_HTML_Compression
{
protected $flhm_compress_css = true;
protected $flhm_compress_js = true;
protected $flhm_info_comment = true;
protected $flhm_remove_comments = true;
protected $html;
public function __construct($html)
{
if (!empty($html))
{
$this->flhm_parseHTML($html);
}
}
public function __toString()
{
return $this->html;
}
protected function flhm_bottomComment($raw, $compressed)
{
$raw = strlen($raw);
$compressed = strlen($compressed);
$savings = ($raw-$compressed) / $raw * 100;
$savings = round($savings, 2);
return '<!--HTML compressed, size saved '.$savings.'%. From '.$raw.' bytes, now '.$compressed.' bytes-->';
}
protected function flhm_minifyHTML($html)
{
$pattern = '/<(?<script>script).*?<\/script\s*>|<(?<style>style).*?<\/style\s*>|<!(?<comment>--).*?-->|<(?<tag>[\/\w.:-]*)(?:".*?"|\'.*?\'|[^\'">]+)*>|(?<text>((<[^!\/\w.:-])?[^<]*)+)|/si';
preg_match_all($pattern, $html, $matches, PREG_SET_ORDER);
$overriding = false;
$raw_tag = false;
$html = '';
foreach ($matches as $token)
{
$tag = (isset($token['tag'])) ? strtolower($token['tag']) : null;
$content = $token[0];
if (is_null($tag))
{
if ( !empty($token['script']) )
{
$strip = $this->flhm_compress_js;
}
else if ( !empty($token['style']) )
{
$strip = $this->flhm_compress_css;
}
else if ($content == '<!--wp-html-compression no compression-->')
{
$overriding = !$overriding; 
continue;
}
else if ($this->flhm_remove_comments)
{
if (!$overriding && $raw_tag != 'textarea')
{
$content = preg_replace('/<!--(?!\s*(?:\[if [^\]]+]|<!|>))(?:(?!-->).)*-->/s', '', $content);
}
}
}
else
{
if ($tag == 'pre' || $tag == 'textarea')
{
$raw_tag = $tag;
}
else if ($tag == '/pre' || $tag == '/textarea')
{
$raw_tag = false;
}
else
{
if ($raw_tag || $overriding)
{
$strip = false;
}
else
{
$strip = true; 
$content = preg_replace('/(\s+)(\w++(?<!\baction|\balt|\bcontent|\bsrc)="")/', '$1', $content); 
$content = str_replace(' />', '/>', $content);
}
}
} 
if ($strip)
{
$content = $this->flhm_removeWhiteSpace($content);
}
$html .= $content;
} 
return $html;
} 
public function flhm_parseHTML($html)
{
$this->html = $this->flhm_minifyHTML($html);
if ($this->flhm_info_comment)
{
$this->html .= "\n" . $this->flhm_bottomComment($html, $this->html);
}
}
protected function flhm_removeWhiteSpace($str)
{
$str = str_replace("\t", ' ', $str);
$str = str_replace("\n",  '', $str);
$str = str_replace("\r",  '', $str);
while (stristr($str, '  '))
{
$str = str_replace('  ', ' ', $str);
}   
return $str;
}
}
function flhm_wp_html_compression_finish($html)
{
return new FLHM_HTML_Compression($html);
}
function flhm_wp_html_compression_start()
{
ob_start('flhm_wp_html_compression_finish');
}
add_action('get_header', 'flhm_wp_html_compression_start');

3. Adım: Her Şeyin Çalıştığından Emin Olun

Kodu ekledikten sonra, sayfayı sağ tıklayıp “Sayfa kaynağını görüntüle” seçerek HTML’nin Google Chrome‘da küçültülmekte olup olmadığını kontrol edebilirsiniz. Her şey doğru çalışıyorsa, bu sayfanın üst kısmında verdiğim örnek resim gibi görünmelidir.

Bu kodu ekledikten sonra, web sitenizin tüm yönlerini kontrol etmenizi şiddetle tavsiye ederiz. Tüm eklentilerin ve tema işlevselliğinin düzgün çalıştığını kontrol edin ve emin olun.

Sitemize WordPress HTML Küçültme Kodları Eklendi

Sitemiz; eklenti kullanmadan WordPress HTML kodu ile küçültüldü. Kodun nasıl sıkıştırdığını görmek için, buradan ana sayfaya dönerek, sitemizin kaynak koduna bakabilirsiniz.

Bir cevap yazın

E-posta hesabınız yayımlanmayacak. Gerekli alanlar * ile işaretlenmişlerdir

This site uses Akismet to reduce spam. Learn how your comment data is processed.