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!

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 ↑


Még nem készült el!!!


↑ Vissza a help menüre ↑

Internationale Transport & Spedition

Designed by BootstrapMade | All rights reserved MediLab | Website burcsi (2015, 2020)