lenas egna » tema http://lena.smuligt.com trial & error Wed, 08 Feb 2012 14:23:16 +0000 en hourly 1 http://wordpress.org/?v=3.2.1 mot html5: del 1 http://lena.smuligt.com/2011/08/06/mot-html5-del-1/ http://lena.smuligt.com/2011/08/06/mot-html5-del-1/#comments Sat, 06 Aug 2011 11:03:25 +0000 Lena http://lena.smuligt.com/?p=2358 Det här är alltså början till ett nytt tema. Helt utan tema kan inte WP köras, så jag har skapat ett nytt tema i dess allra enklaste form. I katalogen /wp_contents/themes/ har jag gjort en ny temakatalog som jag kallade ”mitt-tema” (kan heta vad som helst, men undvik mellanslag och håll dig till tecknen a-z, A-Z, 0-9, _ och – i namnet, det bör man för övrigt alltid göra med katalog- och filnamn som ska leva på webben för att undvika problem). I min temakatalog finns två filer, style.css och index.php, dessa två är nödvändiga för ett tema, men kommer så småningom att få sällskap med många fler.

style.css

Stilmallen innehåller i nuläget inga stilregler över huvud taget, endast den rad som definierar själva temat för WP-motorn.

/*
Theme Name: Mitt HTML5-tema
*/

Man kan lägga in mer information än bara tema-namnet om man vill, men ska man bara ha det för eget bruk räcker det så. Informationen skrivs som en kommentar, vilket i css görs mellan /* och */

index.php

Allt som skrivs mellan <?php och ?> är alltså php-kod, och består så här långt enbart av anrop till färdiga wp-funktioner. Exakt vad dessa gör kan man hitta i WordPress Codex (en sida som jag alltid har öppen som referensverk, det finns ingen möjlighet att lära sig allt utantill). De allra flesta finns under Template Tags, några får man använda sökfunktionen för att hitta.

Jag har gjort filen så enkel som möjligt och bara tagit med det allra nödvändigaste, så att själva inläggen ska synas och det ska gå att kommentera, men samtidigt använt de nya HTML5-elementen.

<!DOCTYPE html>
<html <?php language_attributes(); ?>>
<head>
	<meta charset="<?php bloginfo('charset'); ?>" />
	<title>Lenas egna - Trial & error</title>
	<link rel="stylesheet" type="text/css" src="<?php bloginfo('stylesheet_url'); ?>" />
	<?php /* Funktionsanropet wp_head() ska alltid finnas allra sist före </head>! */ ?>
	<?php wp_head(); ?>
</head>
<body>
	<header>
		<hgroup>
			<h1><?php bloginfo('name'); ?></h1>
		</hgroup>
	</header>
	<?php /* Hämta inlägg: The Loop */ ?>
	<?php while(have_posts()) : the_post(); ?>
	<article>
		<header>
			<h2><a href="<?php the_permalink(); ?>" rel="bookmark" title="<?php the_title(); ?>"><?php the_title(); ?></a></h2>
			Postat i <?php the_category(); ?>
			<time pubdate="pubdate"><?php the_date(); ?></time>
			<?php comments_number(); ?>
		</header>
		<?php the_content(); ?>
		<footer>
			<?php the_tags('Taggar: '); ?>
		</footer>
	</article>
	<?php if(is_single()) : ?>
		<ol class="commentlist">
			<?php comments_template(); ?>
		</ol>
		<?php comment_form(); ?>
	<?php endif; ?>
	<?php /* Avsluta The Loop */ ?>
	<?php endwhile; ?>
	<nav>
		<?php next_posts_link(); ?>
		<?php previous_posts_link(); ?>
	</nav>
	<?php /* Funktionsanropet wp_footer() ska alltid finnas allra sist före </body>! */ ?>
	<?php wp_footer(); ?>
</body>
</html>

HTML5-element som används:

  • header Definierar inledningen av ett dokument eller en sektion, kan innehålla t ex navigation och rubriker
  • hgroup En grupp av h-taggar (<h1> till <h6>), där lägsta siffran är huvudrubrik och övriga underrubriker
  • article Enligt w3.org ska article egentligen användas för att definiera externt innehåll, men verkar i praktiken användas till just det som det låter som: en artikel eller en bloggpost
  • time Definierar datum och/eller tid (attributet pubdate talar om att det handlar om publiceringsdatum)
  • nav Definierar navigering
  • footer Definierar antingen en sidfot, eller foten på en sektion, t ex en article

