Css Sıkıştırmak

18-10-2010, 23:54:38

Arkadaşlar sitemin cpu uçunca biraz araştırma yaptım gerekli düzenlemeri yaptım. Sadece şu css birleştirme ve sıkıştırma kaldı. Sitemde 3 eklentinin css. mevcut
1. Bunları nasıl birleştirecem?
2. Bunları nasıl sıkıştıracam

Aşağıdaki kod sitemim css. bunu nasıl sıkıştırabilirim teknik nedir?

/*

Theme Name: Popho Portal Teması V2
Version: 2.0
Author: Beyazıt Kölemen




*/





body {
    background-color: #F6F6F6;
    padding: 0px;
    margin: 0px;
    font-family: verdana, arial, "times new roman";
}



a



{



    text-decoration: none;



    color: #333333;



}

a:hover
{
    color: #257BA8;
    text-decoration: underline;
}


.icerik a



{



    text-decoration: none;



    color: #30A2E3;



}



.icerik a:hover



{



    text-decoration: underline;



    color: #30A2E3;



}



.enust {
    padding: 0px;
    margin: 0px;
}
ul.menu {
    margin: 0px auto 0px auto;
    padding: 4px 5px 9px 0px;
    width: 910px;
    background-image: url('resim/pophoalt.png');
    height: 21px;
    background-color: #F6F6F6;
}
ul.menu li a {
    text-decoration: none;
    color: #333333;
}
ul.menu li:hover a

{
    color: #000000;
}
ul.menu li {
    margin: 0px 5px 0px 5px;
    padding: 4px 10px 4px 10px;
    float: left;
    list-style-type: none;
    font-family: verdana;
    font-weight: normal;
    color: #808080;
    font-size: 12px;
    border-right-style: solid;
    border-right-width: 1px;
    border-right-color: #C0C0C0;
}



.logo {
    width: 900px;
    margin: 0px auto 0px auto;
    padding: 0px;
}



.logocan



{



    width: 432px;



    float: left;



}



.ustreklamcan



{
    width: 468px;
    float: left;
    vertical-align: middle;
}



.futir {
    margin: 0px auto 0px auto;
    padding: 5px 0px 5px 0px;
    clear: both;
}

.futiryazican



{
    padding: 5px;
    border-width: 1px;
    border-color: #EAEAEA;
    border-top-style: solid;
    width: 900px;
    margin: 0px auto 0px auto;
    font-family: verdana;
    font-size: 12px;
    text-align: center;
}



ul.altmenu {
    border-style: solid none solid none;
    border-width: 1px;
    border-color: #E8E8E8;
    padding: 0px;
    margin: 0px;
}
ul.altmenu li



{
    float: left;
    padding: 8px;
    margin: 0px;
    list-style-type: none;
    font-size: 13px;
    color: #666666;
}
ul.altmenu li.ilk



{
    float: left;
    padding: 8px;
    margin: 0px;
    list-style-type: none;
    font-size: 13px;
    background-color: #F8F8F8;
    font-weight: bold;
}







ul.altmenu li:hover



{



    background-color: #F8F8F8;



}



.altmenu {



    width: 900px;



    margin: 0px auto 0px auto;



    padding: 0px;



}



.domestos



{



    clear:both;



}

.ustarka {
    padding: 0px;
    margin: 0px auto 0px auto;
    width: 920px;
    background-image: url('resim/pophoust.png');
    background-repeat: no-repeat;
    height: 33px;
}

.ustalt {
    padding: 0px;
    margin: 0px auto 0px auto;
    width: 920px;
    background-image: url('resim/pophoalt.png');
    background-repeat: no-repeat;
    height: 37px;
}

.gelguzelimgel {
    padding: 0px 10px 0px 10px;
    margin: 0px auto 0px auto;
    width: 900px;
    background-image: url('resim/pophoarka.png');
    background-repeat: repeat-y;
}



.solagel {
    width: 580px;
    float: left;
    padding: 0px 20px 10px 0px;
    margin: 0px;
    font-size: 13px;
    font-family: arial, Helvetica, sans-serif;
    text-decoration: none;
}
.sagciolma {
    width: 300px;
    float: left;
    padding: 0px 0px 5px 0px;
    margin: 0px;
    font-family: verdana;
    font-size: 12px;
    color: #666666;
}



