WordPress par aap minification plugins ka istemal kar CSS, HTML and JavaScript files ko minify kar uska size kam kar sakte ho lekin is post me main aapko aesa tarika btaunga jisse aap bina plugin (without a plugin) ke apni wordpress site ke HTML, CSS aur JS code ko minify kar sakte ho. Minify WordPress CSS, HTML, JavaScript (without Plugin)
Minify ka matlab hota hai file code me se whitespace aur unnecessary characters ko remove karke file size kam karna. File size reduce hone se aapki site ki pagespeed improve hoti hai aur page speed improve hone se site ki search ranking increase hoti hai.
Main kafi time se aesa farmula search kar raha tha jisse ki main bina kisi plugin ka istemal kiye apni site ki HTML, CSS, JavaScript coding ko minify karke size kam kar saku. Aur finally mujhe iska solution mil gaya, wo tarika main aap sabhi bloggers ke sath share kar raha hu.
Iske liye wordpress par Autoptimize jaise kai plugin available hai lekin hume plugin ke wordpress site ko minify karna hai.
Bina Plugin WordPress HTML, CSS and JS File Code Ko Minify Kaise Kare
Main aaj aapko aesa tarika bta raha hu jo na sirf aapki site ke HTML, CSS, Javascript code ko minify karega balki kis page par kitna size reduce hua hai uske bare me bhi btayega.
Aap apne wordpress blog ke dashboard me jaye aur theme functions.php
folder me bottom me ye code add kar de.
WordPress functions.php me <?php
line pahle se hi hoti hai so iske alawa code ko hi add karna hai.
<?php /** * Plugin Name: SMI Mnify Plugin * * Minifies HTML, CSS and Javascript code and reduce file size * * @author Jumedeen khan * @link https://www.supportmeindia.com/ */ class WP_HTML_Compression { // Settings protected $compress_css = true; protected $compress_js = true; protected $info_comment = true; protected $remove_comments = true; // Variables protected $html; public function __construct($html) { if (!empty($html)) { $this->parseHTML($html); } } public function __toString() { return $this->html; } protected function 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 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; // Variable reused for output $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->compress_js; } else if ( !empty($token['style']) ) { $strip = $this->compress_css; } else if ($content == '<!--wp-html-compression no compression-->') { $overriding = !$overriding; // Don't print the comment continue; } else if ($this->remove_comments) { if (!$overriding && $raw_tag != 'textarea') { // Remove any HTML comments, except MSIE conditional comments $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; // Remove any empty attributes, except: // action, alt, content, src $content = preg_replace('/(\s+)(\w++(?<!\baction|\balt|\bcontent|\bsrc)="")/', '$1', $content); // Remove any space before the end of self-closing XHTML tags // JavaScript excluded $content = str_replace(' />', '/>', $content); } } } if ($strip) { $content = $this->removeWhiteSpace($content); } $html .= $content; } return $html; } public function parseHTML($html) { $this->html = $this->minifyHTML($html); if ($this->info_comment) { $this->html .= "\n" . $this->bottomComment($html, $this->html); } } protected function 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 wp_html_compression_finish($html) { return new WP_HTML_Compression($html); } function smi_html_css_js_minify() { ob_start('wp_html_compression_finish'); } add_action('get_header', 'smi_html_css_js_minify');
Aap chahe to apne wp theme me minify.php name ki file create kar usme ye code add kar de uske bad aapko functions.php me sirf ye code add karna hai.
//* SMI Minify Plugin include_once( get_template_directory() . '/minify.php' );
Ab setup complete hone ke bad aap apne blog ke kisi bhi page ka source code dekhe aapko all coding (HTML, CSS and JS) minify huyi milegi.
Agar aap dekhna chahate hai ki aapka page ka size kitna kam hua hai to aap source code ke bottom me dekhe, aapko green color me ye line dikhayi degi.
<!--HTML compressed, size saved 0.00%. From 00000 bytes, now 00000 bytes-->
For example, maine apni site ke ek page ka soruce check kiya tha dekha ki file ka size 8.57% reduce ho gaya hai. Aap ye screenshot dekh sakte hai.
Is tarah se aap wordpress html, css and jaascript ko minify kar file size reduce kar apni site ko speed up kar sakte ho.
Main minimum plugins ka istemal karna better samajhta hu bajaye site par bahut se plugins use karke ke kyuki jyada plugins use karne se site speed slow ho jati hai. Function.php code se bhi site speed slow hoti hai lekin plugin ki tulna me kam hoti hai.
- Blog Ko Sahi Se Speed Up Karne Ke Bare Me 7 Jaruri Tips
- Blog Ko Fast Loading Banane Wale Plugins Aur Unki Settings
I hope aapko ye article pasand aaya hoga so please apna 5 second ka time nikal kar is post ko share jarur kare.
Shridas Kadam
bhai me aapke dwara diye gaye coding ko copy nahi kar paa raha hu, coding ko copy kaise kare? please bataiye?
Jay Ravtole
Nice and Deeply explained about minify css and Html
It is very helpful.
Ravi
सर, मुझे आपके ब्लॉग की तरह Homepage बनानी है, जैसे email subscription box की जगह seach box, उसके नीचे letest post, क्या कोई drag and drop composer hai इसके लिए? plz बताएं
Jumedeen khan
wpbeginner par is sabki jankari mil jayegi.
Dharmendra Yadav
Hi नमस्कार sir मै जानना चाहता हु कि
Q.Admin login panel उसका लोगो और बैकग्राउंड कैसे change या फिर जैसे आपका admin login panel है वैसा डिजाईन करने के लिए क्या करे.
Q.2 sir यदि हम कोई भी वर्डप्रेस वेबसाइट develop करते है तो उसमे जैसे किसी doctor या क्लिनिक कि जो वेबसाइट होती है मै देखता हु कि एक login जो doctor को दिया जाता है तो उसमे केवल doctor के अपॉइंटमेंट से रिलेटेड दिखाया जाता और बाकि theme और plugin या पोस्टिंग का आप्शन नही रहता है तो sir प्लीज इससे रिलेटेड कोई पोस्ट कीजिये कि ये सब कैसे किया जाता है .
Jumedeen khan
Ye sab ek developer ka kaam hai, aapko thodi coding aati hai to hi samajh aayega. Coding se aap site me chahe jaise feature laga sakte ho.
anwar
theme my minify.php file create kaise kare? zara detail me batayenge please?
Jumedeen khan
FTP server ya cPanel ke through wordpress location me jao waha aapko new file ka option milega wo select kar file name me minify.php type kar ok karo file ban jayegi.
KARAN VEER
sir bhut he badiya ap aysa code bhi baniye jise images compress ho jayege automatic
G. P. Gautam
भाई अगर हमने ब्लॉग पर कोई Cache Plugin Install किया हुआ है तो क्या फिर भी इस कोड को Add कर सकते हैं? और अगर Plugin के साथ इस कोड को Add किया तो ये कोड और Plugin का कोड (html, css, js को minify करने वाला) दोनों साथ काम करते रहेंग़े? भाई उलझन दूर करें.
Jumedeen khan
Yes, kar sakte ho lekin minify cache plugin mat karna is code ke bad uski jarurat nahi hai.
Duni Chand
Sir Ye Code Child Theme Me Enter Karna Hai Ya Fir Parent Theme Me.
Thanks
Jumedeen khan
Child theme use karte ho to child theme me karna hai.
Deepak sahu
sir ye code add karne pe save nahi ho raha hai.. ye error show ho raha hai—
Your PHP code changes were rolled back due to an error on line 309 of file wp-content/themes/beginner/functions.php. Please fix and try saving again.
Cannot redeclare wp_html_compression_finish() (previously declared in wp-content/themes/beginner/functions.php:149)
Jumedeen khan
WordPress 4.9 update ke bad wp dashboard se php file edit karne par ye error aata hai. aap server ke through code add karo. Iske liye aap
cpanel >> file manager >> wp-content >> themes >>your theme >> functions.php
step follow karke code add karo.Haseeb Alam
Mai Is Jankaari Ko Hindi Me Sirf Aapke Blog Se Jaanna Chahta Tha…
Kyonki Mujhe Sirf Aapki Coding Par Bharosa Hai… Bilkul Aapke Website Ki Speed Ki Tarah…
Is Lajwab Jankari Ke Aapka Dil Se Shukriya Sir G…
Jumedeen khan
Welcome bro and tnx for believe SMI, future me aapko aur bhi better site speed up tips milengi.
Akash Yadav
Kya isse website ki loading speed par asar padega..?
I mean kya Loading Speed kam hogi?
Jumedeen khan
Bilkul kam hogi kyuki file size kam hoga.
rovin singh chauhan
sir mujhe bhi apne blog ki coding ko minify karna tha without plugin but solution ab mil gaya. thanks.
Nomi khan
Jumedeen bhai Aapka bohot bohot Shukriya Me kaafi mahino se Html, CSS, Java script ko minify karna tha lekin samjh nahi aa raha tha kaise karu aaj aapki post Padh kar muje kaafi help mili he !! 🙂
Umesh
Aap kya kya kar rhe ho brother website speed increase karne me, pluggin aur codes jo use karte ho usse ek alag article me bataye jisse ham bhi apne web ki speed increase kar sake
Jumedeen khan
Just wait bro, sabke bare me btaunga tab tak aap ye method try kijiye.