Utveckla snabbare i Wordpress | Grafix Studio

Snabba upp din utveckling i WordPress

Att utveckla hemsidor för WordPress är en väldigt givande process. I varje projekt så får du lära dig något nytt, allt efter kundens behov och önskemål. Det kan handla om att använda nya widgets, hacka functions.php som några av er säkerligen gör ofta eller anpassa nya plugins och använda de på ett sätt ingen annan har gjort tidigare.

I takt med att du bygger mer och mer hemsidor i verktyget WordPress så skapar du dig själv en rutin. Du blir bekväm med vissa funktioner och utnyttjar de ett flertal gånger. Dessutom så använder du samma program för att koda upp hemsidan och ladda upp den till FTP.

Jag tänkte tipsa om hur du kan snabba upp din utveckling av WordPresshemsidor och bli en mer produktiv webbutvecklare/webbdesigner på köpet. Dessa tips förutsätter att du redan har en design, så den biten går vi inte igenom här.

Spara ner alla viktiga funktioner

Det finns många funktioner som du måste använda och även en del som du personligen valt att använda efter egna preferenser. Ett exempel är WordPress loopen, den vitala delen av en WordPresshemsida. När du kodat är i skedet av att klistra in alla funktioner du tänkt använda på sidan ovanpå din HTML-kod så kan det vara besvärligt att leta upp funktionerna i WordPress Codex gång på gång. Spara istället ner allt i ett textdokument, redo att klistras in i din HTML-kod så fort du nått det stadiet i din utveckling.

Exempel på funktioner och anrop du bör ha redo att klistra in (ej fullständiga funktioner, bara namnet):

Header.php: <?php get_header(); ?>
Sidebar.php: <?php get_sidebar(); ?>
Footer.php: <?php get_footer(); ?>
Rubrik: <?=the_title()?>
Permalänk <?php the_permalink(); ?>
Action Hook Head: <?php wp_head();?>
Action Hook Footer: <?php wp_footer();?>
Post Thumbnail: <?php if ( has_post_thumbnail() ) { the_post_thumbnail(); }?>
Get Post Thumbnail: <?php the_post_thumbnail(array( 200,200 ), array( 'class' => 'alignleft' )); ?>
Menu: <?php wp_page_menu(); ?>
Titel: <?php if(is_home()) { echo 'Company Name'; } else { wp_title('') ;} ?>
Sökväg CSS: <?php bloginfo('stylesheet_url'); ?>
Sökväg Theme: <?php bloginfo('template_url'); ?>
Sökväg Hemsidan: <?php bloginfo('url'); ?>

..glöm inte heller The Loop, Register Sidebar och Enable Widget, bl.a.

Välj ett bra kodningsprogram

Kodningsprogrammet som du skriver din HTML,CSS och PHP är väsentligt för din produktivitet. Här i studion används Coda (Mac), vilket ger dig möjligheten att sitta och koda direkt mot server och samtidigt spara ner allting på plats. Att använda denna typ av kodningsprogram gör att du slipper ladda upp nya CSS och HTML filer via FTP när du sitter och tweaker din hemsidas design och funktion.

Coda Mac
Du får även en snygg överblick på alla hemsidor du valt att ta hand om direkt från programmet. Användarupplevelsen är på topp med andra ord…

FireBug – du har väl hört talas om FireBug?

FireBug låter dig kontrollera en hemsidas kod snabbt och enkelt genom att dra muspekaren över hemsidans olika element. Du ser snabbt vilken HTML-tagg det är samt vilken CSS-klass som är applicerad på den.

Firebug Firefox
Firefox FireBug
Det är rekommenderat att du använder Coda eller ditt val av kodningsprogram tillsammans med FireBug. Din produktivitet kommer öka efter du får en WYSIWYG upplevelse av din hemsida och dess kod samtidigt som att du kan utföra de riktiga ändringar i fönstret bredvid.

Hur kodar du och vilka program fungerar bäst i kombination för dig?

Fler inlägg om WordPress

http://www.facebook.com/pahlgren1 Peter Ahlgren
Riktigt bra läsning här. Fler såna inlägg tack.
http://cynatic.org Andreas Johansson
Bra tips men arbetar man i WordPress är en bra idé att bygga och sätta upp ett ”grundtema” med funktioner, widget-areas och generella temafiler som man sen enkelt kan bygga ett childtheme på. Detta snabbar upp väldigt mycket samt att man slipper klippa/klistra och bygga funktioner man redan byggt in 100 gånger innan ;)
Om man ska använda childthemes så är det bättre att använda bloginfo('stylesheet_directory'); för att hämta katalogen.
http://www.grafixstudio.se/ Antonio
Jo du har rätt. Har inte riktigt kommit in det här med Child Themes, ska ta en närmare titt på det och se om det fungerar för mig.
Men av någon anledning ser jag framför mig att det kan bli jobbigt att flytta runt på funktioner och element istället för att klistra in dem. Vet inte riktigt, kanske måste komma in i tänkandet bara…Kanske inte passar alla?
Mina designs kan bli lite olika, måste jag inte hålla mig inom någon ram om jag har ett grundtema och bygger childthemes för det?
http://cynatic.org Andreas Johansson
Du lägger mer tid på att bygga css än vad du gör på att bygga php för (medel-) siten du bygger. Vad man i princip gör är att sätta upp css-mall, sid-element och funktioner i functions.php samt definierar widgetområden där du behöver de bäst. Design håller man oftast till ett minimum, dvs inga bilder utan bara nyanser för att märka ut lite områden.
Sen när du utvecklar siten åt kund så är det oftast enbart att skriva över de regler som behöver ändras. Basen finns ju redan och allt kan fortfarande förändras och tas bort genom att ”skriva över” template-sidor med childtemplates. Ex. index.php i core-temat skrivs över av index.php i childtemat utan att röra koden i core-temat (abstrakt men det fungerar bra).
Det enklaste childtemat är enbart en style.css, ett avancerat tema är förändring inom alla områden utifrån core-temat.
http://www.jstudio.se Jonathan
Fungerar Coda endast på mac?
http://www.grafixstudio.se/ Antonio
Yes, det finns endast till Mac
http://twitter.com/adamrenklint Adam Renklint
Bra inlägg. Att skapa ett eget ”sandbox-tema” att utgå ifrån kan snabba upp processen enormt. Och vem vill egentligen spendera tid på att upprepa sig, egentligen?