Help — segítség (leírások)

Általános leírás - segítség a weboldalak kezeléséhez
Program- és adatkönyvtárak és adatfájlok leírása
Albumkezelés leírása
Bootstrap alapok
"Jumbotron" típusú lapok kezelése
"Alert" típusú lapok kezelése
Füles lapok (tab) leírása
Adatfájlok letöltése, feltöltése
Készítette és készítgeti: burcsi
Megjegyzéseket, javaslatokat levélben kérem
Segítség a weboldalak kezeléséhez
weboldal méreteinek módosítása
- Ctrl + plusz - oldal nagyítása
- Ctrl + mínusz - oldal kicsinyítése
- Ctrl + 0 - oldal eredeti méretre visszaállítás
keresés az aktuális oldalon
- Ctrl + F billentyűkombinációval vagy F3 billentyűvel kezdeményezhető
- a lenn megjelenő ablakba gépeljük be a keresett szót vagy szótöredéket
a forrásfálj megtekintése
- Ctrl+U billentyűkombináció
- benn szöveg / kép kereshető (most is használható a Ctrl+F)
- kiemelt dolgokra (link / kép / css fájl) kattinthatunk
weboldal és összetevőinek mentése
weboldal mentése
- Ctrl+S (a teljes oldal képestől mindenestől / vagy csak az eredeti html fájl)
szöveg mentése
- szöveg kijelölése, majd
- Ctrl+C (a számítógép megjegyzi a kijelölt szöveget)
- a szövegszerkesztőben vagy a levelezőben
- Ctrl+V
kép mentése
- jobb egérgombbal katt a képre, majd
- az úszómenüből "Kép mentése más néven ..." vagy "Kép mentése másként ..."
↑ Vissza a help menüre ↑
A weboldal könyvtárai, fájljai
A könyvtárrendszer
Gyökérkönyvtár, itt minden fájl tabu !!!
- index.php – főprogram, ez vezérli az egész rendszert (fejrész, menü, változó törzsrész, lábrész), használata: index.php
- zbox.php – képkezelő program (képek megjelenítése, képaláírások kezelése), használata (...-az album neve): zbox.php?dir=...
- help.php – a Help oldalak menüjét indítja
Az alábbi könyvtárak fájljait lehetőleg ne módosítsuk !!!
- assets – megjelenést/formázást beállító (css) és javascript (js) vezérlő programok, stb.
- incl – PHP alprogramok és HTML betétprogramok
- help – itt a (most is nézegetett) help/segítség anyagai
- imgs – a weboldalak rendszerképei
A következő könyvtárak fájljait módosíthatjuk, sőt erre lettek létrehozva!
- album – itt a fényképgalériák képei
- album/epkmoso – az épülő kamionmosó képei
- album/epthely – az épülő telephely képei
- album/vegyes – vegyes képek
- album/humor – humoros képek
Adatkönyvtárak főbb alkönyvtárai, fájljai
data0 / adatfájlok
- about.txt – a Rólunk menü magyar szövege
- mtars.txt – a Munkatársak menü magyar szövege
- szolg.txt – a Szolgáltatások menü magyar szövege
- cegdat.txt – a Kapcsolat menü magyar szövege (cégadatok)
data1 / adatfájlok
- a fentihez hasonlóan az angol szövegek
data2 / adatfájlok
- a fentihez hasonlóan a német szövegek
data / általános adatfájlok
- bolcs.txt – bölcsességek szövege
- nevtar.txt – névnapok listája a jelentéssel
- linkek.txt – a lábrészben lévő hasznos weboldalak/linkek adatai
Képkönyvtárak főbb alkönyvtárai, fájljai
imgs / alkönyvtárak
- about – a Rólunk menü képei
- mtars – a Munkatársak menü képei
- szolg – a Szolgáltatások képei
↑ Vissza a help menüre ↑
Fényképalbum kezelése
A használt fogalmak
- album - a programban szükséges képkönyvtárak gyűjtőhelye (ez a főkönyvtár)
- album/alkönyvtár - egy esemény/dolog képei ebben vannak összegyűjtve (képkönyvtár)
A könyvtárak/képkönyvtárak felépítése
- a képkönyvtár képei .jpg fájlok (pl. borbely_sz.jpg, csallo_r.jpg, ..., vagy egyszerűen 01.jpg, 02.jpg, ... )
- méreteiket célszerű max. 1200px szélesre vagy magasra csökkenteni (letöltési sebesség csökkentése!)
- készül egy 00.txt szövegfájl is a képaláírásokhoz (ez kötelező!)
A 00.txt felépítése, használata
- könyvtár_főcíme | könyvtár_alcíme | fényképész_neve vagy kép_származási_helye
- kép_neve1 | képaláírás1 (az első kép, a Képnévnél a "jpg"-t nem írjuk ki!)
- kép_neve2 | képaláírás2 (a második kép)
- ...
- stb.
- a képek megjelenési sorrendjét a 00.txt fájlbeli sorrendjük adja
A kép nevében ne használjunk space-t és ne használjunk ékezetes karakterek-et!
(A képaláírásban természetesen szabad!)
Képmegjelenítő program (a képre kattintva indul)
- a kép az zbox.php hívását mutatja; az "album" a főkönyvtár, a "humor" a benne lévő alkönyvtár
Bélyegképes nézet
- a könyvtárban lévő képek kicsinyítve jelennek meg (bélyegképek)
- a bélyegképre téve az egérkurzort, megjelenik a képaláírás (ha van!) vagy a kép neve
- a képre rákattintva az megjelenik nagyban (lásd Nagyképes nézet!)
Nagyképes nézet
- az alul látható miniképre kattintva azt nagyban láthatjuk
- az itt lévő kis nyilakra kattintva kaphatjuk az előző illetve a következő nagy képet
- a nagykép alatt látható a kép neve, felette a kép sorszáma (a / után az össz-darabszám)
- a nagykép jobboldalán a kék ikonokkal nagyítható illetve kicsinyíthető a nagykép
- a bal felső nyíl ikon elindítja a vetítés módot (a helyette megjelenő ikon leállítja)
- a jobb felső X ikon visszaállítja a bélyegképes nézetet
↑ Vissza a help menüre ↑
Röviden a bootstrap-ról
Aktuális verzió
A weboldalon használt bootstrap verzió: 4.5.0 (ez nem a legújabb!)
Meggyőződhetünk erről, ha: megnyomjunk a Ctrl+U-t, megkeressük a forrásprogramban fenn a "bootstrap.min.css" vagy lenn a "bootstrap.min.js" fált, és rákattintunk valamelyikükre.
Lényege
A Bootstrap keretrendszer 12 hasábos, responsive rácsrendszert használ (responsive - az oldal tartalma az éppen aktuális képernyőfelbontásnak megfelelően jelenik meg).
Három fő szerkezeti egység van:
- a fő befoglaló elem a .container osztály
- a .container elemen belül sorokat hozhatunk létre a .row osztály kijelölő segítségével
- A .row elemen belül a .col-xs- (<768px), .col-sm- (>=768px), .col-md- (>=992px), .col-lg- (>=1200px) prefixek segítségével adhatunk meg oszlopokat
Az egyes .row elemeken belüli oszlopok összegének összesen 12-nek kell lennie! Az oszlopok mindkét oldalán 15px köz van.
Néhány példa
Két egyforma oszlop
6 oszlop
6 oszlop
Három különböző oszlop
7 oszlop
2 oszlop
3 oszlop
A fentiek kódja (asztali számítógépre, vázlatosan)

