Az utolsó leckében kitaláltuk, hogy az utazássablon milyen blokkokból áll majd, így már indulhat is. Kezdjük két mappa létrehozásával:

képek – ez a mappa tartalmazza a sablon stílusához használt képfájlokat. Mert még nincs tervezési fejlesztésünk, akkor dobjon egyet ebbe a mappába grafikus fájl ellenkező esetben a Joomla nem telepíti a sablont, és hibát fog kiadni, ha a mappa üres.

FIGYELEM: Tartalomgrafika nem helyezhető el a sablon képek mappájában!

css - ez a mappa tartalmazni fogja lépcsőzetes stíluslapfájlok. Kezdésként helyezzünk el benne egy üres template.css fájlt, melynek segítségével különféle tervezési stílusok lesznek hozzárendelve az oldal elemeihez.

Ezután elkezdheti létrehozni a legfontosabb index.php fájlt, amely meghatározza a webhely elemeinek vizuális helyét, és megmondja a Joomla CMS-nek, hogy melyik blokkban helyezze el a különböző összetevőket és modulokat. A fájl a PHP és a HTML kombinációja.

Mindig csak Macromedia Dreamweavert használok kódíráskor. Remek program, Bátran ajánlom neki a kezdőknek, mert ha hibát követ el a kódon való munka közben, a program biztosan kiemeli a jammet.

Az oldalon egy oktatóanyagot talál a Macromedia Dreamweaverről. Ha weboldalakat fog fejleszteni, akkor ezt a programot legalább el kell sajátítani belépő szint a sablonkódok hibamentes szerkesztéséhez.

Az oldal elemeinek (blokkjainak) pozicionálása HTML kóddal történik, konkrétan DIV tageket fogunk használni. De ahogy az oldalunk a Joomla motoron fog működni, i.e. dinamikus lesz, használni is kell majd PHP nyelv. Segítségével meghatározzuk, hogy melyik blokkban helyezkedjenek el a modulok megjelenítésére szolgáló pozíciók, és hogyan hívják ezeket a pozíciókat, összeomlanak-e a blokkok vagy sem. Csatlakoztassunk stíluslapokat külső fájlokból, tartalomnyelvet, állítsuk be, hogyan változzon a webhely mérete stb.

index.php

Fájl fejléc

A fájl fejléce több részből áll. A PHP fejléckódjának első része annak biztosítása, hogy biztonsági okokból ne érje el közvetlenül a fájlt.

< ?php
definiált ("_JEXEC" ) vagy die ;
JHtml::_("behavior.framework" , true ) ;
$app = JFactory::getApplication() ;
?>
< ?php echo "< ?" ; ?> xml version="1.0" kódolás=" < ?php echo $ez-> _charset ?> "?>

A DOCTYPE egy nagyon fontos paraméter, amely alapján a böngésző eldönti, hogyan jelenítse meg ezt az oldalt, és hogyan értelmezze a CSS-t.

< ! DOCTYPE html PUBLIC "- / / W3C/ / DTD XHTML 1.0 Strict/ / EN""http: // www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

A következő kódrészlet lekéri a telepített nyelvet a globális konfigurációból.

< html xmlns= "http://www.w3.org/1999/xhtml" xml:lang=" < ?php echo $ez->nyelv; ?>" lang=" < ?php echo $ez->nyelv; ?>" dir=" < ?php echo $ez-> irány; ?>" >

Az alábbi kódrészlet tartalmazza További információ a globális konfigurációban beállított fejléchez. Ezt az információt megtekintheti, ha megnézi forrás bármely weboldalt. Különösen ezek azok a metacímkék, amelyekről már tud.

< head>
< jdoc:include type= "head" / >

A fejléc következő sorai a főre mutató hivatkozásokat tartalmaznak CSS stílusok Joomla.

< link rel= "stylesheet" href= "< ?php echo $ez-> baseurl ?> /templates/system/css/system.css" type="text /css" / >
< link rel= "stylesheet" href= "< ?php echo $ez-> baseurl ?> /templates/system/css/general.css" type="text /css" / >

A sablontervezési stílusok használatához hivatkozást készítünk a template.css lépcsőzetes stíluslapokat tartalmazó fájlra, amely a CSS mappában található. Nem számít, hogy ez a fájl még üres, a lényeg a csatlakoztatás, a tervezéssel később foglalkozunk, amikor telepítjük a sablont Joomlára. Így könnyebben látható lesz az eredmény.

< link rel= "stylesheet" href= "< ?php echo $ez-> baseurl ?> /sablonok/< ?php echo $ez-> sablon ?> / css/ template.css" type="text /css" / >

A következő kódrészlet lehetővé teszi a bal vagy jobb oldali oszlop összecsukását, ha nincsenek modulok a „bal” és „jobb” pozícióban. Ha mindkét oszlop össze van csukva, akkor a tartalom az oldal szélességének 100%-át elfoglalja. Ha csak egy oszlop szerepel, akkor a tartalom 80%-ot foglal el. Két oszloppal együtt a tartalom az oldal szélességének 60%-át teszi ki.

< ?php
ha ($ ez-> countModules("bal és jobb" ) == 0) $contentwidth = "100" ;
ha ($ ez-> countModules("bal vagy jobb" ) == 1) $contentwidth = "80" ;
ha ($ ez-> countModules("bal és jobb" ) == 1) $contentwidth = "60" ;
?>

Fejléc bezárása

< / head>

< body>

Az „oldal” blokk csak az oldal oldalának dizájnját tartalmazza, szélessége 950px.

< div id= "page" >