.sagciolma h2



{



    padding: 5px;



    margin: 0px;



    background-color: #F8F8F8;



    border-bottom-style: solid;



    border-bottom-width: 1px;



    border-bottom-color: #EAEAEA;



    font-family: Verdana;



    font-size: 12px;



}



.yazilar {
    background-position: top;
    border: 1px solid #EEEEEE;
    background-image: url('resim/arkagrad.png');
    background-repeat: repeat-x;
    -moz-border-radius: 5px;
    padding: 5px;
    margin: 0px 0px 10px 0px;
    line-height: 18px;
    font-family: verdana;
    color: #666666;
    font-weight: normal;
    font-size: 13px;
}
.yazilar h2


{
    margin: 0px 0px 5px 0px;
    padding: 8px 0px 8px 6px;
    font-family: tahoma;
    font-size: 22px;
    text-decoration: none;
    font-weight: normal;
    color: #333333;
    border-bottom-style: dashed;
    border-bottom-width: 2px;
    border-bottom-color: #EBEBEB;
}
.yazilar h2 a


{
    text-decoration: none;
    color: #333333;
}

.has2 {
    padding: 0px;
    margin: 0px;
}
.ayirac
{
    padding: 5px 0px 5px 0px;
    margin: 0px;
    background-position: center center;
    background-image: url('resim/ayirac.gif');
    width: 505px;
    background-repeat: no-repeat;
    height: 5px;
}
.bilgican {



    font-size: 12px;



    font-family: verdana;



    font-weight: normal;



    text-decoration: none;



    color: #666666;



}



.paylascan {



    font-size: 12px;



    font-family: verdana;



    font-weight: normal;



    text-decoration: none;



    color: #666666;







}



.sosyalimleme



{



    width: 160px;



    float: left;



    color: #333333;



}



.yazar



{



    width: 465px;



    float: left;



}



.yorumsayisi



{



    margin: 0px;



    background-position: left center;



    width: 80px;



    float: left;



    background-image: url('resim/yorum.gif');



    background-repeat: no-repeat;



    padding-left: 20px;



}







.yanmenu {

    border-style: none;

    padding: 0px;

    margin: 0px 0px 10px 0px;

}



.yanmenusirala {



    background-color: #FFFFFF;



    padding: 5px;



}



.yanmenu ul ul {
    border-style: none solid solid solid;
    border-width: 0px 1px 1px 1px;
    border-color: #E5E5E5;
    padding: 5px;
    margin: 0px 0px 10px 0px;
    background-color: #FFFFFF;
}

.yanmenu ul {

    border-style: none;

    padding: 0px;

    margin: 0px 0px 5px 0px;

}

.yanmenu li li {
    padding: 5px 0px 6px 5px;
    margin: 0px;
    border-bottom-style: dashed;
    border-bottom-width: 1px;
    border-bottom-color: #E8E8E8;
    list-style-type: none;
    list-style-position: inside;
    list-style-image: url('resim/resim.png');
}



.yanmenu li

{

    list-style-type: none;

}

.widget_categories
{
    clear: both;
    padding: 0px;
    margin: 0px;
}
.widget_categories ul
{
    border-style: none solid solid solid;
    border-width: 0px 1px 1px 1px;
    border-color: #E5E5E5;
    padding: 5px;
    margin: 0px 0px 10px 0px;
    background-color: #FFFFFF;
    clear: both;
    width: 288px;
    display: inline-block;
}
.widget_categories ul li
{
    border-style: none;
    padding: 5px 0px 5px 0px;
    margin: 0px;
    text-decoration: none;
    width: 140px;
    float: left;
    color: #333333;
    list-style-position: inside;
    list-style-image: url('resim/resim.png');
    list-style-type: none;
}
.widget_categories ul li a
{
    padding: 0px;
    margin: 0px;
}
.widget_categories li.cat-item a:hover
{
    color: #257BA8;
    text-decoration: underline;
}
.yanreklam {



    width: 125px;



    border: 1px solid #DBDBDB;



    padding: 2px;



    margin: 4px;



    float: left;



}



