Wordpress Tema Yapımı Bir Sorum Var

11-10-2019, 23:23:27

Merhaba arkadaşlar uzun zamandır bu iş il uğraşıyorum lakin aklıma takılan bir şey oldu ben farklı başlık stilleri sınırsız renkler vs yapıyorum ama css dosyalarına php kodu ekleyemediğimiz için normal olarak bu tür özellikleri ya headera yada satır içine style olarak yazmak zorunda kalıyorum buda hız araçlarında satır için kullanımı vs sorununu ortaya seriyor peki bu konuda önerebileceğiniz güzel bir yöntem yani bundan daha gelişmiş bir yöntem var mıdır yardımlarınızı bekliyorum

11-10-2019, 23:36:20

#2

EFY

Stil kodlarınızı Optimize bir harici css dosyasından çağırmanız en uygunu değil mi ?
Bir de cache kullanırsanız baya bir performans artışı elde edebilirsiniz.

12-10-2019, 00:00:18

#3

Misafir

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

Stil kodlarınızı Optimize bir harici css dosyasından çağırmanız en uygunu değil mi ?
Bir de cache kullanırsanız baya bir performans artışı elde edebilirsiniz.

Hocam dediğimi tam anlamadınız sanırım zaten öyle yapıyorum ama mesela başlık stili 1 başlık stili 2 bunları veya sınırsız renk için bunları tema panelinden ayar olarak veya bileşenden ayar olarak çektiğim için satır içine yazıyorum php kodlarıyla beraber kullanıyorum buda gtmetrix ve pagespeedde satır için css kullanımı sorununu ortaya seriyor bunun başka bir alternatif yöntemini soruyorum bu şekilde farklı stiller ve sınırsız renk özelliği için

12-10-2019, 00:46:14

#4

owuzan

Kullandığınız renkleri bir CSS değişkenine atayıp o renk kodunu kullandığınız bütün yerlere değişken adını yazabilirsiniz. Böyle her yere PHP kodu eklemek yerine sadece bir değişkeni değiştirerek her yeri değiştirmiş olabilirsiniz.
Örnek vermek gerekirse:
.class1 .class2 { background-color: #f73030; }
.class3 .class4 { background-color: #f73030; }
.class5 #id1 .class6:hover { background-color: #f73030; }
.class6 .class7 .class8 { background-color: #f73030; }

Böyle yapacağınıza şunu yapabilirsiniz:

.class1 .class2 { background-color: var(--veriable-name); }
.class3 .class4 { background-color: var(--veriable-name); }
.class5 #id1 .class6:hover { background-color:var(--veriable-name); }
.class6 .class7 .class8 { var(--veriable-name); }

Bu durumda sadece --veriable-name değişkeninin değerini değiştirmeniz yeterli olacaktır.

Başka bir yönteme de bunu dahil edersek PHP dosyasını <head> içerisinde include etmeniz gerekir. Ancak bu PHP dosyası CSS dosyası gibi algılanacak şekilde kodlamanız gerekir. Bu şekilde de satır içi CSS kodlarından kurtulmuş olursunuz.

12-10-2019, 01:06:03

#5

Misafir

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

Kullandığınız renkleri bir CSS değişkenine atayıp o renk kodunu kullandığınız bütün yerlere değişken adını yazabilirsiniz. Böyle her yere PHP kodu eklemek yerine sadece bir değişkeni değiştirerek her yeri değiştirmiş olabilirsiniz.
Örnek vermek gerekirse:
.class1 .class2 { background-color: #f73030; }
.class3 .class4 { background-color: #f73030; }
.class5 #id1 .class6:hover { background-color: #f73030; }
.class6 .class7 .class8 { background-color: #f73030; }

Böyle yapacağınıza şunu yapabilirsiniz:

.class1 .class2 { background-color: var(--veriable-name); }
.class3 .class4 { background-color: var(--veriable-name); }
.class5 #id1 .class6:hover { background-color:var(--veriable-name); }
.class6 .class7 .class8 { var(--veriable-name); }

Bu durumda sadece --veriable-name değişkeninin değerini değiştirmeniz yeterli olacaktır.

Başka bir yönteme de bunu dahil edersek PHP dosyasını <head> içerisinde include etmeniz gerekir. Ancak bu PHP dosyası CSS dosyası gibi algılanacak şekilde kodlamanız gerekir. Bu şekilde de satır içi CSS kodlarından kurtulmuş olursunuz.

Cevabınız için çok teşekkür ederim hocam

$stil = '<style type="text/css">';
$stil .= '
.header-2{
background: '.ot_get_option('h2bg-color').';
}
';
$stil .= '</style>';

Şunun gibi bir yapımı hocam