Hvordan oppdatere innhold automatisk?

[tomalex]

Hei.

Jeg startet med design og koding for 2uker siden ca, og per i dag har jeg kjøpt domene og webhotell. Jeg er helt hekta på photoshop til html og den slags. Jeg har et spørsmål som jeg vet er helt teit, men jeg blir frustrert av tanken.

Når jeg har gjort ferdig et design fra photoshop til html / css, og tenker på å publishe, så kommer det en frustrerende tanke om hvordan jeg kan adde innhold til nettsiden uten å måtte redigere index.html og oppdatere på nytt.. Den delen er helt blank for meg, såvisst det ikke er wordpress / drupal o.l som må til. Noen som forstår tankegangen min og kan hjelpe meg å forstå? sånn at jeg slipper å være så utrolig frustrert over den tunge måten med å oppdatere content på.

Et eksempel: Net tuts + har jo så og si nye tutorials og div ting hver dag, og jeg er ganske sikker på at de ikke redigerer selve filen for å publishe nytt innhold..

Takker for eventuelle svar, og håper på en god oppfrisking!

 

[TorsteinO]

Kortversjonen før jeg tar kvelden: Wordpress er din venn (evt drupal, joomla eller noe annet, men jeg foretrekker og anbefaler definitivt wordpress). Det er endel hakk mer vrient å lage malene enn det nivået du er på foreløpig (ut fra det du forteller), men det er milevis enklere å oppdatere.

 

[tomalex]

Hei takk for den korte versjonen. Og jeg tror muligens du har besvart spørsmålet mitt, om at hvis jeg skal ha økende content på siden, så må jeg innom wordpress etc, for å lettere gjøre det mulig?

EDIT: Mener, at jeg burde "da" basere nettsiden min på wordpress, og lære med alternativ design innenfor wordpress for å få det som jeg vil? hehe

 

[TorsteinO]

Yep, sats på wordpress. Det vil gjøre livet vanvittig mye enklere. Tror også jeg ville ha delt opp prosjektet, hvis jeg var deg:

1: Bruk wordpress, finn en mal du er greit fornøyd med osv, og lær deg selve bruken av wordpress, hvordan publisere, osv.