A "felső" blokk az oldal legtetején található, és két blokkot tartalmaz: "logo" és "user1".

< div id= "top" >

A „logó” bokeh-ben elhelyezzük a logó grafikus fájlt, ez lesz beírva a stíluslapokba. De az index.php fájlba írjuk az oldal nevének automatikus kimenetét, és a név a H1 tag-be kerül, ami nagyon fontos a keresőoptimalizálás szempontjából.

< div id= "logo" >
< h1> < ?php echo $app - >getCfg("webhelynév") ; ?>< / h1>
< / div>

Határozzuk meg a "felhasználó1" pozíciót az azonos nevű blokkban a webhelykereső modul megjelenítéséhez.

< div id= "user1" >
< jdoc:include type= "modules" name= "user1" style= "xhtml" / >
< / div>
< / div> < ! - - конец блока top - - >

A vízszintes menümodul kimenete a "user2" blokkban a "user2" pozícióban. A blokk összeomlik, ha nincs modul azon a helyen.

< ?php if ($ez-> countModules("felhasználó2")) : ?>
< div id= "user2 " >
< jdoc:include type= "modules" name= "user2" style= "xhtml" / >
< / div>
< ?php endif ; ?>

Ezután jön a webhely fejléc blokkja "fejléc". Ebben meghatározzuk a modulok kimenetének "fejléc" pozícióját. A blokk összeomlik, ha nincs modul azon a helyen. Szándékosan bővítettem ennek a blokknak a lehetőségeit, hogy ne csak a fejlécképet, hanem a képforgatókat is el tudjam helyezni benne.

< ?php if ($ez-> countModules(" fejléc") ) : ?>
< div id= "fejléc">
< jdoc:include type= "modules" name= "fejléc" style="xhtml" />
< / div>
< ?php endif ; ?>

A "user3" blokkban határozza meg a "user3" pozíciót a modulok megjelenítéséhez.

A blokk összeomlik, ha ezen a "felhasználó3" helyen nem jelenik meg modul.

< ?php if ($ez-> countModules("felhasználó3")) : ?>
< div id= "user3" >
< jdoc:include type= "modules" name= "user3" style= "xhtml" / >
< / div>
< ?php endif ; ?>

Megnyílik a bal oldali oszlop blokkja, amely összeomlik, ha nincs modul a „bal” pozícióban.

< ?php if ($ez-> countModules("bal" ) ) : ?>
< div id= "left" >
< jdoc:include type= "modules" name= "left" style= "xhtml" / >
< / div>
< ?php endif ; ?>

Megnyílik a legfontosabb tartalomblokk, amely az oldal szélességének 100%-át, 80%-át és 60%-át is elfoglalhatja a benne foglalt oszlopok számától függően.

< div id= "content< ?php echo $contentwidth ; ?> " >

Üzenetek megjelenítése komponensekben

< jdoc:include type= "message" / >

Tartalom kimenet.

< jdoc:include type= "component" style= "xhtml" / >
< / div> < ! - - конец блока контента- - >

Megnyílik a jobb oldali oszlop blokkja, amely összecsukódik, ha nincs modul „jobb” pozícióban.

< ?php if ($ez-> countModules("jobbra") ) : ?>
< div id= "rigth" >
< jdoc:include type= "modules" name= "right" style= "xhtml" / >
< / div>
< ?php endif ; ?>

A „lábléc” blokk kimenete, amely a „HTML kód” modul szerzői jogi információkkal való megjelenítésére szolgál. Ide is elhelyezheti az alját vízszintes menü vagy tartalombemutató modul. A blokk összeomlik, ha egynél több modul nem jelenik meg ebben a "lábléc" pozícióban

< ?php if ($ez-> countModules("lábléc")) : ?>
< div id= "footer" >
< jdoc:include type= "modules" name= "footer" style= "xhtml" / >
< / div>
< ?php endif ; ?>

A webhely oldalblokkja az "oldal", a törzs és az összes kód zárva van.

< / div> < ! - - конец блока page- - >
< / body> < ! - - конец блока body - - >
< / html> < ! - - конец кода- - >

Létrehoztunk egy teljes index.php fájlt. Most már tudja, milyen parancsokkal és milyen sorrendben jelennek meg a sablonblokkok.

FIGYELEM: Ahhoz, hogy a sablonkód kiolvasható legyen a joomla adminisztrációs panelről, az index.php fájlt meg kell nyitni az AkelPad szerkesztőben, és UTF-8 kódolásban kell elmenteni, miközben törölni kell a BOM bejelölését. Ha a Macromedia Dreamweaver programot használta a fájl kezeléséhez, akkor a visszatérési menüben válassza a "Szerkesztés" > "Oldaltulajdonságok" lehetőséget, és válassza ki a Unicode dokumentumkódolást (utf-8), miközben törölje a jelet az "Enable Unicode aláírások (BOM) jelölőnégyzetből. )". Viszont erősen azt tanácsolom, hogy ne a Joomla adminisztrációs paneljéből szerkessze a kódot, ha elront valamit - nincs visszaút, ellentétben a Macromedia Dreamweaver programmal, ahol mindig vissza lehet vonni a változtatásokat.

A blokkok kialakítását a template.css tartalmazza. De a stíluslapokat testre szabjuk a sablon Joomla 3 (joomla 2.5) rendszerre történő telepítése után, és ehhez létre kell hozni

2017-01-10

Dinamikus weboldalt készítünk php használatával

Szia kedves látogató!

Ma tól kezdőlap nyelv segítségével PHP programozás teremt dinamikus oldal, amely minden felhasználói kéréssel tovább generálódik a szerveren.