.reklam {



    margin: 0px auto 0px auto;



    width: 280px;



}



.yanmenu ul h2 {
    border: 1px solid #E5E5E5;
    padding: 5px 0px 5px 10px;
    margin: 0px;
    background-color: #F3F3F3;
    color: #333333;
    font-family: verdana;
    font-size: 12px;
    font-weight: bold;
}



.thumbcan {



    float: left;



    padding: 5px;



}
.thumbcan img
{
    padding: 2px;
    margin: 0px;
    border: 1px solid #EEEEEE;
    -moz-border-radius:8px;
}

.thumbcan img a
{
    border: 0px solid #EEEEEE;
}


.etican {
    padding: 8px;
    border: 1px solid #EEEEEE;
    background: #FFFFFF;
    margin-top: 3px;
    width: 562px;
    margin-bottom: 5px;
    -moz-border-radius: 5px;
}
.etican a
{
    text-decoration: none;
    color: #666666;
}


.paylasican {
    border: 1px solid #EEEEEE;
    background: #FFFFFF;
    padding-bottom: 2px;
    margin-top: 3px;
    width: 578px;
    margin-bottom: 5px;
    -moz-border-radius: 5px;
    text-align: center;
}
.paylasican li {
    padding: 5px;
    float: left;
    margin: 0 20px 0 0;
    overflow: hidden;
    display: inline;
    line-height: 25px;
    text-align: center;
}

.benzeryazilar {
    border: 1px solid #EEEEEE;
    padding-bottom: 2px;
    margin-top: 3px;
    width: 578px;
    margin-bottom: 5px;
    -moz-border-radius: 5px;
}

.benzeryazilar h2

{
    background: #FBFBFB;
    margin: 0px;
    padding: 5px;
    font-family: Verdana;
    font-size: 12px;
    font-weight: bold;
    color: #808080;
}

.benzeryazilar ul

{

    padding: 5px;

    margin: 0px;

    width: 550px;

}

.benzeryazilar li

{

    padding: 3px 0px 3px 0px;

    margin: 0px;

    float: left;

    width: 270px;

    list-style-position: inside;

    list-style-image: url('resim/resim.png');

    overflow: hidden;

    list-style-type: none;

}

.yorumlar {
    margin: 0px;
    padding: 5px;
    border: 1px solid #E2E2E2;
    width: 568px;
}



#commentform input {

    width: 170px;

    padding: 2px;

    margin: 5px 5px 1px 0;

    }



#commentform {
    margin: 5px 10px 0 0;
    font-family: verdana;
}

#commentform textarea {

    width: 100%;

    padding: 2px;

    }

#respond:after {

        content: "."; 

        display: block; 

        height: 0; 

        clear: both; 

        visibility: hidden;

    }

#commentform #submit {

    margin: 0 0 5px auto;

    float: right;

    }

/* End Form Elements */







.commentlist li, #commentform input, #commentform textarea {

    font: 0.9em 'Lucida Grande', Verdana, Arial, Sans-Serif;

    }

.commentlist li ul li {

    font-size: 1em;

}



.commentlist li {
    border: 1px solid #E2E2E2;
    font-weight: bold;
}



.commentlist li .avatar { 

    float: right;

    border: 1px solid #eee;

    padding: 2px;

    background: #fff;

    }



.commentlist cite, .commentlist cite a {

    font-weight: bold;

    font-style: normal;

    font-size: 1.1em;

    }



.commentlist p {

    font-weight: normal;

    line-height: 1.5em;

    text-transform: none;

    }



#commentform p {
    font-family: verdana;
}



.commentmetadata {

    font-weight: normal;

    }



.alt {

    margin: 0;

    padding: 10px;

    }



.commentlist {

    padding: 0;

    text-align: justify;

    }



.commentlist li {

    margin: 15px 0 10px;

    padding: 5px 5px 10px 10px;

    list-style: none;



    }

.commentlist li ul li { 

    margin-right: -5px;

    margin-left: 10px;

}



.commentlist p {

    margin: 10px 5px 10px 0;

}

.children { padding: 0; }



#commentform p {

    margin: 5px 0;

    }