Anm 1: Jag har skrivit in sidans namn i title-taggen. Det ska man inte göra, man ska använda sig av ett funktionsanrop istället (samma tema ska kunna användas till en annan wp-installation, eller du ska kunna byta namn på bloggen utan att behöva ändra i filerna). Men jag vill inte använda standardfunktionen utan istället skriva en egen funktion för att göra den mer sökmotorvänlig, så det får vara så länge. Om du vill anropa standardfunktionen ska title-taggen se ut så här:

<title><?php bloginfo('name'); ?></title>

Anm 2: Jag har avinstallerat alla plugins också, för att ingen sådan ska lägga sig i hur saker och ting uppför sig. Med ett undantag: en plugin som gör det möjligt att visa kod i inläggen.

HTML5 handlar alltså väldigt mycket om semantik. Och man har på ett sätt tagit till sig det som varit praxis bland webbutvecklare och gjort till standard. Det har varit väldigt vanligt under många år att man lagt t ex en headerbild, sidans rubrik och en navigation inom en div-tagg med id=”header”. Nu blir det ett eget element istället.

Nästa steg blir att lägga till såpass med stilregler att det blir lite mer läsvänligt. Det här är inte så kul.

]]> http://lena.smuligt.com/2011/08/06/mot-html5-del-1/feed/ 0 mot html5 http://lena.smuligt.com/2011/08/04/mot-html5/ http://lena.smuligt.com/2011/08/04/mot-html5/#comments Thu, 04 Aug 2011 08:03:50 +0000 Lena http://lena.smuligt.com/?p=2345 Att jobba med webb är lite stressande faktiskt. Att försöka hänga med i svängarna är inte helt lätt när utvecklingen går så rasande snabbt. De senaste sajterna jag gjort är, trots att de är nya, redan omoderna. Inte för att det kanske gör så mycket, det handlar ju inte om att de är byggda i frames och med animerade giffar som dekoration, de är inte omoderna på det viset. Men med modernare teknik hade jag kunnat göra mer, och de hade förhoppningsvis kunnat ge en bättre användarupplevelse.

Men jag har helt enkelt inte hunnit med. Medan jag har kämpat med att lära mig AJAX-tekniken skapligt, och dessutom stuckit emellan lite med att experimentera lite med Android-appar (och sånt här sker alltså mest ”vid sidan om”, på lediga stunder), har HTML5 raskt tågat in på webben. Visserligen lär det inte bli den fastslagna standarden förrän 2014, läste jag häromdagen, men används redan nu i stor utsträckning och stöds av flera av de stora webbläsarna. (Inte helt oväntat ligger t ex IE en hel del efter t ex Chrome, FF och Safari.)

Nu har jag de senaste dagarna läst på en del om HTML5, och känner att jag måste testa och experimentera för att lära mig. Normalt sett brukar jag göra sådant för mig själv på min egen dator, och brukar resultera i att jag sjunker in i det och försvinner för omvärlden under tiden, men igår fick jag en idé. Jag gör det här på min egen blogg istället, in public och live! Och så skriver jag om vad jag gör under tiden. Inte som en tutorial precis, eftersom jag lär mig själv under tiden, men det kanske kan hjälpa andra ändå om jag bemödar mig om att skriva på vanlig svenska utan alltför mycket fackuttryck. Det mesta jag läser för att lära mig är både på engelska och fackspråk, och är kanske obegripligt för de flesta. Förvänta er ingen nybörjarguide bara, det kommer att krävas förkunskaper både när det gäller HTML och CSS och förmodligen också lite grundläggande kännedom om WordPress.

Från och med nu kommer alltså bloggen (med ojämna mellanrum) att genomgå förändringar. Jag kommer att börja med att klä av den helt och hållet, och sedan steg för steg bygga upp ett nytt tema runt den, ett tema som förhoppningvis tar vara på alla (de flesta) möjligheterna med både det nya WP och HTML5.