Így az oldal szerkezetének megváltoztatásával és hasonló változó oldalakkal való feltöltésével egy dinamikus oldalt kapunk, ami a jövőben nagyban leegyszerűsíti. technikai támogatásés fejlesztés a statikus opcióhoz képest.

• Miért van szüksége dinamikus weboldalra?
• Statikus webhely átalakítása dinamikussá
• Egy dinamikus oldal blokkjait alkotjuk
• Weboldal átalakítása statikusról dinamikusra
• A webhely forrásfájljai

Miért van szüksége dinamikus weboldalra?

Már az elején szó volt arról, hogy miért van szükséged egy dinamikus weboldalra. lépésről lépésre utasításokat A helyi webszerver telepítésének szükségességéről lásd: Helyi Denwer webszerver telepítése. Ezért visszatérhetünk és felfrissíthetjük ezt a kérdést.

Továbbá, ha tovább kell mérlegelnie a statikus és dinamikus webhelyek előnyeit és hátrányait, javasolhatja, hogy ismerkedjen meg a "Puzzleweb.ru" online címtár oldalaival a Webhelyek típusai szakaszban, ahol a magyarázatok meglehetősen tömörek, de ugyanakkor egyértelműen különböző lehetőségeket oldalak.

képernyőkép 12

Ehhez csak annyit tudunk hozzátenni, hogy egy igazán teljes értékű internetes forrás megszerzéséhez ezt a lépést nem lehet kihagyni, és maradni a statikus oldal lehetőségénél.

Ezért a továbbiakban nem elmélyülünk a dinamikus oldal létrehozásának szükségességéről szóló elméleti vitában, hanem áttérünk annak mérlegelésére, hogyan tesszük ezt.

Statikus webhely átalakítása dinamikussá

Tudniillik az alapvető különbség a dinamikus és a statikus oldal között az, hogy a statikus oldalon a kész weboldalak a szerveren hevernek, és sorban állnak, hogy elküldjék őket a felhasználó böngészőjébe. Ugyanakkor, ha az oldalak kisebb eltéréseket mutatnak, mondjuk csak egy kifejezésben vagy akár egy szóban is eltérés van, akkor is külön oldalak lesznek.

A dinamikus változatban az oldalak kialakítása minden egyes felhasználói kérésre megtörténik a szerveren, a kért információtól függően.

Ez egyszerű módon összehasonlítható egy konstruktorral, ahol korlátozott számú elemet lehet létrehozni nagyszámú különféle figurák. Ugyanakkor, ha bármilyen módosítást végez az egyik elemen, akkor az megjelenik a teljes struktúrában, amely ezt az elemet tartalmazza.

Ez alapján elkészített főoldalunkat úgy alakítjuk ki, mint egy bizonyos elemekből (esetünkben ezek fájlok) álló konstruktort, amelyből a későbbiekben felhasználói kérésre weboldalakat állítunk össze.

Az ehhez szükséges lépések magyarázatához a főoldal keretének HTML-kódját használjuk, amelyet a cikkben szereplő webhely létrehozásának egyik szakaszában szereztünk meg.

2. "utf-8" >

   "Leírás" tartalom = "Az oldal tartalmának rövid leírása" >

4. "csomagolás" >

   Egy sapka

   Rotátor

   Központi téma

   oldalsáv

Ahogy a HTML kódból is látható, a tároló , amelyet a weboldal látható részének elhelyezésére terveztek, a következő fő blokkokat tartalmazza:

• Egy sapka;
• Rotátor;
• központi téma;
• oldalsáv;
• Pince.

Ebben az esetben figyelni kell arra, hogy ötből négy blokk közös, és oldalanként csak egy "Fő tartalom" blokk lesz más.

Egy dinamikus oldal elemeinek megszerzéséhez ezekből a blokkokból külön fájlokba különítjük el a tartalmat, amelyeket később a felhasználók kérésére különböző weboldalak összeállításakor beépítünk.

Most, ebben a szakaszban csak öt ilyen fájl lesz. De a jövőben, amikor oldalakat vagy további funkciókat ad hozzá a webhelyhez, új fájlok kapcsolódnak, és így tovább, ha szükséges.

A webhely szerkezetének ilyen felépítése lehetővé teszi, hogy a jövőben ne vegyen részt az összes oldal HTML-kódjának megváltoztatásának rutinmunkájában, ha bármilyen közös töredéket lecserélnek vagy kiegészítenek. Ilyen esetekben elegendő csak egy adott fájl módosítását végrehajtani, és ezzel a teljes csere folyamat befejeződik. Amint látja, van előnye.

De ahhoz, hogy ezt megtegyük, szükségünk van a PHP nyelvre, amellyel a weboldalak hozzáférhetnek ezekhez a lefoglalt blokkokhoz, és átvihetik maguknak a tartalmát.

Ha valakinek még nem volt dolga a PHP nyelvvel, annak érdemes közelebbről is megismerkednie, hiszen a PHP az egyik legfontosabb weboldal fejlesztő eszköz. Ez megtehető különféle referencia irodalom segítségével, amelyek nagy mennyiségben megtalálhatók a Runeten.

Lehetőségként a többször említett "Puzzleweb.ru" útmutató, amelynek egyik része a PHP témája. A PHP alaposabb tanulmányozásához használhat egy speciális, kifejezetten erre a nyelvre szabott kézikönyvet is, amelyet a "php.ru" oldalon tesznek közzé. A "https://php.ru/manual/control-structures.intro.html" hivatkozás segítségével eljuthat a "Bevezetés" oldalára, ahonnan könnyedén kiválaszthatja a kézikönyv bármely, Önt érdeklő részét.

