إضافة أداة ضغط أكواد CSS في بلوجر

اضافة اداة ضغط اكواد css

اليوم  سنتعرف على اداة جميلة جدا وهي اداة ضغط اكواد الcss وهي مهمة جدا لاصحاب مدونات بلوجر او مقدمي اضافات بلوجر ولكن بعض الاضافات قد تجعل المدونة ثقيلة لذلك اتيت لكم بهذه الاضافة فهي سرعة ولاثاثر على سرعة المدونة وبالتالي لاثاثر على الseo طبعا الاضافة تضاف في صفحة ثابتة

يمكنك معاينة الاضافة من خلال الرابط التالي

معاينة

•   الان لكيفية لكيفية تركيب الاضافة

1. توجه الى لوحة تحكم بلوجر من هنا
2. اضغط على تبويب صفحات
3. انشاء صفحة جديدة
4. اذهب لتبويب html 

كما هو واضح في الصورة التالية

 وامسح كل شيئ موجود هناك والصق مكانه الكود التالي

الان انسخ الكود

ملاحظة لاتقم بنسخ الارقام المجودة في اليمين

[code type="HTML" title='اظغط مرتين لنسخ الكود']<div id="cssminifier">
<style scoped="" type="text/css">
#cssminifier{background:#ecf0f1;position:relative;display:block;clear:both;border-radius:5px;padding:20px;border:1px solid rgba(0,0,0,0.05)}
#cssminifier textarea{width:100%;height:240px;margin:0 auto;display:block;background-color:#fff;padding:20px;font:normal 13px 'Courier New',Monospace;border:0;box-shadow:inset 0 0 0 1px rgba(0,0,0,0.05);border-radius:5px 5px 0 0;resize:none}
textarea:focus{background-color:#FFF;color:#303030}
#cssminifier .box{margin:10px auto 30px;color:rgba(255,2255,255,.6);}
#cssminifier .box p{margin:0 0 2px}
#cssminifier button{cursor:pointer;}
#cssminifier .col{width:48%;margin:0 auto 30px}
#cssminifier .right{float:right;margin-right:1%}
#cssminifier .left{float:left;margin-left:1%}
#cssminifier .button-group{background:#2980b9;text-align:center;padding:20px 20px 40px 20px;margin:0;border-radius:0 0 5px 5px}
#cssminifier button,#cssminifier button[disabled]:active{background:rgba(255,255,255,0.2);text-align:center;color:#fefefe;display:inline-block;padding:6px 12px;font-size:14px;font-weight:400;line-height:1.471;border-radius:4px;margin:0 5px;border:0;transition:all .1s}
#cssminifier button:hover,#cssminifier button:active{background:#fff;color:#2980b9}
#cssminifier button[disabled],#cssminifier button[disabled]:active{background:#fff;}
#cssminifier .opt1,#cssminifier .opt2,#cssminifier .opt3,#cssminifier .opt4,#cssminifier .opt5{display:inline-block;margin:0 10px 0 0;vertical-align:middle;border:none;outline:none}
#cssminifier br{display:none}
</style>
<span class="clear"></span>
<textarea autofocus="" id="cssField" placeholder="قم بنسخ كود الـ CSS هُنا..." spellcheck="false"></textarea>
<div class="button-group">
<div class="box">
<input class="opt1" id="stripAllComment" type="checkbox" />
<label for="stripAllComment">Strip all comments</label>
<input class="opt2" id="superCompact" type="checkbox" />
<label for="superCompact">Super compact</label>
<input class="opt3" id="betterIndentation" type="checkbox" />
<label for="betterIndentation">Keep indentation</label>
<input checked="" class="opt4" id="keepLastComma" type="checkbox" />
<label for="keepLastComma">Remove the last semicolon</label>
</div>
<button onclick="compressCSS(&quot;cssField&quot;);">ضغط الأكواد</button>
<button onclick="clearField(&quot;cssField&quot;);">مسح الأكواد</button>
<button onclick="selectAll(&quot;cssField&quot;);">نسخ الأكواد</button>
</div>
<div class="clear">
</div>
<script type="text/javascript">
function get(e){return document.getElementById(e)}function highlightCode(e){if(hc.checked){var a=e.innerHTML;a=a.replace(/\{([\s\S]+?)\}/g,function(e){return e.replace(/\'(.*?)\'/g,"<span class='st'>'$1'</span>").replace(/\"(.*?)\"/g,"<span class='st'>\"$1\"</span>").replace(/(\{|\n|;)?(.[^\{]*?):(.[^\{]*?)(;|\})/g,"$1<span class='pr'>$2</span>:<span class='vl'>$3</span>$4").replace(/<span class='pr'>\{/g,"{<span class='pr'>")}),a=a.replace(/&lt;(.*?)('|")(.*?)('|")&gt;/g,function(e){return e.replace(/'(.*?)'/g,"<span class='vl'>'$1'</span>").replace(/"(.*?)"/g,"<span class='vl'>\"$1\"</span>")}),a=a.replace(/\{([\s\S]+?)\}/g,function(e){return e.replace(/([\(\)\{\}\[\]\:\;\,]+)/g,"<span class='pn'>$1</span>").replace(/\!important/gi,"<span class='im'>!important</span>")}),a=a.replace(/\/\*([\w\W]+?)\*\//gm,"<span class='cm'>/*$1*/</span>"),e.innerHTML="<code>"+a+"</code>",hr.style.display="block",rt.style.display="block"}else hr.style.display="none",rt.style.display="none"}function compressCSS(e){var a=get(e),c=/@(media|-w|-m|-o|keyframes|page)(.*?)\{([\s\S]+?)?\}\}/gi,n=a.value,t=n.length;n=sa.checked||sc.checked?n.replace(/\/\*[\w\W]*?\*\//gm,""):n.replace(/(\n+)?(\/\*[\w\W]*?\*\/)(\n+)?/gm,"\n$2\n"),n=n.replace(/([\n\r\t\s ]+)?([\,\:\;\{\}]+?)([\n\r\t\s ]+)?/g,"$2"),n=sc.checked?n:n.replace(/\}(?!\})/g,"}\n"),n=bi.checked?n.replace(c,function(e){return e.replace(/\n+/g,"\n ")}):n.replace(c,function(e){return e.replace(/\n+/g,"")}),n=bi.checked&&!sc.checked?n.replace(/\}\}/g,"}\n}"):n,n=bi.checked&&!sc.checked?n.replace(/@(media|-w|-m|-o|keyframes)(.*?)\{/g,"@$1$2{\n "):n,n=cm.checked?n.replace(/;\}/g,"}"):n.replace(/\}/g,";}").replace(/;+\}/g,";}").replace(/\};\}/g,"}}"),n=n.replace(/\:0(px|em|pt)/gi,":0"),n=n.replace(/ 0(px|em|pt)/gi," 0"),n=n.replace(/\s+\!important/gi,"!important"),n=n.replace(/(^\n+|\n+$)/,""),a.value=n,hr.innerHTML="/* "+(t-n.length)+" of "+t+" unused characters has been removed. */\n"+n.replace(/</g,"&lt;").replace(/>/g,"&gt;"),highlightCode(hr)}function clearField(e){var a=get(e);a.value="",a.focus()}function selectAll(e){get(e).focus(),get(e).select()}var hc=get("highlightCode"),sa=get("stripAllComment"),sc=get("superCompact"),cm=get("keepLastComma"),bi=get("betterIndentation"),bs=get("breakSelector"),tt=get("toTab"),to=get("tabOpt").getElementsByTagName("input"),sb=get("spaceBetween"),ip=get("inlineSingleProp"),rs=get("removeLastSemicolon"),il=get("inlineLayout"),si=get("singleBreak"),hr=get("highlightedResult"),rt=document.getElementsByTagName("h2")[1];
</script>
 </div>[/code]

لا تنسوا مشاركة الموضوع إن أعجبكم و ترك تعليق عن تجربتكم في تطبيقه .

اذا كانت لديك اية اسئلة فقط اخبرنا في قسم التعليقات في الاسفل

اذا كانت لديك مشكلة ضعها في قسم التعليقات في الاسفل 
واذا كانت لديك اية مشكلات او شي خارج الموضوع تريد الاستفسار عنه يمكنك الذهاب لركن الاسئلة والسؤال هناك

واذا كانت لديك طلبات او شي من هذا القبيل يمكنك الذهاب لصفحة اتصل بنا 
اما اذا اردت ان تجد صفحة معينة يمكنك الذهاب لصفحة الفهرس 
او اذا اردت ان تقدم دعما لنا فرجاء اذهب لسجل الزوار 
اذا كان اي رابط من روابط المدونة لاتعمل فرجاء ابلغنا من هنا


انتهى نرجوا منكم مشاركة الموضوع  

اذا اردت ان تضيف كود في التعليقات فقط قم بتحويله هنا
فقط ضع الكود المراد وضعه في التعليقات وقم بالظغط على تحويل وقم بنسخه واضفه في التعليق