Det kan bli kul (och det är för min del inte bara för nöjes skull, det är fortbildning) det här! Ett problem kan vara att jag inte har rätt sorts publik, i den mån jag över huvud taget har några läsare kvar efter mitt magra bloggande det senaste året så är kanske inte detta önskeläsningen… Men jag kan nog blogga om annat också emellanåt.

]]> http://lena.smuligt.com/2011/08/04/mot-html5/feed/ 1 plötsligt så händer det… http://lena.smuligt.com/2011/07/10/plotsligt-sa-hander-det/ http://lena.smuligt.com/2011/07/10/plotsligt-sa-hander-det/#comments Sun, 10 Jul 2011 06:04:11 +0000 Lena http://lena.smuligt.com/?p=2306 Det hade ni inte trott, va?

Inte jag heller. Men plötsligt blev behovet påträngande. Inte av bloggskrivlust egentligen, man får nog ur sig det mesta av ordbajsnödigheten på FB (förbannade FB) kantänka. Det var mer själva bloggmekandet som drog. Den sista tidens webberier har bara handlat om WordPress, och lusten att prova på tekniker jag inte hunnit lära mig i kombination med alla nya möjligheter som kommit med WP 3.1 och nu häromdagen 3.2 har exploderat. Men eftersom man inte kan go crazy hur mycket som helst i experimenterandet på sajter som ska tjäna någon form av publikt syfte, tager man sin egen.

Så här är den nu, lenas egna i nya kläder. Ett färdigt tema den här gången, Oenology. Jag använde det till Rottis-SM-sajten, och blev förtjust i det dels för flexibiliteten – det är lätt att göra om på alla möjliga vis, dels för att det tar tillvara alla nya och lite webbnördiga features som WP numera har. Det klämmiga tilläggsnamnet jag la till; trial&error, känns för övrigt ganska passande. Det är ju det jag håller på med mest hela tiden.

Tja, vi får väl se om nya kläder och alla nördiga finesser gör att bloggeriet tar fart igen. Jag säger inget, så har jag ingenting sagt. Men 8, ÅTTA! blogginlägg på ett år är ju katastrof. Blir det inte en kraftig uppryckning kan jag ju lika gärna lägga ner.

]]> http://lena.smuligt.com/2011/07/10/plotsligt-sa-hander-det/feed/ 1 nu kör vi naket http://lena.smuligt.com/2009/04/09/nu-kor-vi-naket/ http://lena.smuligt.com/2009/04/09/nu-kor-vi-naket/#comments Wed, 08 Apr 2009 22:20:49 +0000 Lena http://lena.smuligt.com/?p=1473 Nikke ville att fler skulle hänga på och fira CSS Naked Day. Och varför inte?

naked-day-09-150x46

Jag hade tänkt skriva mer om det här, men det är nåt vajsing med uppkopplingen som visserligen fungerar men bara halvbra, och jag har läst och letat och letat igen och slutligen kommit fram till att det finns något som heter MTU (som jag aldrig hört talas om innan), som man möjligen kan ändra lite på vid den här typen av problem. Sen fick jag läsa och leta och leta ännu mer, innan jag hittade någorlunda bra instruktioner till hur man skulle gå tillväga. Jag drog ett djupt andetag och skulle börja (det är läskigt när man inte har en aning om vad man gör egentligen), när jag läste raden om Windows Vista. Har man det så rekommenderas man att hålla fingrarna borta från MTU-inställningarna. Vista skötte det bäst själv (och nej, det var inte Microsoft som påstod det).

Ja, så här sitter jag med min fortfarande halvtaskiga uppkoppling. Och nu orkar jag inte skriva det jag tänkt om CSS Naked Day, använd länkarna istället och läs där. Men det är alltså inte något fel som är trasigt här, det är bara strippat. Det blir tillbaka till ordningen med mitt nya coooola tema igen så snart den 9 april är till ända.

Well. Nu ska jag se om den halvtaskiga uppkopplingen vill låta mig göra en liten ftp-överföring så att jag kan genomföra själva stripteasen…

CSS Naked Day

CSS Naked Day

Påklätt igen.
Så här såg det ut.

]]> http://lena.smuligt.com/2009/04/09/nu-kor-vi-naket/feed/ 3 it's all new! http://lena.smuligt.com/2009/04/08/its-all-new/ http://lena.smuligt.com/2009/04/08/its-all-new/#comments Wed, 08 Apr 2009 06:10:31 +0000 Lena http://lena.smuligt.com/?p=1459 Hejåhå, det råkade visst bli ett nytt tema. Igen. Och den här gången har jag gjort precis alltihop själv. Jag har verkligen försökt gå igenom varenda detalj så att det ska stämma överens, men jag har säkert missat något ändå, så upptäcker du något som ser fel ut, säg till! Om du inte har IE6, då får du faktiskt ta och uppgradera istället. Det är hög tid och det är av många skäl inte ok att använda det längre.*