A Bootstrap különböző eszközökön
eszköz típusa | extra kicsi (extra small) mobil (<768px) | kicsi (small) tablet (≥768px) | közepes (medium) desktop (≥992px) | nagy (large) desktop (≥1200px) |
---|---|---|---|---|
class előtag | col-xs- | col-sm- | col-md- | col-lg- |
container szélessége | automatikus | 750px | 970px | 1170px |
oszlopok szélessége | automatikus | ~62px | ~81px | ~97px |
Néhány Bootsrap link
Megjegyzés: Ezen oldal forrásában is felfedezhető jó néhány Bootsrap elem (célszerű először a forrásprogram legalján szemlélődni!).
↑ Vissza a help menüre ↑
"Jumbotron" típusú lapok kezelése
Példa
<div class='jumbotron bg-warning'> <h1>Rólunk</h1> <p>Cégünk tizenöt éves múltra tekint vissza a nemzetközi fuvarozás terén.</p> <p>1993-ban kezdte meg működését, 2 db 3, 5 tonnás gépjárművel.</p> <a class='btn btn-success btn-lg' href='#'>Astor Konzorcium</a> </div>
Rövid magyarázat:
- bg-warning a lap háttérszíne sárga
- btn-success a gomb háttérszíne zöld
- btn-lg a gomb nagy legyen
A többi könnyen használható szín az "Alert típusú lapok"-nál található.

↑ Vissza a help menüre ↑
"Alert" típusú lapok kezelése
Két példa
<div class='alert alert-info'> <h3>Astor Konzorcium</h3> <h4>Fuvarozás</h4> <p>Vállalkozásunk tevékenységében kiemelt szerepet tölt be a szállítmányozás. Megbízóink rendelkezésére állunk a szállítmányozás minden területén, közúti, tengerentúli és légi forgalomban egyaránt.</p> <a class="btn btn-info btn-lg" href="#">Astor Konzorcium</a> </div>

