Google fontok használata WordPress sablonba

Publikálta időpont: 2011. március 17. csütörtök kategória: CSS - Nincs hozzászólás

Bizonyára sokan észrevették már, hogy egyre többen használnak egyedi fontokat weboldalukon. Ez azonban nem csak egy CSS beállítás. Ezt a technológiát hívjuk font-face-nek. Erről már szó volt a blogban és arról is hogy ezt a technológiát már teljesen böngészőfüggetlen megoldásként tudjuk kezelni és egyben ez a legjobb megoldás és minden bizonnyal ez is marad a az egyedi fontok megjelenítésére. Google már jó ideje megnyitotta a fonts directory-t. Tovább olvasás…

CSS reset

Publikálta időpont: 2010. január 17. vasárnap kategória: Megjelenítés - Nincs hozzászólás

Minden böngésző máshogy jeleníti meg az alapértelmezett html elemeket. Emiatt célszerű CSS resetet alkalmazni, amely segítségével, mondhatni nullázunk egyet és megtesszük az első lépést a cross browser felé. Én az alábbi resetet alkalmazom, amely elég sok fejfájástól mentett már meg.

html,body,div,ul,ol,li,dl,dt,dd,h1,h2,h3,h4,h5,h6,pre,form,p,
blockquote,fieldset,input,hr
{margin:0; padding:0;}
h1,h2,h3,h4,h5,h6,pre,code,address,caption,cite,code,em,strong,th
{font-size:1em; font-weight:normal; font-style:normal;}
ul,ol {list-style:none;}
fieldset,img,hr {border:none;}
caption,th {text-align:left;}
table {border-collapse:collapse; border-spacing:0;}
td {vertical-align:top;}

Média feltöltés – képek igazítása

Publikálta időpont: 2010. január 14. csütörtök kategória: Megjelenítés - 3 hozzászólás

Sablon fejlesztés során ügyelnünk kell arra, hogy minden a megszokott módon működjön, emiatt ajánlatos egy lorem ipsum pack-kal tesztelni, ekkor láthatjuk az előttünk álló problémákat. Ha fellép a kép igazítás probléma, akkor az alábbi kóddal megoldhatjuk ezt: Tovább olvasás…

Dinamikusan változó sablon stíluslap

Publikálta időpont: 2010. január 11. hétfő kategória: Megjelenítés, Plugin - Nincs hozzászólás

Amint már bevezetőmben említettem, egyes oldalakhoz más stíluslapot fogunk rendelni. Ennek a módja az alábbi WordPress blogunk esetében. Sablonunk functions.php fájljába illesszük az alábbi kódot:

add_filter( 'stylesheet_uri', 'my_stylesheet', 10, 2 );
function my_stylesheet( $stylesheet_uri, $stylesheet_dir_uri ) {

	if ( is_page( 'about' ) )
		$stylesheet_uri = $stylesheet_dir_uri . '/style-about.css';
	elseif ( is_page( 'portfolio' ) )
		$stylesheet_uri = $stylesheet_dir_uri . '/style-portfolio.css';

	return $stylesheet_uri;
}

Tovább olvasás…