Den där header-bilden med alla orden är praktiskt för den som inte ids läsa mina inlägg. Den kan ses som en snabbsammanfattning över vad jag skrivit de senaste dagarna. Oerhört smart. Och vädret kommer förstås från norska yr.no, som välvilligt delar med sig av sina prognoser, att användas av den som vill och som kan en smula om webbprogrammering.

Dagen till ära bjuder jag på lite bilder från skogsturen i förra veckan.

* Jag har testat temat i FF3, IE7, IE8 och Google Chrome, alltsammans på PC/Vista, kan du säga om det ser ok ut eller inte på andra någorlunda moderna operativ/webbläsare så är det välkommet.

]]> http://lena.smuligt.com/2009/04/08/its-all-new/feed/ 10 jag fastnade http://lena.smuligt.com/2009/04/05/jag-fastnade/ http://lena.smuligt.com/2009/04/05/jag-fastnade/#comments Sun, 05 Apr 2009 21:40:48 +0000 Lena http://lena.smuligt.com/?p=1448 Igår kväll fick jag för mig att jag skulle pröva en grej till bloggen. Inget nödvändigt, mest lite kul. Tycker jag då. Och tro inte att det var nån färdig plugin eller så, oneeej då, den krävde ganska mycket tankeverksamhet och experimenterande och kodande, och så en väldig massa pill innan jag fick resultatet att se ut precis som jag ville. Och då passade det inte i det här temat. Eftersom jag ändå hade ett par idéer för teman skramlande i bakhuvudet, så kunde jag inte låta bli… Jag satt till framåt morgonkvisten, rätt många timmar idag har jag fortsatt, och om jag gör lite mer kaffe nu så kan det nog bli klart innan jag lägger mig.

Kanske. För det är alltid mer än man tror, när man klickar runt för att kolla så kommer man rätt som det är till någon arkivsida som man glömt och som inte stämmer med resten. Eller också glömmer man kolla hur kommentarsformuläret ser ut när man inte är inloggad… Eller något annat. Men jag ska försöka.

Och det här var verkligen inte vad jag tänkt ägna så stora delar av helgen åt. Men jag har lärt mig en del som jag inte kunde innan, så det är lite nytta också, inte bara nöje. Förresten om så vore, varför skulle jag ha dåligt samvete och urskulda mig för att jag ägnat mig åt enbart nöje en helg?

]]> http://lena.smuligt.com/2009/04/05/jag-fastnade/feed/ 0 sugen är återfunnen http://lena.smuligt.com/2009/03/23/sugen-ar-aterfunnen/ http://lena.smuligt.com/2009/03/23/sugen-ar-aterfunnen/#comments Mon, 23 Mar 2009 19:22:26 +0000 Lena http://lena.smuligt.com/?p=1374 Jag började om med Sandras tema sen igår kväll, och höll på så länge jag orkade hålla ögonen öppna. Förmodligen lite efter det också, att döma av alla fel jag fick rätta till idag. Jag hade ju tänkt ha det klart så det skulle finnas på plats på morgonen, men det sprack lite. Tur att det är kul att bygga tema i alla fall. Faktiskt himla kul. Så kul att jag nu blev sugen på att bygga ett åt mig också… Igen. Jag är visserligen himla nöjd med det jag har, men ändå. Det är roligare om man gjort det själv.

Jag ska inte göra något nytt tema. Inte nu. Nej. Men jag har lite lösa idéer hängande, och om jag inte testar lite så kommer jag kanske att glömma bort dom? Och jag vet ju inte ens om det är särskilt goda idéer om jag inte testar, eller hur?

]]> http://lena.smuligt.com/2009/03/23/sugen-ar-aterfunnen/feed/ 0 murphy på besök http://lena.smuligt.com/2009/03/22/murphy-pa-besok/ http://lena.smuligt.com/2009/03/22/murphy-pa-besok/#comments Sun, 22 Mar 2009 16:09:33 +0000 Lena http://lena.smuligt.com/?p=1370 Jag hade lagt ner ganska många timmar på Sandras tema, och kände mig rätt nöjd. Inte så hemskt mycket detaljer återstod att fixa, och jag räknade med att få det klart ikväll. Så tryckte jag ctrl+z (som är tangentkommando för ”ångra”) några gånger för att backa tillbaka lite i ändringar jag gjort i en fil. Jag höll ögonen på raden i filen som jag ville att ändringsstegen skulle komma tillbaka till, det gick åt lite fler steg än jag trodde och när jag lyfte blicken en aning upptäckte jag att andra filer jag haft öppna hade stängts… inte bara stängts visade det sig, utan raderats! Däribland css-filen. För den icke insatta är det den filen som styr i stort sett allt i utseendet, färger, fonter, bakgrunder, kantlinjer, allt! Och av arbetet jag lagt ner var väl ungefär 98% gjort i den filen… Jag fattar verkligen inte hur det kunde gå till.