De ahhoz, hogy most dinamikus webhelyet készítsünk, és lehetővé tegyük a fájlok HTML-oldalakhoz való csatlakoztatását, elegendő csak egy nyelvi utasítást használni (a PHP-ben minden szkript utasítássorozatból áll). Ez a fájlok csatlakoztatására vonatkozó utasítások négy lehetséges opciója lehet:

• tartalmazza;
• megkövetelik;
• szerepel_egyszer;
• igényel_egyszer.

Nincs értelme itt leírni funkcióikat, mivel ezt részletesen elmagyarázzák a kézikönyvekben, például a "http://www.puzzleweb.ru/php/26_inc_files.php" hivatkozás segítségével jól kitalálhatja.

Az oldal létrehozásakor a "require_once" utasítást fogjuk használni, én ezt szoktam használni, számomra ez a legkényelmesebb.

Nos, most, hogy kitaláltuk, mit fogunk tenni, térjünk át a gyakorlati tevékenységekre.

Egy dinamikus oldal blokkjait alkotjuk

Ahhoz, hogy blokkokat hozzon létre, amelyek ezután részt vesznek a weboldalak összeállításában, először létre kell hoznia azokat. Ez ugyanúgy történik a Notepad++ szövegszerkesztőben, mint ahogy a cikkben létrehoztuk az első webhelyfájlt, az "index.html". Hozzon létre egy weboldalt, és tárolja azt egy helyi webszerveren. Csak a kiterjesztést ebben az esetben nem "html", hanem "php"-t kell megadni. Ugyanakkor ügyelni kell a kódolásra, hogy a jövőben elkerüljük a különféle értelmezhetetlen karakterek megjelenését az oldalakon.

A fájlok egy külön, újonnan létrehozott "blokkok" mappában jönnek létre. Az összes oldalon közös fájlokhoz a megfelelő blokkok nevei alapján adunk nevet. A "fő" blokkhoz pedig egy konkrét nevet adunk meg a webhely minden oldalához.

Így a főoldalhoz a "block_glavnaya" nevű fájlt a "fő" blokkhoz kapcsoljuk. A többi: „fejléc”, „szakasz”, „félre” és „lábléc”.

Fájlok létrehozásakor azt is figyelembe veheti, hogy ennek az eljárásnak az egyszerűsítése érdekében a "Fájl" menü segítségével lehetőség van a másolásra, a "Mentés másként" mentéskor új fájlnév megadásával.

Általánosságban elmondható, hogy a fájlok létrehozása szabványos eljárás, így nem lehetnek nehézségek. A végén így kell kinéznie.

Ezután minden blokk tartalmát átmásoljuk és átmásoljuk a megfelelő fájlba. Nézzük meg ezt részletesebben a „fejléc.php” példa segítségével.

1. Nyissa meg az "index.html" fájlt a Notepad++ szerkesztőben, válassza ki a "fejléc" blokk kívánt területét, és váltakozva nyomja meg az egér jobb és bal gombját a vágólapra másoláshoz.

Megjegyzendő, hogy ide a blokk összes tartalmát másoljuk, kivéve a menüt. Ennek az az oka, hogy az aktív menügombot tükrözze a címke attribútumaiban

szükséges, hogy minden oldal értéket rendeljen az osztályosztályhoz "aktív". Ugyanez vonatkozik a „lábléc” blokk hasonló töredékére is.

A jövőben ezeket a "fejléc" és "lábléc" blokkokban lévő menütöredékeket is külön fájlokba helyezzük át, de egyelőre nem bonyolítjuk őket, és egy helyen hagyjuk őket.

A „fejléc” blokk töredékének kijelölése és vágólapra másolása az alábbi képernyőképen látható.

3. És végül, annak érdekében, hogy a fájl tartalmát a Notepad ++-ban bal oldalra tolja, többször meg kell nyomnia a "Tab" billentyűt, miközben lenyomja a "Shift" gombot. Ennek eredményeként a generált "header.php" fájlt a következő formában kapjuk meg.

Ugyanezt fogjuk tenni más fájlokkal is. Az alábbi képernyőképek megmutatják, hogyan fog kinézni a tartalmuk, ha az összes szükséges műveletet elvégezte.

6. ábra "section.php" fájl

7. ábra "block_glavnaya.php" fájl

8. ábra "aside.php" fájl

9. ábra "footer.php" fájl

Így megkaptuk az összes fájlt a dinamikus oldal létrehozásához, és most már közvetlenül a HTML kódjához tudunk lépni.

Weboldal átalakítása statikusról dinamikusra

Annak érdekében, hogy főoldalunk betöltse az előző részben létrehozott fájlokat, először meg kell változtatnia az "index" fájl kiterjesztését "html"-ről "php"-re, majd újra meg kell nyitnia a Notepad++ szerkesztőben, és a következő változások:

• Törölje a blokkok tartalmát, amelyeket korábban átvitt az újonnan létrehozott fájlokhoz.
• Írjon "require_once" utasításokat PHP-ben a felszabadult területre, jelezve a megfelelő fájlok elérési útját.
• A menü címkéiben
• , amelyek az oldalak elérési útját jelzik, a főoldalnál módosítsa a kiterjesztést "html"-ről "php"-re, a többinél pedig adja meg az újonnan létrehozott oldalak nevét.
• A címben adja meg az "Otthon" kifejezést.

Ezen műveletek elvégzése után a főoldalunknak így kell kinéznie.