<div class='alert alert-danger'> <h3>Astor Konzorcium</h3> <h4>Fuvarozás</h4> <p>Vállalkozásunk tevékenységében kiemelt szerepet tölt be a szállítmányozás. Megbízóink rendelkezésére állunk a szállítmányozás minden területén, közúti, tengerentúli és légi forgalomban egyaránt.</p> <a class="btn btn-danger btn-lg" href="#">Astor Konzorcium</a> </div>

Ajánlott variációk (zárójelben a színben illő "gomb-variáció"):
- alert-success (btn-success) – zöld
- alert-info (btn-info) – halv.kék
- alert-warning (btn-warning) – sárga
- alert-danger (btn-danger) – vörös
- alert-primary (btn-primary) – kék
- alert-light (btn-light) – világos
- alert-secondary (btn-secondary) – szürke
- alert-dark (btn-dark) – sötétszürke
↑ Vissza a help menüre ↑
Füles lapok (tab)
A modern weboldalakon helytakarékosság megoldásként használhatunk füles- (tab) illetve redőnyszerű (accordion) lapokat. Ezen típusok többrétegű lapnak tekinthetők, mindig csak a teljes tartalom egy választott része jelenik meg.
Egy megvalósítás a kezdőoldalról
Az előbbi weboldalrész vázlatos kódja (a kód részletesebb magyarázattal)
<div class='row'> <div class='col-lg-2'> <ul class='nav nav-tabs flex-column'> <li class='nav-item'><a data-toggle='tab' href='#tab-1' class='nav-link active show'>Fuvarozás</a></li> <li class='nav-item'><a data-toggle='tab' href='#tab-2' class='nav-link'>Raktározás</a></li> <li class='nav-item'><a data-toggle='tab' href='#tab-3' class='nav-link'>Ládamosás</a></li> </ul> </div> <div class='col-lg-10'> <div class='tab-content'> <div id='tab-1' class='tab-pane active show'> <p>Az <b>Astor Konzorcium</b> szolgáltatásai nem csupán .....</p> <p>.....</p> </div> <div id='tab-2' class='tab-pane'> <p>2008-ban kedvező közlekedési kapcsolatokkal megépült Ajka ipari övezetében .....</p> <p>.....</p> </div> <div id='tab-3' class='tab-pane'> <p>Vállalkozásunk rendelkezik egy komplex ipari ládamosó .....</p> <p>.....</p> </div> </div> </div> </div>
A fenti kód "működés közben"
Az Astor Konzorcium szolgáltatásai nem csupán a saját fuvareszközzel végzett nemzetközi fuvarozásra korlátozódnak. Vállalkozásunk tevékenységében kiemelt szerepet tölt be a szállítmányozás.
Megbízóink rendelkezésére állunk a szállítmányozás minden területén, közúti, tengerentúli és légi forgalomban egyaránt.
Szolgáltatásainkkal igyekszünk a megbízók egyedi igényeihez rugalmasan alkalmazkodni, testre szabott, szakszerű megoldásokat kínálva szállítmányozási problémáikra.
.....
2008-ban kedvező közlekedési kapcsolatokkal megépült Ajka ipari övezetében 1.500 m2 alapterületü, 7.5 m belmagasságú raktárunk. A beépített állványrendszernek köszönhetően 1500 Euro-paletta elhelyezését teszi lehetővé biztonságos körülmények között.
Partnereinknek lehetősége nyílik cégünk raktári illetve szállítmányozási szolgáltatásainak igénybevételével különböző reexport ügyletek lebonyolítására is. Az egyszerű raktári feladatokon túl vállaljuk raktári értéknövelő szolgáltatások, egységrakomány-képzés végrehajtását. Ezen felül vállaljuk árukészletek részletenkénti, rendszeres ki- illetve betárolását, Just-In-Time típusú alap- és csomagoló anyag beszállításokat különböző termelő cégek számára.
.....
Vállalkozásunk rendelkezik egy komplex ipari ládamosó rendszerrel, ahol képesek vagyunk az autóiparban és elektronikai iparban használatos tároló rekeszek, ládák hatékony tisztítására, zsírtalanítására, akár a makacs szennyeződések eltávolítására is.
A rendszer vizes bázisú, előfűthető, recilkuláltatható oldattal, egy háromdimenziós nagynyomású permetező rendszer segítségével tisztítja meg a ládákat. A felhasznált készítmény egy terméken belül egyesíti a hatékony zsírtalanítást, és a kiváló fertőtlenítő hatást. Magas koncentrációjú felületaktív anyag tartalmának köszönhetően a szerves szennyeződéseken kívül, a szervetlen szennyeződéseket is hatékonyan eltávolítja (pl. lúgkő, vízkő). Zárt rendszerű technológia, mosófolyadék forgatással, visszaforgatással. Óránkénti kapacitás 5-600 láda/gép, ládamérettől függően, napi akár 5-6000 láda. A berendezés különböző mosási ciklusokra programozható.
.....
↑ Vissza a help menüre ↑