Inte utan att jag tappade sugen lite.

]]> http://lena.smuligt.com/2009/03/22/murphy-pa-besok/feed/ 2 så kan man fira! http://lena.smuligt.com/2009/03/08/sa-kan-man-fira/ http://lena.smuligt.com/2009/03/08/sa-kan-man-fira/#comments Sun, 08 Mar 2009 12:38:05 +0000 Lena http://lena.smuligt.com/?p=1320 Man kan fira med ett nytt tema. Det var egentligen Sandra som skulle ha ett, och det fixade jag sent igår kväll. Men det hon valt visade sig vara inte så himla bra, det var inte särskilt välbyggt och kräver en hel del fix om hon ändå vill ha det. Jag avvaktar besked i frågan, och bytte tema åt mig själv istället. Det är gjort av Jonk, jag hittade det tack vare att han också finns på Bloggy. Och så ska ett tema vara byggt! Mycket välgjort, det enda pysslet jag haft med det var att göra en logga som skulle passa i headern, vilket i och för sig blev ett väldigt pysslande och experimenterande.

Det återstår en sak… jag måste leta rätt på inloggningen till Google AdSense och ändra på färgerna. Jag kan ju inte ha lila annonser nu!

Annars tycker jag att det är fasligt snyggt, hoppas ni tycker detsamma. Och nu har jag äntligen trådade kommentarer igen!

]]> http://lena.smuligt.com/2009/03/08/sa-kan-man-fira/feed/ 7 jamensådärdå http://lena.smuligt.com/2008/11/17/jamensadarda/ http://lena.smuligt.com/2008/11/17/jamensadarda/#comments Mon, 17 Nov 2008 21:24:22 +0000 Lena http://lena.smuligt.com/?p=1058 Ja, det bidde ett nytt tema. Det var inte riktigt meningen, jag skulle bara fixa några smågrejer i det andra som jag inte var riktigt nöjd med, och så kom jag på ett par grejer till och sen fick jag några idéer som var för mycket för att genomföra som ändringar så då blev det ett nytt. Jag vill hellre ha flytande bredd på sidan än fast. Och jag ville också ändra layouten så att innehållet blir så synligt som möjligt, och inte tryckas ner av en fet headerbild. Det var vad jag ägnade större delen av söndagen åt (och då hann jag ändå både dammsuga och torka golv och träna monsterhund).

Det gick ganska fort det här, jag tror att jag gått igenom alla delar så det ska fungera, men jag kan lika gärna säga det på en gång: jag har bara testat i Firefox, IE7 och Google Chrome, shame on me. Det är det jag har installerat och kan kolla enkelt, annat är krångligare. Så är det någon som har t ex IE6 eller Opera och ser något som verkar uppenbart fel, säg till! I IE7 fick jag förresten avstå en designmässig finess. Den gick att göra, men det blev helt enkelt fult. Det har ingenting med funktion att göra, det är helt enkelt bara snyggare i FF.

Förutom nytt tema så har jag äntligen tagit tag i några andra saker, ToDo-listan jag hade innan är borta! Enligt den skulle jag göra en länklista. Done. Och ja, det var ångest, det finns flera stycken som jag tvekade om och som jag faktiskt läser men kanske lite mera oregelbundet, och jag valde att begränsa mig till de jag faktiskt läser ofta. Jag skulle också göra en Om-sida. Done. Och så var det nåt om bilder… Jodå, det ska åtgärdas under kvällen det också.

Edit: Nu ser jag en sak jag glömt. Länkar längs ner till äldre inlägg… Jaja, ska bara ut med hundarna först.

]]> http://lena.smuligt.com/2008/11/17/jamensadarda/feed/ 0