Beginner apua, kiinteät Header ja Footer

Järki ei palvele

Olen kahlannut tuntikausia aloittelijan CSS-ohjesivuja, mutta en pääse perille enkä jvvälle. Saanko tehtyä pelkällä CSS:llä, ilman javascriptejä tms. kiinteät Header ja Footer osiot joka sivulleni?

Sen ymmärrän että saan muotoiluja tuotuia CSS:n kautat, mutta voiko CSS sisältää myös ne kiinteät vakuiot Header ja Footer tekstit. Tätä en oppaista löydä.

Minulla Web sivuja siis vaikka 20 kpl, ja jokaisen headerina pitäisi olla "Tämä on Pekan sivun Header -teksti" sekä footerina "Tämä on Pekan sivun Footer- teksti".

Mitenkä saan tämän järkevästi tehtyä? Laitanko nuo tekstit CSS-tiedostoon sisään, vai miten se menee?

8

213

    Vastaukset

    Anonyymi (Kirjaudu / Rekisteröidy)
    5000
    • Apuvalle

      "Saanko tehtyä pelkällä CSS:llä, ilman javascriptejä tms. kiinteät Header ja Footer osiot joka sivulleni" Saat

      CSS tiedosto pitää sisällään pelkästään tyylitiedot (sijainnit, fontit, marginaalit...) eli se EI saa sisältää varsinaista sisältöä kuten tekstejä tageja...


      Paras ratkaisu olisi tietenkin julkaisujärjestelmä kuten wordpress. Tähän tehtäisiin erikseen oma ulkoasu kerran. Joka toistuu jokaisella sivulla automaattisesti. Sisältö lisätään erikseen. Ongelmana on että tuollaisen ulkoasun teko vaatii php osaamistakin jonkin verran.

      tyylit.css tiedostoon esim.
      #header {position:absolute; left; 30%; top:15px; border: black solid thin;}
      #header_teksti { Tähän voit vaikka asettaa tuon teksin sijainnin tai määrittää fontin}
      -HTML-
      -HEAD-
      -LINK Href="tyylit.css" rel="stylesheet" type="text/css-
      -/ HEAD-
      -BODY-
      -div id="header"- -p id="header_teksti- -Tämä on Pekan sivun Footer- teksti-/p- -/div-
      -/ BODY-
      -/ HTML-
      hakasulkujen tilalla on viivat johtuen tästä suomi24:sta
      Eli Css riittää että on yhdessä tiedostossa, html huonous on että joudut tuon body osion kopioimaan jokaiselle sivulle erikseen , jota ei julkaisujärjestelmä tarvitse tehdä.

    • Sain sen varmistuksn

      Thanksit vastauksesta. Tuota vähän epäilinkin että se ei CSS:llä pelkästään hoidu, ellei juurikin kirjoita niitä tekstejä joka HTML:ään erikseen. Siihen ei tosiaan haluta mennä, koska headerissa on useampia rivejä kuitenkin.

      Piti varmuudeksi kysyä että olin ymmärtänyt asian oikein, ja kun ei netistä vaan sopivaa CSS-vastaussivua löytynyt.

      Isoon julkaisujärjestelmään ei tässä yhteydessä ole halua eikä aikaa perehtyä. Tarpeena oli vain saada ne 20 sivua siistissä muodossa kertaalleen nettiin. Toki noita voi tulla lisää kevään aikana useampiakin, mutta se on sen ajan murhe.

      Tutkailin jo alustavasti, ja PHP on lähinnä tutuimmasta päästä se keino jolla saanen toistuvan headerin probleeman vähimmällä koodauksella ratkaistua. Thanksit vinkeistä.

      • pelikaanimies

        Vaihtoehtona julkaisujärjestelmille on myös sivugeneraattorit joiden avulla staattinen sivusto voidaan luoda näppärästi. Tässä vaikka yksi esimerkki
        http://docs.getpelican.com/en/3.1.1/

        Toki tämäkin lähestymistapa vaatii paneutumista ja uuden opettelua. Etuna on kuitenkin sisällön ja ulkoasun erottelu ja voit muokata koko sivuston ulkoasua helposti. Pieniä muutoksia tehdessä ei tarvitse muokata kaikkia 20 sivua vaan tekee tarvittavan muutoksen ja generoi koko sivuston uudelleen.

        Omaa käytännön kokemusta tästä pelicanista ei vielä ole mutta vaikutti mielenkiintoiselta ratkaisulta.


      • pelikaanimies
        pelikaanimies kirjoitti:

        Vaihtoehtona julkaisujärjestelmille on myös sivugeneraattorit joiden avulla staattinen sivusto voidaan luoda näppärästi. Tässä vaikka yksi esimerkki
        http://docs.getpelican.com/en/3.1.1/

        Toki tämäkin lähestymistapa vaatii paneutumista ja uuden opettelua. Etuna on kuitenkin sisällön ja ulkoasun erottelu ja voit muokata koko sivuston ulkoasua helposti. Pieniä muutoksia tehdessä ei tarvitse muokata kaikkia 20 sivua vaan tekee tarvittavan muutoksen ja generoi koko sivuston uudelleen.

        Omaa käytännön kokemusta tästä pelicanista ei vielä ole mutta vaikutti mielenkiintoiselta ratkaisulta.

        Lisätään nyt että muitakin on ja tässä on ensimmäinen tulos joka tuli googlella :)
        https://iwantmyname.com/blog/2011/02/list-static-website-generators.html

        Kannattaa toki tutustua vaihtoehtoihin jos tälle tielle lähtee. Itse törmäsin sattumalta tuohon pelicaniin ja pidin sen periaatteista ja toteutuksesta. Muita en ole paljoa katellut joten mitään parempaa neuvoa en osaa antaa.


    • Sitten löytyy...
    • Jotain edistystä

      " sattumalta tuohon pelicaniin ja pidin sen periaatteista ja toteutuksesta. "

      Tuo näyttäisi olevan Pythonilla toteutettu. Yritin tsekkailla täällä neuvotulla kikalla, että onko web-serverilläni Pythonille tukea.
      http://stackoverflow.com/questions/6796402/how-to-test-for-python-support-in-a-web-host

      Tuo Python-testi toimii työpaikan serverillä testattuna ja scripti vastaa
      "(2, 4, 3, 'final', 0)" joka tarkoittanee että Pyyttoni siellä löytyy.

      Mutta tuolla omalla kohdeserverillä tulee herjaa kimppuun:
      "Warning: exec() has been disabled for security reasons in /var/www/virtual/xxxmydomain.com/htdocs/pyth/pythontest.php on line 5"

      Joten ei Python-Pelicaanista tässä nopeata apua oikein ole.

      Olen saanut sivuni kohtalaiseen kuntoon PHP:llä. Ulkonäkö on aika hyvä nyt. Mutta hirmuisesti sai PHP- ja HTML-koodia ja CSS:ää käydä läpi käsipelillä, ennen kuin tuonne saakka ulkoasussa ekakertalainen pääsi.

      Laitoin mahdollista jatkoa varten kokeeksi jo Wordpressinkin koneelle. Sieltä en löytänyt valmiita sivumalleja miten saisi helpolla 20-sivuisen, alun perin Wordista tuodun tekstin sivustolle.
      Normaalissa, yleismallisessa Word-testissä on Header ja Footer joka sivulla, ja headerissa juokseva sivunumerointi.

      Haluaisin tämän suhteellisen saman näköisenä HTML (ei PDF) dokumenttina nettiin, jolloin nuolipainikkeella voi siirtyä sivulta toiselle. Mahtaneeko em. Wordpressistä tai jostakin muusta vastaavasta löytyä joku tällainen pohja valmiina?

      • pelikaanimies

        Ymmärsit hieman väärin. Et tarvitse pythonia palvelimella, vaan voit rakentaa sivuston vaikka työasemassa ja siirtää valmiin kokonaan puhtaasti staattisen sivuston www-palvelimelle. Tällöin www-palvelimen ei tarvitse tukea mitään prosessoituja kieliä - riittää kun se on työasemassa jossa sivusto rakennetaan. Tämä on yksi tämän lähestymistavan eduista koska silloin käy käytännössä mikä tahansa www-pavelin.

        Ja olihan tuolla toki paljon muita sivugeneraattoreita jos pelican / python ei jostain syystä sinulle käy. Heitin tuon vaan nyt yhtenä vaihtoehtona jos tämänkaltainen ratkaisu sinulle sopisi. Joskus nyt vaan on ihan turha käyttää mitään raskasta tietokantapohjaista ratkaisua jos sivuja tarvitsee muuttaa hieman vain silloin tällöin. Sivuston julkaiseminenkin on paljon helpompaa kun ei tarvitse mitään php, python yms tukia


    • PHP ja include()

      Laita headeri (ylätunniste) ja footeri (alatunniste) eri tiedostoihin liitä ne varsinaiseen sivuun PHP:n include()-funktiolla.

      Nyt, kun muutat yhtä jompaakumpaa tiedostoa (header.php tai footer.php) niin muutokset näkyvät kaikilla sivuilla, joille tuo tiedosto on sisällytetty.

    Ketjusta on poistettu 0 sääntöjenvastaista viestiä.

    Luetuimmat keskustelut

    1. KUPSinpelaaja vangittu törkeästä rikoksesta

      Tänään tuli uutinen että Kupsin sopimuspelaajs vangittu törkeästä rikoksesta epäiltynä. Kuka pelaaja kysressä ja mikä ri
      Kuopio
      18
      1475
    2. Taasko se show alkaa

      Koo osottaa taas mieltään
      Ikävä
      28
      1305
    3. Minun oma kaivattuni

      Ei ole mikään ilkeä kiusaajatyyppi, vaan sivistynyt ja fiksu sekä ystävällinen ihminen, ja arvostan häntä suuresti. Raka
      Ikävä
      63
      1202
    4. Miksi ihmeessä nainen seurustelit kanssani joskus

      Olin ruma silloin ja nykyisin vielä rumempi En voi kuin miettiä että miksi Olitko vain rikki edellisestä suhteesta ja ha
      Ikävä
      11
      1092
    5. Tervehdys!

      Sä voit poistaa nää kaikki, mut mä kysyn silti A:lta sen kokemuksia sun käytöksestä eron jälkeen. Btw, miks haluut sabot
      Turku
      65
      1036
    6. Onko ministeri Juuso epäkelpo ministerin tehtäviensä hoitamiseen?

      Eikö hänellä ole kompetenttia hoitaa sosiaali- ja terveysministetin toimialalle kuuluvia ministerin tehtäviä?
      Perussuomalaiset
      10
      1026
    7. Persut nimittivät kummeli-hahmon valtiosihteeriksi!

      Persujen riveistä löytyi taas uusi törkyturpa valtiosihteeriksi! Jutun perusteella järjenjuoksu on kuin sketsihahmolla.
      Perussuomalaiset
      27
      1025
    8. Elia tulee vielä

      Johannes Kastaja oli Elia, mutta Jeesus sanoi, että Elia tulee vielä. Malakian kirjan profetia Eliasta toteutuu kokonaan
      Helluntailaisuus
      30
      989
    9. Sakarjan kirjan 6. luku

      Jolla korva on, se kuulkoon. Sain profetian 22.4.2023. Sen sisältö oli seuraava: Suomeen tulee nälänhätä niin, että se
      Profetiat
      6
      981
    10. Kaupungin valtuuston yleisötilaisuus

      YouTubessa katsojia 76 Buahahaha buahahaha buahahaha buahahaha buahahaha buahahaha
      Varkaus
      1
      980
    Aihe