.nocomments {

    text-align: center;

    margin: 0;

    padding: 0;

    }



.commentmetadata {

    margin: 0;

    display: block;

    }

/* End Comments */





acronym, abbr, span.caps{cursor:help}

acronym, abbr{border-bottom:1px dashed #999}

blockquote{margin:15px 30px 15px 10px; padding-left:20px; border-left:5px solid #ddd}

blockquote cite{margin:5px 0 0; display:block}

hr{display:none}

a img{border:none}

pre{border:solid 1px #9a9a9a; color:blue; margin:10px; padding:10px; background:#f3f2ed}

code{font-size:1.0em; color:#000}

span.date{background:url(images/date.gif) no-repeat; padding-left:20px}

span.comments{background:url(images/comment.gif) no-repeat; padding-left:20px; vertical-align:middle; display:block}

span.category{background:url(images/posted.gif) no-repeat; padding-left:20px}

img.centered{display:block; margin-left:auto; margin-right:auto}

img.alignright{padding:4px; margin:0 0 2px 7px; padding:4px; display:inline}

img.alignleft{padding:4px; margin:0 7px 2px 0; padding:4px; display:inline}

img{border:none}

.center{text-align:center}

.alignleft{float:left}

.alignright{float:right}

.clear{clear:both}

.allinfos{padding:5px 0px 5px 25px; background:#FFF8AF left no-repeat; font-size:11px; font-weight:bold; border-top:1px solid #e6e6e6; border-bottom:1px solid #e6e6e6}

.allinfos{background:#F2f2f2; padding:5px; margin-bottom:10px}

.allinfos a{color:#3B5998}

.spacer{clear:both}



.bozulmaamq

{

    padding: 0px;

    margin: 0px;

}
ol.commentlist { list-style:none; margin:0; padding:0; text-indent:0; }
ol.commentlist li {
    border: 1px solid #eee;
    height: 1%;
    margin: 0 0 10px;
    padding: 5px 7px 5px 57px;
    position: relative;
    -moz-border-radius: 8px;
    font-family: verdana;
    color: #333333;
}
ol.commentlist li.alt { }
ol.commentlist li.bypostauthor {}
ol.commentlist li.byuser {}
ol.commentlist li.comment-author-admin {}
ol.commentlist li.comment { }
ol.commentlist li div.comment-author { padding:0 170px 0 0; }
ol.commentlist li div.vcard {
    font: bold 12px/1.4 verdana;
}
ol.commentlist li div.vcard cite.fn { font-style:normal; }
ol.commentlist li div.vcard cite.fn a.url { color:#c00; text-decoration:none; }
ol.commentlist li div.vcard cite.fn a.url:hover { color:#000; }
ol.commentlist li div.vcard img.avatar { border:1px solid #ddd; padding:5px; left:7px; position:absolute; top:7px;-moz-border-radius: 5px; }
ol.commentlist li div.vcard img.avatar-32 {}
ol.commentlist li div.vcard img.photo {}
ol.commentlist li div.vcard span.says {}
ol.commentlist li div.commentmetadata {}
ol.commentlist li div.comment-meta { font:bold 10px/1.4 helvetica,arial,sans-serif; position:absolute; right:10px; text-align:right; top:5px;-moz-border-radius: 5px; }
ol.commentlist li div.comment-meta a { color:#333; text-decoration:none; }
ol.commentlist li div.comment-meta a:hover { color:#000; }
ol.commentlist li p { font:normal 12px/1.4 helvetica,arial,sans-serif; margin:0 0 1em; }
ol.commentlist li ul { font:normal 12px/1.4 helvetica,arial,sans-serif; list-style:square; margin:0 0 1em; padding:0; text-indent:0; }
ol.commentlist li div.reply { background:#fafafa; border:1px solid #ddd; color:#333; font:bold 9px/1 helvetica,arial,sans-serif; padding:5px 10px; text-align:center; width:50px;-moz-border-radius: 5px; }
ol.commentlist li div.reply:hover { background:#000; border:1px solid #444;-moz-border-radius: 5px; }
ol.commentlist li div.reply:hover a{ color:#fff; }
ol.commentlist li div.reply a { color:#333; text-decoration:none; text-transform:uppercase; }
ol.commentlist li ul.children { list-style:none; margin:1em 0 0; text-indent:0; }
ol.commentlist li ul.children li {  }
ol.commentlist li ul.children li.alt {}
ol.commentlist li ul.children li.bypostauthor {}
ol.commentlist li ul.children li.byuser {}
ol.commentlist li ul.children li.comment {}
ol.commentlist li ul.children li.comment-author-admin {}
ol.commentlist li ul.children li.depth-2 { margin:0 0 .25em; }
ol.commentlist li ul.children li.depth-3 { margin:0 0 .25em; }
ol.commentlist li ul.children li.depth-4 { margin:0 0 .25em; }
ol.commentlist li ul.children li.depth-5 {}
ol.commentlist li ul.children li.odd {}
ol.commentlist li.even { background:#fff; }
ol.commentlist li.odd { background:#fff; }
ol.commentlist li.parent { }
ol.commentlist li.pingback { }
ol.commentlist li.pingback.parent { }
ol.commentlist li.pingback div.vcard { padding:0 170px 0 0; }
ol.commentlist li.thread-alt { }
ol.commentlist li.thread-even {}
ol.commentlist li.thread-odd {}
.video {
    text-align: center;
    padding: 5px;
    margin: 0px;
    border-bottom-style: dashed;
    border-bottom-width: 1px;
    border-bottom-color: #C0C0C0;
}
.reklamresimleri img {
    padding: 2px;
    margin: 3px;
    border: 1px solid #E8E8E8;
}

18-10-2010, 23:57:38

#2

M y

yui compressor ile sıkıştırabilirsiniz. Birleştirme olayı ise html çıktınızda çağrılma sırasına göre tek bir dosyada alt alta koymaktan geçiyor.
19-10-2010, 00:04:13

#3

syf01

yemekim adlı üyeden alıntı: mesajı görüntüle

yui compressor ile sıkıştırabilirsiniz. Birleştirme olayı ise html çıktınızda çağrılma sırasına göre tek bir dosyada alt alta koymaktan geçiyor.

yui compressor bulamadım wp eklentisimi. Ben yukarda verğidim css. içine diğerlerinin css. mi yapıştıracam sonra header kısmından çağrılan adresi değiştirecem.
19-10-2010, 00:10:00

#4

M y

yui compressor java ile yazılmış bir program google araması ile bulabilirsiniz. eburhan diye bi arkadaşın yazdığı bi php sınıfı vardı. Php bilginiz varsa onu da kullanabilirsiniz.
19-10-2010, 00:15:14

#5

syf01

php bilgim yok ama şu programı karıştırim biraz
19-10-2010, 08:50:18

#6

se7en

Sıkıştırmak dediğiniz şey tam olarak nedir? Yani ne yapmak istiyorsunuz?

19-10-2010, 09:03:01

Ergün

Kimlik doğrulama veya yönetimden onay bekliyor.

body {
    background-color: #F6F6F6;
    padding: 0px;
    margin: 0px;
    font-family: verdana, arial, "times new roman";
}

Burdaki css kodlarini SIKISTIRMA olayi budur yani satirlari ve bosluklari aliyoruz

body { background-color: #F6F6F6; padding: 0px; margin: 0px; font-family: verdana, arial, "times new roman"; }

19-10-2010, 12:13:53

syf01

TekimNet adlı üyeden alıntı: mesajı görüntüle

body {
    background-color: #F6F6F6;
    padding: 0px;
    margin: 0px;
    font-family: verdana, arial, "times new roman";
}

Burdaki css kodlarini SIKISTIRMA olayi budur yani satirlari ve bosluklari aliyoruz

body { background-color: #F6F6F6; padding: 0px; margin: 0px; font-family: verdana, arial, "times new roman"; }

öylemi hocam aradaki boşluklarmı

manuelde yaparım onu o zaman

19-10-2010, 13:21:34

#9

rob33n

Kimlik doğrulama veya yönetimden onay bekliyor.

Css'i buraya verince sana optimize edip en iyi şekilde kullanabilmen için geri veriyor.
http://www.cleancss.com/