Tájékoztató
Megengedett: A sablon használható személyes és üzleti célra is teljesen ingyen, és ha tetszik, másokkal is megosztható vagy terjeszthető a „regen.hu” márkanév alatt.
Nem megengedett: Tilos a bal oldalsáv alján taláható, a szerzői jogra hivatkozó linket eltávolítani, a websablont eladni, értékesíteni, bérbe adni haszonszerzés céljából.
Támogatás: A sablonkészítő (regen.hu honlap üzemeltetője) nem nyújt technikai támogatást az ingyenes r-c (responsive-column) HTML sablonhoz.
CC BY-SA 4.0. Licenc
Nevezd meg! - Így add tovább! 4.0 Unported (CC BY-SA 4.0): Ezt a websablont ingyen, szabadon, díjmentesen bármely személy letöltheti akár személyes használatra akár üzleti célra, és korlátozás nélkül használhatja, beleértve a korlátozás nélküli használati jogokat.
AZONBAN:
Másolni, módosítani, terjeszteni, továbblicencelni az alábbi feltételekkel lehet:
A fenti szerzői jogi nyilatkozatot és az alábbi angol nyelvü értesítést fel kell tüntetni a websablon minden példányában, a -html- "head.../head" része közé.
THE SOFTWARE IS PROVIDED “AS IS”, WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
Magyar fordítás: A WEBSABLON „OLYAN-AMILYEN” ALAPON KERÜL FORGALOMBA, MINDEN SZÜKSÉGES VAGY ELŐÍRT GARANCIA NÉLKÜL ÉS KÖTELEZETTSÉGVÁLLALÁS VAGY TÁMOGATÁS NÉLKÜL HASZNÁLHATÓ. A HASZNÁLAT SORÁN BEKÖVETKEZETT KÁROKÉRT A FELHASZNÁLÓ A FELELŐS, SEMMILYEN ESETBEN A SZERZÕ ÉS JOGTULAJDONOS NEM FELELÕS SEMMILYEN KÁRÉRT, SÉRÜLÉSÉRT VAGY EGYÉB ADATVESZTESÉGÉRT, AKÁR JOGOS AKÁR JOGELLENES FELHASZNÁLÁS ESETÉN, ILLETVE HA EGYÉB TEVÉKENYSÉGBÕL KELETKEZETT A KÁR VAGY AZZAL KAPCSOLATOS A WEBSABLON HASZNÁLATA.
Megjegyzés
A websablont csak saját felelősségére alakíthatja át, vagy a benne levő kódot csak saját felelősségére változtathatja meg a felhasználó. Az ebből eredő hibáért vagy a helytelen használatból eredő egyéb kárért a vásárló, a felhasználó vagy a hibát okozó személy a felelős.
Sugó és letöltés linkek
A teljes dokumentáció angol nyelven erre a linkre kattintva érhető el ––
A teljes dokumentáció weboldalán (a lap alján) egy "demó zip" fájl tölthető le, amit akár azonnal használatba vehetünk teljesen ingyen, attól függően, milyen stílusú weboldalt akarunk szerkeszteni (nagyon sok előre elkészített websablont tartalmaz). Az r-c-responsive dokumentáció demo fájlok itt is letölthetők: direkt letöltés link ––
Mivel több?
Mivel több mint a hagyományos? A regen.hu weboldalról letölthető r-c-responsive kész websablon előre meghatározott reszponzív, azaz minden képernyőhöz helyesen igazodó oszlopokból áll. Az r-c-responsive kész, r-c-responsive sablon itt letölthető...
Mikor nincs szükség kódolási ismeretekre:
Ha változatlan formában használjuk a websablont.
Ha ugyanolyan méretre cseréljük a képeket.
Ha csak a szöveget cseréljük sajátra (ez lehet rövidebb vagy hosszabb szöveg).
Ha a beépített funkciókat változatlan formában használjuk és nem módosítjuk a szélességet, magasságot, elrendezést (jobbról balra vagy középre, kisebb, nagyobb stb.).
Ha nem változtatjuk a websablonokban meghatározott színeket.
Ha nem változtatjuk a betűméretet.
Mikor van szükség kódolási ismeretekre:
Ha frissíteni kell az alapértelmezett szélességet, magasságot stb.
Ha további oszlopokat kell hozzáadni.
Ha a rendszer fő szerkezetén szeretnénk változtatni
Ha szerkeszteni kell a Responsive Columns stílus fájlt (CSS). Ez egyébként csak haladó (vagy kíváncsi) felhasználóknak ajánlott.
Ebben az esetben a weboldal head részét újabb CSS stílus fájl-al kell kiegészíteni (lásd az alábbi képet) és a hozzáadott kódrészt optimizálni kell mobil eszközökre is, azaz szükséges kevés alap vagy haladó kódolási ismeret, vagy megbízhatunk egy webfejlesztőt, azonban lehet ezért már fizetni kell.
Jó tudni:
A websablon CSS fájlja minimalizált, nem tartalmaz plusz kódot, ezért a fő CSS stílus fájl mellé a "teljes" (full) CSS "r-c-full.css", az összes r-c rácsoszlopot tartalmazó fájlt is le kell tölteni pluszba és a head részben hivatkozni kell rá, majd ezután adhatunk újabb oszlopokat a weboldalhoz (csak akkor szükséges ha bővítésre kerül a weboldal). A letöltött websablon "zip" tömörített fájlja tartalmazza, vagy innen letölthető...
Bővíthető
Az r-c (responsive column) struktúrát bővíthetjük HTML "div" struktúrában megírt új funkciókkal (nem szükséges átírni r-c-re). A böngészők egyenértékűnek látják a weboldalba ágyazott kölömböző kódrészeket, mivel mindegyiket támogatják a böngészők, azonban a HTML "div" nagyobb méretű (egyébként is rondán néz ki egy vegyes kódrész).
Megjegyzés: A "div" kódrészt (az új funkciót) is optimizálni kell mobilra (kivéve ha a kódrész már tartalmazza).
Mit tehetünk?
A letöltött kész websablon "html" fájlt nyissuk meg a Windows Notepad jegyzettömbben (a Notepad++ jobb, ezt használom én is), majd a megnyitott fájl kódrészében adjunk hozzá vagy cseréljük le a képeket, grafikákat, másolatokat és egyéb tartalmakat a program használatával. Sokszorosításhoz, új létrehozásához (ha ugyanabból a weboldalból több kell) egyszerű fájl "másolás-beillesztés" vagy a Notepad++ program "mentés másként" funkció használatával a legegyszerűbb.
A letölthető websablon mérete mindössze 1.75 MB, mégis tartalmaz 8 (nyolc) weboldalt, minden szükséges funkciót, képet, szöveget, szkriptet, ami egy átlagos felhasználónak, vagy akár egy kisebb-nagyobb vállalkozásnak már így is több mint elég, ráadásul teljesen ingyen.
Mivel saját weboldalunk lesz, ezért a Google Ads rendszerbe is regisztrálhatunk, ahová hirdetéseket lehet elhelyezni, amiből bevétel származhat (idővel).
Az interneten számos funkciót kínálnak teljesen ingyen, amivel bővíthető a weboldal tartalma ha szükséges, például ingyenes alkalmazások, eszközök és funkciók, amelyek lehetővé teszik a kisvállalkozások és magánszemélyek számára, hogy szűkebb költségvetéssel indítsák el honlapjukat. Mivel az r-c (responsive column) rácsos elrendezésű strukturális jelölést a világon nagyon kevesen alkalmazzák, ha letöltjük ezt a websablont, az elsők közt lehetünk aki használja!
Lehet weboldal webfejlesztő nélkül?
Mindenek előtt rendeljünk domain nevet és tárhelyet. A Google keresőbe beírva a "tárhely szolgáltató" szavakat, többet is találunk.
Ha választottunk szolgáltatót, a weboldalán minden adatot megtalálunk, akár már a fő oldalon is rákereshetünk, hogy az általunk elképzelt, kitalált domain név szabad, regisztrálható-e. Ha nem (már foglalt), válasszunk más nevet a honlapnak. Ugyanitt rendelhetünk tárhelyet is.
A szolgáltató e-mailben küldi, szinte azonnal a honlap IP címét egy ideiglenes jelszót és egy felhasználó nevet. Ez nagyon FONTOS. Jegyezzük le egy cetlire, vagy másoljuk a jegyzettömbbe és mentsük a gépre, mert ezzel az IP címmel, a felhasználó névvel és a megadott ideiglenes jelszóval (később meg változtatható) tölthetjük fel a tárhelyre az új honlapunkat.
Töltsük le az r-c-responsive sablont
Csomagoljuk ki a zip fájlt (akár az asztalra), vagy erre a célra készített új mappába. Nevezzük el a mappát, bármilyen névre, lehet a már megrendelt domain neve is. Készítsünk a mappában található képek mérete szerinti saját képeket (maradhat az eredeti is).
Készítsünk saját szöveget.
Töltsük le a Notepad++ programot és nyissuk meg benne egyenként a HTML fájlokat, majd a kódrészben cseréljük le a képeket és a szöveget.
Tárhely
Ha kész, töltsük fel a tárhelyre. A honlapot feltölthetjük a tárhely vezérlőpult fájlkezelő szolgáltatásán keresztül, amihez a szolgáltató segítséget is nyújt, vagy egyszerűbben a FileZila fájlkezelő programmal, ami teljesen ingyenes.
Domain név
A domain név és tárhely megrendelésekor kiegyenlített összeg után, a FileZilla programmal feltöltött honlap azonnal megnyitható bármelyik böngészővel.
FileZilla beállításai:
Kattintsunk a program bal felső sarkában található Fájl menü gombra (1).
A legördülő kis ablakban, kattintsunk a Kedvenc helyek pnkre (2).
A középen megjelenő nagyobb ablakban végezzük el a képen látható módon a beállításokat (3, 4, 5, 6, 7).
A felhasználónév általában a saját domain név és utána hu, szóköz nélkül, pl: regenhu (6).
Végül kattintsunk a Csatlakozás gombra (8).
A kép alján látható ablakban tölthetjük fel a honlapot a tárhelyre, a pubpc_html mappába.
A baloldap ablakban kijelöljük az egérrel a feltöltendő fájlokat, majd a felbukkanó egérmenüből a Feltöltés pnkre kattintva azonnal feltölti a tárhelyre.
A FileZilla programból való kilépéshez kattintsunk a felső menüben található Kiszolgáló gombra, majd a legördülő menüben válasszuk a Kapcsolat bontása pnket.
A böngészőbe beírva a "domain" nevet, amit választottunk a tárhely szolgáltatónál, megnyithatjuk a honlapot.
Még pár fontos lépés:
Készítsünk webhely térképet a feltöltött weboldalakról. Itt ingyen készíthetünk...
Regisztráljunk a Google webmester weboldalán, és regisztráljuk be a honlapunkat az ott található utasítások szerint, hogy megjelenjen a honlap minden weboldala a Google keresőben.
Ugyanitt a Google webmester weboldalán tölthetjük fel a webhely térképet is (a baloldap menüben találjuk a pnket) és itt ellenőrizhetjük a honlap forgalmát, akár országok és kattintások szerint is.
Tipp
Ha idővel növekszik a forgalom, kérhetjük a Google Adsense weboldalon a honlapon megjeleníthető hirdetések elhelyezését, amihez a Google egy kód sort ad, amit el kell helyezni minden weboldal kódrészében. A Google ebben is segít az oldala Súgó részében.
Megjegyzés
Ha az r-c (responsive columns) rácsos elrendezésű demó, ingyenesen használható websablon mellett döntöttél és elakadtál, kérlek írj a Facebook–– oldalra, ha tudok segítek, és ha lesznek többen, talán tudnak majd segíteni ha szükség van. Azt ajánlom, hogy a szerző weboldalán levő dokumentációból tájékozódjunk, így elkerülhetjük a félreértéseket. A teljes dokumentáció angol nyelven erre a linkre kattintva érhető el.
Böngésző támogatás
A Reszponzív oszlopok minden modern böngészőben működnek, valamint minden olyan régi böngészőben, amely támogatja a Flexboxot, az alábbi verzióktól kezdődően:
Google Chrome 29+, Mozilla Firefox 28+, Microsoft Edge 12+, Apple Safari 9+, Opera 17+, Android böngésző 4.4+, Opera Mobile 12.1+, Chrome Androidra, Firefox Androidra, Opera Mini stb.
Mit ne változtassunk!
A weboldalak belső kódrendszerében található "script" kódot. A b-lazy.js JavaScript kód szükséges a képek "lusta" betöltéséhez, hogy csak akkor jelenjen meg a böngészőben ha a felhasználó lejjebb görget, ezáltal gyorsabban betölt a weboldal. A második script kód a weboldal Világos/Sötét színváltáshoz kell. A harmadik script kód a Cookie banner megjelenítéséhez szükséges.