A fenti képernyőképen láthatja, hogy az összes PHP utasítás egy nyitó címkével van kiemelve. Ez a jelölés arra szolgál, hogy jelezze, mikor kell elindítani és leállítani a PHP-ben írt kód feldolgozását. Ezért a jövőben minden PHP kódot ezzel a jelöléssel fog megkülönböztetni.

Arra is lehet figyelni, hogy az új oldalak nevei a céljuk figyelembevételével készülnek, így jobban áttekinthető az oldal szerkezete, kódja.

Ezzel minden átalakulásunk teljessé válik. És most, ha újra megnyitjuk a főoldalt a böngészőben, akkor az oldal előző verziójával nem láthatunk változást, ugyanúgy meg kell nyílnia, mint korábban. De ha az eredmény valami rossz, akkor ez azt jelenti, hogy meg kell keresnie a fenti műveletekben elkövetett hibát.

Frissítsük most a böngészőt, és próbáljuk meg megnyitni a főoldalt.

Mint látható, esetünkben a főoldal probléma nélkül megnyílt. De az oldal korábbi munkájával ellentétben az oldal a kérés feldolgozása során a szerveren történő formálás eredményeként szerezte meg ezt az űrlapot.

Így oldalunknak most van az első dinamikus oldala. És miután további hasonló oldalakat is hozzáadtunk hozzá, ezt az oldalt joggal nevezhetjük dinamikusnak az ebből fakadó összes következménnyel együtt, pl. a dinamikus webhelyekben rejlő összes előnnyel rendelkezik. Ezt pedig akkor tudjuk ellenőrizni, ha a jövőben különféle funkciókkal töltjük fel.

Ezzel az oldalfejlesztésnek ezt a fontos szakaszát befejezzük és a következő cikkben új, dinamikus oldalakat készítünk hozzá. Az oldal legfrissebb verziójának forráskódjai a szokásos módon letölthetők a cikk végén található linkről.

A webhely forrásfájljai

Az oldal forrásfájljai az ebben a cikkben elvégzett frissítésekkel a mellékelt oldalról letölthetők kiegészítő anyagok.

Óvintézkedéseket kell tenni. Mert az erőforrás rendkívül dinamikusnak bizonyulhat. Az és nézd, harapj!

PHP és HTML

Mára ez a két tudományág szinte összefügg. Az ő tandemük az az alap, amelyre az internet nagy részének "élete" épül. Természetesen más szerveroldali nyelvek (Perl, ASP.NET) is használatosak a html-mel együtt. De elterjedtségük a World Wide Web-en a PHP-hez képest pusztán epizodikus.

A statisztikák szerint az Internet legtöbb forrásának architektúrája php és html alapján épül fel.

Sok kezdő számára érthetetlennek tűnik e technológiák közötti kapcsolat. Egyrészt statikus html , amit a böngészők kliens oldalon értelmeznek. Másrészt ez egy programozási nyelv, amelyet a szerver dolgoz fel. Ezért, mielőtt a semmiből írna egy webhelyet php-ben, egy egyszerű példát adunk a két technológia kölcsönhatására:

• Hozzunk létre egy új fájlt php kiterjesztéssel;
• Tegyük oda a következő kódot:

Mennyi az idő most?

• Mentsük a fájlt a helyi szerverre, és nyissa meg a böngészőben. Ezután kattintson a jobb egérgombbal, és válassza a " html oldal megtekintése».

Ahogy a képernyőképen is látható, a vonalnem jelenik meg az oldal html kódjában. A böngészőben és a kódban is csak a visszaadott dátum és idő látható. Ez azt jelenti, hogy a szkriptet a szerver oldalon dolgozták fel. Ezért egy webhely php-ben történő létrehozása alapvetően különbözik az egyszerű html oldalak írásától.

Dinamikus webhely

Manapság két fő webhelytípus létezik:

• Statikus - csak html alapján készült. Az ilyen webhelyek nem változtatják meg tartalmukat a felhasználói műveletek hatására. Természetesen egy statikus erőforrás reagálhat az eseményekre és a felhasználói műveletekre. Az oldaldinamizmus kliensoldali megvalósítása azonban szűk hatókörrel rendelkezik, amelyet a Java Script képességei korlátoznak.

A Java Script kód az ügyféloldali böngészőben fut.

• Dinamikus - állapotuk és tartalmuk megváltoztatására képes - dinamikus oldalak html oldalai menet közben, kódvégrehajtáskor jönnek létre, válaszul a böngészőből a szervernek küldött felhasználói kérésre. A szerveroldali oldalgenerálás leggyakrabban php-ben írt kód használatával történik.

Egy dinamikus php webhely a következő fájlokból áll:

• Az index.php a fő projektfájl;
• Sablonok – tartalmazzák az oldal egy bizonyos részének szerkezetét ( sapkák, pince, főtest);
• CSS-fájlok – tárolják az erőforrás összes stílusleírását.

Ezenkívül a webhelyprojekt állhat olyan fájlokból, amelyek a php függvények és metódusok kódját tárolják. És tartalmazzon egy adatbázist is.

A legtöbb CMS-ben a szerver oldalon dinamikusan generált oldalak kitöltésének tartalomforrása az adatbázis. A leggyakrabban használt adatbázis a MySQL.

Hogyan írjunk weboldalt PHP-ben

Hogy megértsük, hogyan jön létre egy webhely php-ben, nézzünk meg egy gyakorlati példát. Természetesen sok minden le van egyszerűsítve, de a teljes munkamechanizmus és a teremtés szakaszai megmaradnak.

Van egy html oldalam a következő felépítéssel és kialakítással:

A kódja:

Egy sapka

Tartalom

