Kategori arşivi: Css

CSS ~ Kısaltmalara Açıklama Satırı Ekleme

datarar

Sitenizde kısaltmaları çok kullanıyorsanız, ziyaretçilerin olaya yabancı kalmamaları amacıyla hoş görünümlü bir bilgi kutucuğu sunmak iyi olacaktır ve SEO açısından da oldukça yararlı bir yöntem olduğunu söylemem gerekiyor. Az kelime, çok detay 🙂 Buna “Acronym” diyenlerde var belki böyle duymuşsunuzdur İngilizce kısaltma demek zaten kendisi de 🙂

Sayfanızdaki görüntü şekli böyle bir şeyler oluyor: WP, SEO veya başka bir örnek daha CSS şeklinde 🙂 Nasıl olacak kısmına gelirsek 🙂

.css içine eklemeniz gereken kod:

Yazı içinde kullanım şekli :

bu kadar 🙂 siz temanızın rengine göre alt çizgi rengini değiştirebilirsiniz (#111 yazan kısım) tercih meselesi artık 🙂

WP ~ Eklentilerin Gereksiz Kodlarını Kaldırma

WordPress temalarında header.php kısmında vardır. Bu head ile WordPress’teki bazı .js, .css kodları içeriye aktarılır. Fakat bizim de kendi kütüphanelerimiz olduğundan ve onlara ihtiyacımız olmadığı için bu kodlar sadece siteyi yavaşlatmasıyla kalmaz fazladan bağlantı çağırışından dolayı site değerlendirmesini de düşürür.

Aşağıdaki kodlarla şuan örnek olarak WP-RecentComments, CodeColorer, Captcha ve Contact-Form eklendilerinin .js ve .css kodlarını kaldıracağız bunun sayesinde fazla css ve js sorgusundan kurtulmuş olacağız ve kodlarda istemediğimiz bir yer varsa da kaldırma imkanına sahip olabileceğiz bu sayede.

Öncelikle şu konuda uyarmam gerekiyor aşağıdaki kodları kullanmadan önce kaldırdığınız kodların içinde yer alan işinize yarayacak css ve js kod kısımlarını kendi css ve js dosyanıza atmanız gerekmektedir…

CodeColorer, Captcha, WP-RecentComments ve Contact-Form eklentilerinin kaldırılması için gerekli kodumuz aşağıdaki gibi olmalıdır bunu functions.php (Tema İşlevleri) içinde en alta attığımızda kodlar çalışacaktır ve sayfa kaynağına bakıldığında görülecektir ki eklentilere ait .css ve .js kodları siteden kalkmış olacaktır.

bu kodu kendi sitenize göre uyarlayabilirsiniz kaldırmak istediğiniz;
.css kodları için wp_deregister_style
.js kodları için ise wp_deregister_script
kullanmanız arkasındanda css veya js dosyasının ismini parantez içindeki alana yazmanız yeterli olacaktır 🙂

Kodumuzda gördüğünüz gibi if() (eğer) yapısı kullandım.Bu yapıyla eğer sayfa “İletişim” sayfasının dışında ise iletişim formunun dosyalarını sayfa kodlarına eklemeyecekdir. Sonra fonksiyona devam ederek CodeColorer, Captcha’in css dosyalarını en sonda WP-RecentComments .js dosyasını kaldırdım.

Yukarıdaki kod örnek koddur yazıyı okumadan sitenize eklemeyiniz 🙂

WP ~ Kategorileri İkiye Bölme

WordPress kategorileri çok fazla olan kullanıcılar bu kategorileri iki ayrı sütunda göstermek isteyebilir aşağıdaki kodlar bu kullanımı sağlayacaktır. Aşağıdaki açıklamaları okuyup kodları kategorileri göstermek istediğiniz yere ekleyiniz 🙂

Aşağıdaki kodla alt ve üst kategoriler, alfabetik olarak iki ayrı sütunda sıralar. İstediğimiz bu sonuca ulaşmak için aşağıdaki kodu kullanıyoruz…

Aşağıdaki bu kodla ise sadece üst kategorileri alfabetik olarak iki ayrı sütunda sıralar. İstediğimiz bu sonuca ulaşmak için aşağıdaki kodu kullanıyoruz…

Her iki durumda aşağıdaki kodları da stil dosyanıza eklediğinizde işiniz bitmiş olacaktır.

Html Renk Kodlari

Aşağıda html kodlarda kullandığımız renk kodları önizlemeleriyle birlikte verilmiştir… Renkli paylaşımlarda bulunmanız dileğiyle 🙂


HTML Kodu Renk
#FFFFFF
#FFFFCC
#FFFF99
#FFFF66
#FFFF33
#FFFF00
#FFCCFF
#FFCCCC
#FFCC99
#FFCC66
#FFCC33
#FFCC00
#FF99FF
#FF99CC
#FF9999
#FF9966
#FF9933
#FF9900
#FF66FF
#FF66CC
#FF66CC
#FF6666
#FF6633
#FF6600
#FF33FF
#FF33CC
#FF3399
#FF3399
#FF3333
#FF3300
#FF00FF
#FF00CC
#FF0099
#FF0066
#FF0033
#FF0000
HTML Kodu Renk
#CCFFFF
#CCFFCC
#CCFF99
#CCFF66
#CCFF33
#CCFF00
#CCCCFF
#CCCCCC
#CCCC99
#CCCC66
#CCCC33
#CCCC00
#CC99FF
#CC99CC
#CC9999
#CC9966
#CC9933
#CC9900
#CC66FF
#CC66CC
#CC6699
#CC6666
#CC6633
#CC6600
#CC33FF
#CC33CC
#CC3399
#CC3366
#CC3333
#CC3300
#CC00FF
#CC00CC
#CC0099
#CC0066
#CC0033
#CC0000
HTML Kodu Renk
#99FFFF
#99FFCC
#99FF99
#99FF66
#99FF33
#99FF00
#99CCFF
#99CCCC
#99CC99
#99CC66
#99CC33
#99CC00
#9999FF
#9999CC
#999999
#999966
#999933
#999900
#9966FF
#9966CC
#996699
#996666
#996633
#996600
#9933FF
#9933CC
#993399
#993366
#993333
#993300
#9900FF
#9900CC
#990099
#990066
#990033
#990000

Okumaya devam et