2: Fortsett å lære deg grunnleggende html og css. Disse to er grunnsteinene for ALT av websider, uansett om du senere vil bruke andre teknologier til å sidene enklere å oppdatere osv (f.ex. er wordpress er laget med php og mysql, og disse to genererer så html'en ut fra malene du lager).

De to der kan du godt gjøre parallellt

Så, i et evt steg 3:
For å lære deg å lage maler til f.ex. wordpress vil du videre trenge å lære deg litt php og slikt (men dette vil heller ikke være mye nytte hvis du ikke kan html). Det finnes også flere andre slike programmeringsspråk, men php er et av de mest brukte.

Du kan tenke på det omtrent slik: Html er det du bruker til å vise hva slags innhold du har (er det f.ex. en overskrift, et avsnitt i brødteksten, eller et bilde?), php kan brukes til å oppdatere denne html'en og mye annet, mysql gjør det enklere å lagre store mengder innhold, og css lar deg gjøre innholdet pent

 

[Hakasu]

Hvis du bare vil oppdatere litt innhold på en side du allerede har laget kan det være en mulighet å sjekke ut Cutenews eller lignende, da dette enkelt kan slenges inn på designet. Det krever likevel at du har PHP installert, men du trenger ikke kunne det for å bruke cutenews.

 

[tomalex]

Hei igjen!

Tusen hjertelig for svarene. Takk til deg TorsteinO for at du setter av 5min til å forklare litt.

Jeg har sett litt på wordpress og har også innstallert det. Jeg likte derimot ikke tanken på at designet ikke var mitt. Jeg kan jo alltids tweake designet, bytte tema, gjøre om litt her og der, sette inn min egen header, and the list goes on.

Det jeg håpte på av svar var jo det at jeg kunne fortsette med å designe i photoshop -> lage en html markup -> style siden i css -> og publishe det jeg skulle publishe når tiden kom.

Jeg forstår jo også at jeg da vil være nødt til å reservere plass til innholdet. teksten, bildene ol.

Ingen måte man kan gjøre dette på?

For å forklare hvordan jeg hamrer sammen dette, så kan jeg si såpass:

Jeg starter i photoshop. Lager designet, hopper over til whatever koding program. Lager markup for designet, hopper så videre i css, og styler det sammen så det ser pent og ryddig ut. Vil jeg ha flere sider duplikerer jeg den første siden jeg lagde og døper om navet fra hjem til f.eks om meg.. skal den siden ha et annet design, så fikser jeg bare det med litt photoshop og omkoding.

Men hadde det bare vært en aplikasjon som tillot meg å publishe like enkelt som med wordpress, hadde jo det vært ypperlig.

En tanke slo meg jo, Går det ann, å slette det meste i wp, utenom selve content area, og da kode rundt selve arket? om dere forstår?

Har også inneforstått meg med at om jeg skal lære meg å lage templates til wordpress vil det ta utrolig lang tid, i form av år.

 

[tomalex]

hmm

Hvis du bare vil oppdatere litt innhold på en side du allerede har laget kan det være en mulighet å sjekke ut Cutenews eller lignende, da dette enkelt kan slenges inn på designet. Det krever likevel at du har PHP installert, men du trenger ikke kunne det for å bruke cutenews.

Det høres ut som det du refererer til er akkurat det jeg er ute etter? en typ "instant" måte å publishe på.. (hvertfall en enklere enn å måtte gå inn i index.html for å redigere "velkommen til denne siden" ) hehe..

 

[adeneo]

Hvis du av en eller annen grunn ikke vil bruke de ferdige systemene, slik som WP, så kan du begynne med enkle ting som gjør det du ser ut til å ønske deg på egen hånd.

Begynn med å sett opp en server på din egen maskin slik at du kan teste sider med PHP dersom du ikke allerede har det.
Det finnes mange programmer til dette, xampp, lamp, easyphp og hva de ikke heter alle sammen.

Litt enkelt forklart:
måten du gjør det på er å navngi filene dine som .php i stedet for .html, da kjøres de gjennom php slik at eventuell php kode kjøres, det går an å sette det opp slik at html filer kjøres gjennom php også, men den første løsningen er enklest til å begynne med.

I index.php filen din som du har designet selv kan du sette av en div til noe du vil oppdatere, og fylle denne div'en (eller et annet element, slik som span, article, header osv.) med innholdet fra en annen fil.
Dette gjør du uhyggelig enkelt med php include, og så legger du den koden du ønsker å sette inn i div'en i den eksterne filen.
Når du skal oppdatere den delen av siden din senere endrer du kun tekst/kode i den eksterne filen slik at du ikke trenger å rote rundt i index.php.

Måten dette ofte gjøres på er at man designer en og en del av en nettside, slik som header, footer, sidebar, last posts, content osv. og legger denne koden i hver sin eksterne fil, og så inkluderer alt sammen i en index fil.
På den måten er det enklere å endre kun en del av siden, samt at man kan ta med seg for eksempel en meny videre til undersider uten å endre på menyfilen, man inkluderer kun meny i de andre undersidene.

Gå til php manualen, ligger vel på php.net hvis ikke jeg husker feil, og se litt på noen eksempler på includes, og test litt på din egen maskin (krever at du har installert en eller annen form for server med php til å teste med), det er beste måten å lære det på.

 

[tomalex]

include ja..

Hjertelig takk for svar adeneo, har roamet forumet litt etter jeg ble medlem i går, og du har peiling på det meste, så jeg takker for at du tar deg tid til å svare (du løser jo de fleste sine problemer.. hehe)

Ja, jeg har jo selvfølgelig tatt meg en tur innom css'n og html'n til de sidene jeg liker, og bruk av utrolig mye <span</span> var det. ettersom jeg vet litt om span elementet så forstår jeg hva du skal frem til der. Jeg forstår prinsippet ditt med include, (server side include?) og jeg skal lære meg litt om dette, når du sier det er uhyre enkelt.

Når vi likesågodt er inne på include elementet, så lurer jeg på om du har noe peiling på om php/include og span elementet er det som er brukt til å sette opp thumbnail pictures med tutorial teksten som på f.eks http://www.1stwebdesigner.com bruker. Alle tutorialene hans har et bilde, hvorav bildet har en sølvskrift, for hver tutorial han lager. Jeg regner med at dette kan kodes sånn at man kan gjøre hverdagen litt enklere. Vil lære dette fordi jeg har lyst til å lære bort andre, på et senere tidspunkt.

 

[tomalex]

Vel. Jeg har sett igjennom alle themes til wordpress, og mange av dem var helt fantastiske. Likte de veldig godt, men igjen..IKKE mitt eget design.( noe som hadde forstyrret meg på en daglig basis)

Derfor har jeg valgt å laste ned XAMPP, og bygge min egen theme. Jeg forventer at dette blir en lang tur, Men det er verdt det i slutten når jeg ser mitt eget design, eller hvertfall det jeg selv har utført.

Om det er noen som har noen relevante tips å komme med i form av wordpress theme designing o.l, så ikke nøl med å skrive her. Jeg sjekker ofte om det er noen som har kommentert!

 

[adeneo]

Jeg kan nok ikke så veldig mye, og jeg begynte å rote med webdesign for kun kort tid siden (rundt ett år nå), og har lært det lille jeg kan stort sett med mye prøving og feiling, samt søk på Google, og jo mer man forstår desto lettere går det å lære nye ting, i hvert fall er det min erfaring.

Jeg er heller dårlig på PHP, men det første jeg lærte av PHP var å inkludere filer, og det er egentlig veldig enkelt.

Som nevnt bør man ha et oppsett på egen maskin til å teste, hvis ikke må man laste opp filene til en webserver som kjører PHP for å teste den minste ting.

En include i sin enkleste form ser noe slik ut:

<?php
include "/minfil.php";
?>

Hvis da minfil.php inneholder:

 <img src="mittbilde.png" />

og man setter den PHP includen inn i en annen fil, omtrent slik:

!DOCTYPE html
<head>
</head>
<body>
     <div id="bilde">
           <?php include("/minfil.php"); ?>
     </div>
</body>
osv....

så blir det akkurat det samme som å skrive :

<body>
     <div id="bilde">
           <img src="mittbilde.png" />
     </div>
</body>

Og når du vil endre bildet så trenger du ikke lete i en stor fil etter akkurat det bildet, du kan endre det i minfil.php i stedet, og det endres da også automatisk i alle andre filer som bruker det bildet, og slik kan man endre for eksempel en meny kun i en fil, mens den oppdateres på alle nettsidene som bruker den menyen.

span og div er nesten like, de definerer en del av en nettside som kan styles og posisjoneres (u)avhengig av resten av siden.
Forskjellen er at en div har en mer gitt start og begynnelse, og har sine egne sett med stiler som følger med, mens en span er mer inline og gjør ingenting før det settes egne css regler på den.
For å definere en egen del av siden bruker man derfor div, mens inne i en div ( eller et annet blokkelement ) så kan man bruke span for å definere visse deler av hovedelementet som man ønsker en litt annen stil på. Noe sånt:

<div id="allebarna">
      <p style="color: blue">Alle barna var ute og lekte, men <span style="color: red">ikke</span> Ole</p>
</div>

Hvor man ender opp med : Alle barna var ute og lekte, men ikke Ole

Man bør forøvrig unngå css inline, den bør i egen fil, men det var kun enklere for eksempelet å skrive det slik. Enkelte standarder tillater heller ikke span inne i <p>, så det var kanskje ikke det beste eksemplet, men i html5 er det ikke noe problem, og alle bruker vel det nå uansett?

Når det kommer til å lage theme's til WP så er det vel flere på forumet som har gjort dette, men jeg ville forsøkt å snekre sammen noen enkle nettsider først, om ikke annet sånn for egen del (du aner ikke hvor mange nettsider jeg har liggende lokalt på min maskin som kun har vært for å teste en eller annen dustete ide jeg har fått), så får du litt trening i hvordan alt henger sammen, det er frustrerende til å begynne med, men morsomt når man ser gangen i det, og du er nesten nødt til å ha en god innsikt i hvordan en nettside er bygget opp før du begynner å rote med egne theme's.
Ett tips er W3C validatoren, som er uvurderlig når det kommer til å teste om man har lukket alt riktig og skrevet riktig kode, og er det første stedet jeg går noe ikke virker som tiltenkt.

Ellers kan man vel finne svar på mye her på forumet, og for litt (<-les veldig) mer avanserte spørsmål så finnes noen av verdens ledende utviklere på Stack Overflow, hvor man kan få svar på det mest utrolige.

 

[tomalex]

Hei igjen

Takk for svar adeneo.

Jeg har faktisk en del mapper på pcen hvorav noen av mappene heter f.eks navigasjonsforsøk etc.. inni alle mappene har jeg .html, .css og kanskje litt .js .. Så jeg har jo noen nettsider som jeg har designet og bygd opp men ikke publisert rett og slett på grunn av autocontent bygging (som jeg spurte om i denne linken, til å begynne med) . Jeg har vært innom w3c med både .html og .css, alle er riktig satt opp, tilogmed med kompleks design, som f.eks 99% width med header logo og fet navigasjon i headern. Jeg kaller meg komplett nybegynner, men jeg påpeker bare at jeg også har en del mapper på pcen hvor jeg har feilet mye og sånn de siste 2-3 ukene.

Kanskje det hjelper deg litt med hvor jeg er i kode-verden. Vil si jeg er helt blank med forståelse

Takk for at du lagde noen få snipps som jeg kunne se på i tilfelle jeg vil (include) noe når jeg hopper til php. PHP er jeg faktisk blank på. aldri startet og, eller prøvd. Men når man forstår seg litt på koding og hvordan språk det bruker så skal ikke php være så usaklig å ha med ågjøre heller.

Du la ut noen gode poeng her hvertfall! Tusen takk!

kort fortalt: å lage en html markup, style den i css og gjøre den klar for web kan jeg. Men jeg har en lang vei å gå for å mestre begge 2.

EDIT: Denne navigasjonen har jeg lagd, uten noen form av tutorial. Bare for å påpeke at fantasien og litt html / css kunnskaper har jeg. link -> Navigasjon

 

[adeneo]

Det ser bra ut det, og du er vel godt på vei da, det er til og med brukt en sprite der.

 

[tomalex]

hei

Det ser bra ut det, og du er vel godt på vei da, det er til og med brukt en sprite der.

Hehe, ja. Ettersom jeg forsto så er sprites utrolig brukervennlig. sparer plass og mindre kluss.

Sprites er vel til for å spare servern for hazzle? mindre loadtime vel å merke?

 

[TorsteinO]

Er egentlig vel så mye at det er mer elegant. Hvis du bruker to forskjellige bilder til bakgrunn på hover/ikke-hover, så vil hover-varianten ikke bli lastet inn før du faktisk tar pekeren over linken/knappen, og selv om dette går kjapt, så vil det ta et øyeblikk, og du får et lite "blink" mellom der som ser dumt ut. Bruker du samme bilde, bare en annen del av det, så er hele allerede lastet, og du slipper noe "blink".