• 1. szakasz
• 2. szakasz
• 3. szakasz
• 4. szakasz
• 5. szakasz

Pince

style.css fájl kódja:

Fejléc (margó-bal:auto; margó-jobb:automatikus; margó-alsó:10px; szélesség:1000px; magasság:100px;szegély:1px tömör #000000; háttér: #009966;háttérkép:url(img/1. gif); ) .pages ( margó-bal:automatikus; margó-jobb:automatikus; szélesség:1000px; ) .content (margó-jobb:10px; szélesség:806px; magasság:450px; szegély:1px tömör #000000; háttér: #999999; lebegés:bal; .oldalsáv (szélesség:180px; magasság:450px;szegély:1px tömör #000000; háttér: #FF9900; lebegés:bal; ) .láb (tiszta:mindkettő; ) .footer (margó-felül :10px; margó-bal:auto; margó-jobb:automatikus;szélesség:1000px; magasság:50px;szegély:1px tömör #000000; háttér: #333399; )

Mielőtt egy webhelyet php-ben a végére írna, az összes html-kódot el kell osztani több fájl között:

• A Header.php tartalmazza az összes kódot a "fejléc" réteg elejétől a végéig;
• A footer.php-ben - "láb" és "lábláb" réteg;
• A content.php-ben - az összes kód középen maradt.

Most létrehozzuk a fő index.php oldalt, amely a szükséges tervezési elemek kódját tartalmazó fájlhívásokat tartalmazza majd. Összesen csak 3 sor volt a szkriptből a főfájlban:

És ha a böngészőben megnézed az oldal html kódját, akkor az eredeti forrás kódját látod:

Természetesen ez a lehetőség csak az oldal főoldalának generálására alkalmas. De ha az oldalsáv kódját egy külön fájlban távolítják el, akkor a sablon felhasználható az oldal belső oldalainak generálására is.

A kerülő út

De az ilyen webhelyfejlesztés erőfeszítést, speciális szoftverek és ismeretek rendelkezésre állását igényel. Ezért szeretnék egy egyszerűbb lehetőséget találni. Ezután a PHP webhelykészítőt kell használnia.

Ezek egy speciális sablonkészlet széles beállítási skálával. Emiatt nagyon hasonlítanak a hagyományos CMS-hez. Természetesen senki nem garantálja a leendő webhely kialakításának magas egyediségét, és a jövőben problémák adódhatnak az erőforrás átvitelével és adaptálásával egy másik tárhelyre vagy platformra. Íme néhány bevált lehetőség az ilyen online szolgáltatásokhoz.

Hozzon létre egy hello.php nevű fájlt, és helyezze el a webszerver gyökérkönyvtárába (DOCUMENT_ROOT) a következő tartalommal:

1. példa Az első PHP szkriptünk: hello.php

Helló Világ

" ; ?>

Használja böngészőjét a fájl eléréséhez webszerverének URL-címével, amely a következővel végződik: /hello.php fájl hivatkozás. Helyi fejlesztéskor ez az URL valami hasonló lesz http://localhost/hello.php vagy http://127.0.0.1/hello.php de ez a webszerver konfigurációjától függ. Ha minden megfelelően van beállítva, akkor ezt a fájlt a PHP elemzi, és a következő kimenetet küldi el a böngészőjének:

Helló Világ

Ez a program rendkívül egyszerű, és valóban nem kellett PHP-t használnia egy ilyen oldal létrehozásához. Mindössze annyit tesz, hogy megjeleníti: Helló Világ PHP segítségével visszhang nyilatkozat. Vegye figyelembe, hogy a fájl nem kell végrehajthatónak lennie vagy bármilyen módon különleges. A szerver rájön, hogy ezt a fájlt a PHP-nek kell értelmeznie, mert a ".php" kiterjesztést használta, amelyet a szerver úgy van beállítva, hogy továbbadja a PHP-nek. Tekintsd ezt egy normál HTML-fájlnak, amely történetesen egy sor speciális címkével rendelkezik, amelyek sok érdekes dolgot végeznek.

Ha kipróbáltad ezt a példát, és nem írt ki semmit, letöltést kért, vagy a teljes fájlt szövegként látod, akkor valószínű, hogy a szerveren, amelyen tartózkodsz, nincs engedélyezve a PHP, vagy nincs megfelelően beállítva. Kérje meg a rendszergazdát, hogy engedélyezze ezt Önnek a kézikönyv Telepítés fejezetében. Ha helyben fejleszt, olvassa el a telepítési fejezetet is, hogy megbizonyosodjon arról, hogy minden megfelelően van beállítva. Győződjön meg arról, hogy a fájlt http-n keresztül éri el a kimenetet biztosító szerverrel. Ha csak előhívja a fájlt a fájlrendszeréből, akkor a PHP nem fogja elemezni. Ha a problémák továbbra is fennállnak, ne habozzon, használja a számos lehetőség egyikét.

A példa lényege a speciális PHP címke formátum bemutatása. Ebben a példában használtuk PHP címke kezdetének jelzésére. Ezután betettük a PHP utasítást, és a záró tag hozzáadásával kiléptünk a PHP módból, ?> . Egy ilyen HTML-fájlban bárhol be- és kiléphet a PHP módból. További részletekért olvassa el az alapvető PHP szintaxis kézikönyv szakaszát.

jegyzet: Megjegyzés a soremelésekről

A soremeléseknek kevés jelentése van a HTML-ben, de még mindig jó ötlet, hogy a HTML-kódot szép és letisztult megjelenésűvé tegye soremelések beiktatásával. Egy soremelés, amely közvetlenül a zárás után következik ?> PHP eltávolítja. Ez rendkívül hasznos lehet, ha sok PHP blokkot teszel bele, vagy olyan PHP-t tartalmazó fájlokat tartalmaz, amelyeknek nem kellene semmit kiadniuk. Ugyanakkor kissé zavaró is lehet. A bezárás után szóközt tehetsz ?> szóköz és soremelés kényszerítéséhez, vagy behelyezhet egy explicit soremelést a PHP blokkon belüli utolsó visszhangba/nyomtatásba.

jegyzet: Megjegyzés a szövegszerkesztőkről

Számos szövegszerkesztő és integrált fejlesztési környezet (IDE) használható PHP-fájlok létrehozására, szerkesztésére és kezelésére. Ezen eszközök részleges listája a » PHP szerkesztők listája címen található. Ha szerkesztőt szeretne ajánlani, látogasson el a fenti oldalra, és kérje meg az oldal karbantartóját, hogy a szerkesztőt vegye fel a listára. Hasznos lehet egy szintaktikai kiemeléssel rendelkező szerkesztő.

jegyzet: Megjegyzés a szövegszerkesztőkről

Az olyan szövegszerkesztők, mint a StarOffice Writer, a Microsoft Word és az Abiword, nem optimálisak a PHP-fájlok szerkesztéséhez. Ha szeretne egyet használni ehhez a tesztszkripthez, gondoskodnia kell arról, hogy a fájlt más néven mentse egyszerű szöveg vagy a PHP nem fogja tudni olvasni és végrehajtani a szkriptet.

jegyzet: Megjegyzés a Windows Jegyzettömbhöz

Ha a PHP-szkripteket a Windows Jegyzettömb használatával írja, gondoskodnia kell arról, hogy a fájlok .php kiterjesztéssel legyenek mentve. (A Jegyzettömb automatikusan .txt kiterjesztést ad a fájlokhoz, hacsak nem hajtja végre a következő lépések egyikét a megelőzés érdekében.) Amikor elmenti a fájlt, és a rendszer kéri, hogy adjon nevet a fájlnak, tegye idézőjelbe a fájlnevet (azaz "hello.php" "). Alternatív megoldásként kattintson a "Mentés" párbeszédpanel "Szöveges dokumentumok" legördülő menüjére, és módosítsa a beállítást "Minden fájl"-ra. Ezután megadhatja a fájlnevét idézőjelek nélkül.

Most, hogy sikeresen elkészített egy működő PHP szkriptet, ideje elkészíteni a leghíresebb PHP szkriptet! Hívjon a phpinfo() függvényt, és sok hasznos információt fog látni a rendszerről és a beállításokról, mint például az elérhető előre definiált változók, betöltött PHP modulok és konfigurációs beállítások. Szánjon egy kis időt, és tekintse át ezeket a fontos információkat.

2. példa Rendszerinformációk beszerzése a PHP-ből

Helló! Most megpróbáljuk megvalósítani a legegyszerűbb regisztrációt az oldalon a PHP + MySQL használatával. Ehhez telepíteni kell az Apache-t a számítógépére. A szkriptünk működése az alábbiakban látható.

1. Kezdjük a felhasználók tábla létrehozásával az adatbázisban. Tartalmazni fogja a felhasználói adatokat (bejelentkezés és jelszó). Menjünk a phpmyadmin oldalra (ha létrehoz egy adatbázist a számítógépén http://localhost/phpmyadmin/). Hozzon létre egy táblázatot felhasználókat, akkor 3 mezője lesz.

Én mysql adatbázisban készítem, másik adatbázisban is létrehozhatod. Ezután állítsa be az értékeket az ábrán látható módon:

2. Csatlakozás ehhez a táblázathoz szükséges. Hozzunk létre egy fájlt bd.php. A tartalma:

$db = mysql_connect("az Ön MySQL szervere","bejelentkezés erre a szerverre","jelszó ehhez a szerverhez");
mysql_select_db ("a csatlakozáshoz szükséges adatbázis neve", $db);
?>

Az én esetemben így néz ki:

$db = mysql_connect("localhost","felhasználó","1234");
mysql_select_db("mysql",$db);
?>

spórolunk bd.php.
Nagy! Van egy táblánk az adatbázisban, kapcsolatunk vele. Most elkezdhet létrehozni egy oldalt, ahol a felhasználók meghagyják adataikat.

3. Hozzon létre egy reg.php fájlt tartalommal (minden megjegyzés benne):

Bejegyzés

Az Ön bejelentkezési neve:

A jelszavad:

4. Hozzon létre egy fájlt, amely adatokat visz be az adatbázisba és menti a felhasználót. save_user.php(belül megjegyzések):

{
}
//ha megadja a bejelentkezési nevet és a jelszót, akkor azokat feldolgozzuk, hogy a címkék és a szkriptek ne működjenek, soha nem tudhatod, mit adhatnak meg az emberek


// felesleges szóközök eltávolítása
$bejelentkezés = trim($login);
$jelszó = trim($jelszó);
// csatlakozik az adatbázishoz
// ellenőrizze, hogy létezik-e azonos bejelentkezési névvel rendelkező felhasználó
$result = mysql_query("SELECT id FROM user WHERE login="$bejelentkezés"",$db);
if (!üres($myrow["id"])) (
exit("Sajnos a megadott felhasználónév már regisztrálva van. Adjon meg másik felhasználónevet.");
}
// ha nincs, akkor mentse az adatokat
$result2 = mysql_query ("INSERT INTO user (bejelentkezés,jelszó) VALUES("$bejelentkezés","$jelszó")");
// Ellenőrizze, hogy vannak-e hibák
if ($eredmény2=="IGAZ")
{
echo "Sikeres regisztráció! Most már beléphet az oldalra. Főoldal";
}
más(
echo "Hiba! Nincs bejelentkezve.";
}
?>

5. Felhasználóink ​​most már regisztrálhatnak! Ezután egy "ajtót" kell készítenie, hogy belépjen az oldalra a már regisztrált felhasználók számára. index.php(belül megjegyzések):

// az egész eljárás munkameneteken működik. Ebben tárolódnak a felhasználó adatai, amíg az oldalon tartózkodik. Nagyon fontos az oldal legelején elindítani őket!!!
session_start();
?>

Főoldal

Az Ön bejelentkezési neve:

A jelszavad:

Regisztráció

// Ellenőrizze, hogy a bejelentkezési és a felhasználói azonosító változók üresek-e
if (üres($_SESSION["bejelentkezés"]) vagy üres($_SESSION["id"]))
{
// Ha üres, nem jelenítjük meg a hivatkozást
echo "Vendégként vagy bejelentkezve
Ez a link csak regisztrált felhasználók számára érhető el";
}
más
{

Fájlban index.php megjelenítünk egy linket, amely csak regisztrált felhasználók számára lesz nyitva. Ez a szkript lényege – korlátozni kell az adatokhoz való hozzáférést.

6. Van egy fájl a megadott bejelentkezési név és jelszó ellenőrzésével. testreg.php (megjegyzések belül):

session_start();// az egész eljárás munkameneteken működik. Ebben tárolódnak a felhasználó adatai, amíg az oldalon tartózkodik. Nagyon fontos az oldal legelején elindítani őket!!!
if (isset($_POST["bejelentkezés"])) ( $bejelentkezés = $_POST["bejelentkezés"]; if ($login == "") ( unset($login);) ) //beírja a bejelentkezést a felhasználót a $login változóba, ha az üres, akkor megsemmisítjük a változót
if (isset($_POST["jelszó"])) ( $jelszó=$_POST["jelszó"]; if ($jelszó =="") ( unset($password);) )
//a felhasználó által beírt jelszót tedd a $password változóba, ha üres, akkor töröld a változót
if (empty($login) or empty($password)) //ha a felhasználó nem adott meg bejelentkezési nevet vagy jelszót, akkor hibát adunk ki és leállítjuk a szkriptet
{
exit("Nem adott meg minden információt, menjen vissza és töltse ki az összes mezőt!");
}
//ha megadja a bejelentkezési nevet és a jelszót, akkor azokat feldolgozzuk, hogy a címkék és a szkriptek ne működjenek, soha nem tudhatod, mit adhatnak meg az emberek
$bejelentkezés = stripslashes($bejelentkezés);
$bejelentkezés = htmlspecialchars($bejelentkezés);
$jelszó = stripslashes($jelszó);
$jelszó = htmlspecialchars($jelszó);
// felesleges szóközök eltávolítása
$bejelentkezés = trim($login);
$jelszó = trim($jelszó);
// csatlakozik az adatbázishoz
include("bd.php");// a bd.php fájlnak ugyanabban a mappában kell lennie, mint a többieknek, ha nem, akkor csak módosítsa az elérési utat

$result = mysql_query("SELECT * FROM felhasználók WHERE login="$bejelentkezés"",$db); //a megadott bejelentkezési névvel rendelkező felhasználó összes adatának lekérése az adatbázisból
$myrow = mysql_fetch_array($eredmény);
if (üres($myrow["jelszó"]))
{
//ha a megadott bejelentkezési névvel rendelkező felhasználó nem létezik
}
más(
//ha létezik, ellenőrizze a jelszavakat
if ($myrow["jelszó"]==$jelszó) (
//ha a jelszavak egyeznek, akkor elindítjuk a munkamenetet a felhasználó számára! Gratulálhatsz neki, belépett!
$_SESSION["bejelentkezés"]=$myrow["bejelentkezés"];
$_SESSION["id"]=$myrow["id"];//ezeket az adatokat nagyon gyakran használják, így a bejelentkezett felhasználó "viszi"
echo "Sikeresen bejelentkezett az oldalra! Főoldal";
}
más(
//ha a jelszavak nem egyeznek

Exit("Elnézést, a megadott bejelentkezési név vagy jelszó helytelen.");
}
}
?>

Rendben, most mindennek vége! Lehet, hogy a lecke unalmas, de nagyon hasznos. Itt csak a regisztráció ötlete jelenik meg, majd javíthatja: védelmet, tervezést, adatmezőket ad hozzá, avatarokat tölt fel, jelentkezzen ki a fiókjából (ehhez egyszerűen törölje a változókat a munkamenetből a funkcióval nincs beállítva) stb. Sok szerencsét!

Mindent megnéztem, jól működik!

Tematikus anyagok:

Jelentkezzen be a Yandex lemez bejelentkezési jelszavába

Danil Fimushkin Adobe animációban dolgozik

Hogyan irányítsuk az egeret a billentyűzetről

Mi az a skype protokoll?

módosítsa a témát Windows 10-re

Program hozzáadása a víruskereső kizárásokhoz Kizárások hozzáadása a Norton Securityhez

Hogyan telepítsünk ingyenes Yandex böngészőt a számítógépre

A GPT lemezekkel kapcsolatos probléma megoldása a Windows telepítésekor

Frissítve: 2020.12.23

103583

Ha hibát észlel, jelöljön ki egy szövegrészt, és nyomja meg a Ctrl + Enter billentyűket