Kuinka sisällyttää yksi HTML-tiedosto toisessa

HTML-koodin käyttäminen voi yksinkertaistaa sivustosi hallintaa huomattavasti

Siirry mihin tahansa verkkosivustoon ja siirry sivulta sivulle ja huomaat nopeasti, että vaikka kukin näistä sivuista voi olla monin eri tavoin erilaisia, ne ovat myös melko samanlaisia ​​muissa. Lähes kaikki sivustot sisältävät mallin osia, jotka toistetaan sivuston jokaisen sivun yli. Joitakin esimerkkejä sivuston elementeistä, jotka löytyisivät jokaisen sivun yli, olisivat otsikon alue, jossa logo sijaitsee, navigointi ja alatunnisteen alue.

Toistuvat elementit sivustossa mahdollistavat johdonmukaisuuden käyttökokemuksessa. Vierailijan ei tarvitse etsiä navigointiasi kaikilla sivuilla, koska kun he ovat löytäneet sen, he tietävät, missä se tulee olemaan vierailemassa olevan sivuston muilla sivuilla.

Kuinka sisällöt tekevät Web-suunnittelusta tehokkaamman

Koska joku on vastuussa verkkosivuston hallinnasta, nämä toistuvat alueet tarjoavat haasteen. Mitä jos sinun on tehtävä jotain muutosta tällä alueella? Jos esimerkiksi alatunnuksesi (joka on sivuston jokaisella sivulla) sisältää tekijänoikeuslausuman vuodella, mitä tapahtuu, kun kyseinen vuosi muuttuu ja sinun on päivitettävä päivämäärä? Koska tämä osio on jokaisella sivulla, sinun on nyt muokattava sivustosi jokaista sivua erikseen, jotta muutos tehdään.

Sisältyy sisältö voi poistaa tarpeen muokata sivustosi kaikkia sivuja toistuvaan sisältöön. Sen sijaan voit yksinkertaisesti muokata yhtä tiedostoa ja koko sivustosi ja kaikki sen sivut saavat päivityksen!

Katsotaanpa muutamia tapoja lisätä tämä toiminto sivustoosi ja sisällyttää yksi HTML- tiedosto useissa muissa.

Toistuva sisältö sisällönhallintajärjestelmissä

Jos sivustosi käyttää CMS-järjestelmää , se todennäköisesti käyttää tiettyjä malleja tai teemoja, jotka ovat osa kyseistä ohjelmistoa. Vaikka oletko muokannut näitä malleja tyhjästä, sivusto käyttää edelleen näitä puitteita sivuille.

Sellaisinaan nämä CMS-mallipohjat sisältävät sivuston alueet, jotka toistetaan jokaisella sivulla. Voit kirjautua CMS: n taustaan ​​ja muokata tarvittavia malleja. Kaikki sivut, jotka käyttävät kyseistä mallia, päivittyvät.

Vaikka sinulla ei olisi sivustosi sisällönhallintajärjestelmää, voit silti hyödyntää mukana toimitettuja tiedostoja. HTML: ssä on sellaisia, jotka auttavat helpottamaan sivustosi mallisivustojen hallintaa.

Mitä HTML sisältää?

Sisällys sisältyy HTML-osaan, joka ei ole itse HTML-dokumentti. Sen sijaan se on osa toista sivua, joka voidaan lisätä täydelliseen web-sivujen ohjelmointiin. Suurin osa tiedostoista on edellä mainittuja kohteita, jotka toistuvat verkkosivuston useilla sivuilla. Esimerkiksi:

On edullista, että nämä toistuvat alueet sisällytetään sivuille. Valitettavasti tiedostojen asettamisprosessi ei ole sellainen, joka voi tapahtua pelkästään HTML: llä, joten sinulla on oltava jonkinlainen ohjelma tai käsikirjoitus, joka lisää sisällysfileesi web-sivuillesi.

Palvelinpuolen käyttö sisältää

Palvelinpuoli sisältää, tunnetaan myös nimellä SSI, kehitettiin ensin, jotta web-kehittäjät voivat "sisällyttää" HTML-asiakirjoja muiden sivujen sisälle.

Pohjimmiltaan yhden asiakirjan sisältämä katkelma sisältyy toiseen, kun sivu suoritetaan palvelimella ja lähetetään verkkoselaimeen.

SSI sisältyy useimpiin verkkopalvelimiin, mutta sinun on ehkä otettava se käyttöön, jotta se toimisi. Jos et tiedä, palvelin tukee SSI: tä, ota yhteyttä palveluntarjoajaasi .

Tässä on esimerkki siitä, kuinka voit käyttää SSI: tä sisällyttämällä HTML-koodinpätkäsi kaikkiin Web-sivuihisi:

  1. Tallenna HTML-sivustosi yhteiset elementit erillisinä tiedostoina. Esimerkiksi navigointiosiosi voi tallentaa navigation.html tai navigation.ssi .
  2. Käytä seuraavaa SSI-koodia sisällyttämään HTML-asiakirjan koodi jokaiseen sivulle ( korvaamalla tiedoston polku ja tiedostonimi lainausmerkkien välissä ). {C}
  1. Lisää tämä koodi jokaiselle sivulle, johon haluat sisällyttää tiedoston.

Käyttämällä PHP sisältää

PHP on palvelintason kirjoituskieli. Se voi tehdä useita asioita, mutta yksi yleinen käyttö on sisällyttää HTML-dokumentit sivuillesi, aivan samalla tavoin kuin vain SSI: llä.

Kuten SSI, PHP on palvelintason teknologia. Jos et ole varma, onko sinulla PHP-toimintoa sivustossasi, ota yhteyttä palveluntarjoajaasi.

Tässä on yksinkertainen PHP-skripti, jota voit käyttää HTML-koodinpätkän sisällyttämiseen mihin tahansa PHP-yhteensopivaan Web-sivulle:

  1. Tallenna HTML-sivustosi yhteiset elementit, kuten navigointi, erillisiin tiedostoihin. Esimerkiksi navigointiosiosi voi tallentaa navigation.html tai navigation.ssi .
  2. Käytä seuraavaa PHP-koodia sisällyttämään kyseinen HTML jokaiseen sivulle ( korvaamalla tiedoston polku ja tiedostonimi lainausmerkeissä ). navigation.php ");?>
  3. Lisää tämä sama koodi jokaiselle sivulle, johon haluat sisällyttää tiedoston.

JavaScript Sisältää

JavaScript on toinen tapa sisällyttää HTML sivusi sivustoosi. Tällä on se etu, että palvelintason ohjelmointia ei tarvita, mutta se on hieman monimutkaisempi - ja se toimii tietenkin selaimelle, joka sallii Javascriptin, mikä useimmiten tekee, ellei käyttäjä päätä poistaa sitä.

Voit lisätä HTML-koodinpätkä JavaScriptin avulla seuraavasti :

  1. Tallenna HTML-sivustosi yhteiset elementit JavaScript-tiedostoon. Tässä tiedostossa kirjoitettu HTML on tulostettava näyttöön document.write-toiminnolla.
  2. Lähetä tämä tiedosto verkkosivustoosi.
  3. Käytä