Letöltés Kipróbálás

Gantry 5 - Háttérkép definíció hozzáadása a Hydrogen sablon szekcióihoz

Több
2016 márc. 15 18:47 - 2016 márc. 17 06:51 #1 Írta: Zotius
Gantry 5 - Háttérkép definíció hozzáadása a Hydrogen sablon szekcióihoz téma létrehozva Zotius által

A megoldás nagyon egyszerű, csak két fájlt kell módosítani és a módosított fájlokat a custom mappán belül a megfelelő almappába behelyezni.

Bővebben...
Ha valakinek túl nagy gondot okozna a módosítás elvégzése, használhatja a leírás szerint már módosított, alábbi fájlokat is:

Melléklet:

Fájlnév: section.yaml.zip
Fájlméret:516 COM_KUNENA_USER_ATTACHMENT_FILE_WEIGHT_B


Melléklet:

Fájlnév: section.ht...ig-2.zip
Fájlméret:711 COM_KUNENA_USER_ATTACHMENT_FILE_WEIGHT_B

PS: Találtam egy kis hibát a .twig fájl kiegészítésében, javítottam és lecseréltem a javított verzióra.
Mellékletek:
Utolsó szerkesztés: 2016 márc. 17 06:51 Zotius által. Indoklás: Indoklás: hiba javítása a twig fájlban :)
A következő felhasználók mondtak köszönetet: kocsislaci, csezo

Jelentkezz be, hogy te is részt vehess beszélgetésben!

Több
2016 ápr. 07 19:40 #2 Írta: kocsislaci
kocsislaci válaszolt a következő témában: Gantry 5 - Háttérkép definíció hozzáadása a Hydrogen sablon szekcióihoz
Van rá mód, hogy az egész oldal, tehát minden szekció alatt ott legyen a háttérkép?

Köszi

Jelentkezz be, hogy te is részt vehess beszélgetésben!

Több
2016 ápr. 08 06:46 - 2016 ápr. 08 07:30 #3 Írta: Zotius
Zotius válaszolt a következő témában: Gantry 5 - Háttérkép definíció hozzáadása a Hydrogen sablon szekcióihoz
Code:
body { ... background-image: url( ... ); ... }
Természetesen a custom.scss-ben kell ezt definiálni.
Sajnos a Gantry 5 admin felületén ez nem oldható meg, és a szekciók hátterének beállítása az előző hsz-ban leírtak szerint is elég kezdetleges. A háttérkép-fájl nevének megadásán kívül annak további paraméterei (pl. háttér pozícionálása) sem állíthatók be azzal.
Utolsó szerkesztés: 2016 ápr. 08 07:30 Zotius által. Indoklás: kiegészítés

Jelentkezz be, hogy te is részt vehess beszélgetésben!

Több
2016 ápr. 08 15:43 #4 Írta: kocsislaci
kocsislaci válaszolt a következő témában: Gantry 5 - Háttérkép definíció hozzáadása a Hydrogen sablon szekcióihoz
Először is köszi, de minden egyes szekciónak tudok hátteret varázsolni custom.scss-ben, viszont a az egész alá nem engedi... body tag meghívása esetén nem történik semmi, a legegyszerűbb beállításokkal sem..
Code:
body { background-color: lightblue; }

Valami ötlet?

Jelentkezz be, hogy te is részt vehess beszélgetésben!

Több
2016 ápr. 08 15:49 - 2016 ápr. 08 16:58 #5 Írta: Zotius
Zotius válaszolt a következő témában: Gantry 5 - Háttérkép definíció hozzáadása a Hydrogen sablon szekcióihoz
A 'body' def. rossz tipp volt, bocsi...
Ahhoz, hogy a tartalmi területen kívül legyen csak háttérkép, ahhoz több dolgot is be kell állítani.
Elsőként a #g-page-surround azonosítóba tedd a háttérkép definícióját:
Code:
#g-page-surround { background-image: url('../images/kepneve.jpg'); }
(A képet a templates/g5_hydrogen/custom/images/ mappába kell tenni.)
A tartalmak háttereit pedig valamilyen színre, mert ha nincs, akkor ezek alatt is a háttérkép fog látszódni. Pl.
Code:
#g-header .g-container, #g-navigation .g-container, #g-container-main .g-container { background: #színkód; }
Minden sáv (szekció) .g-container osztályának legyen színe, ezek a mögöttük lévő page-surround háttéren a beállított színnel fognak megjelenni.
Utolsó szerkesztés: 2016 ápr. 08 16:58 Zotius által. Indoklás: válasz módosítása, kiegészítés

Jelentkezz be, hogy te is részt vehess beszélgetésben!

Több
2016 ápr. 08 16:42 #6 Írta: kocsislaci
kocsislaci válaszolt a következő témában: Gantry 5 - Háttérkép definíció hozzáadása a Hydrogen sablon szekcióihoz
Ez csak egy gantry hydrogen sablon, tesztoldal!

Kell hozzáférés:

Vendégek elől rejtve. Jelentkezz be vagy regisztrálj a tartalom teljes megtekintéséhez.

Jelentkezz be, hogy te is részt vehess beszélgetésben!

Több
2016 ápr. 09 12:55 #7 Írta: Zotius
Zotius válaszolt a következő témában: Gantry 5 - Háttérkép definíció hozzáadása a Hydrogen sablon szekcióihoz
Fix háttérkép beállítva a megadott gyakorló oldalon. :)
Tekintsd meg a custom.scss-ben lévő definíciókat. Így kell csinálni.

Jelentkezz be, hogy te is részt vehess beszélgetésben!

Több
2016 ápr. 10 11:04 - 2016 ápr. 10 11:08 #8 Írta: kocsislaci
kocsislaci válaszolt a következő témában: Gantry 5 - Háttérkép definíció hozzáadása a Hydrogen sablon szekcióihoz
Hallod másfél napig vártam, hogy válaszolj mikor vissza néztem látom, hogy beszerkesztetted a hozzászólásodba a megoldást!! :silly:

Köszönök mindent már is nézem!! !!!!!!!!!!

Jóóóóó!! Köszi köszi! Nem is gondoltam, hogy a szekciókat ilyen módon is lehet csoportosítani.....

Még egy kérdés... felül a headerrt, hogy oldottad meg hogy akkora méretű legyen?
Utolsó szerkesztés: 2016 ápr. 10 11:08 kocsislaci által.

Jelentkezz be, hogy te is részt vehess beszélgetésben!

Több
2016 ápr. 10 12:42 #9 Írta: Zotius
Zotius válaszolt a következő témában: Gantry 5 - Háttérkép definíció hozzáadása a Hydrogen sablon szekcióihoz

kocsislaci írta: felül a headerrt, hogy oldottad meg hogy akkora méretű legyen?

Röviden: sehogy.
A "facecimer.png" logó magassága 160px, és ehhez jön hozzá a #g-header szekción belül a .g-content margója és bélése:
Code:
.g-content { margin: 0.625rem; padding: 0.938rem; }

Jelentkezz be, hogy te is részt vehess beszélgetésben!

Több
2016 ápr. 10 13:02 #10 Írta: Zotius
Zotius válaszolt a következő témában: Gantry 5 - Háttérkép definíció hozzáadása a Hydrogen sablon szekcióihoz
A szekciók nincsenek csoportosítva, az úgy van, ahogy Te beállítottad.
Én csak a hátterüket állítottam be.

Jelentkezz be, hogy te is részt vehess beszélgetésben!

Az oldal semmilyen kapcsolatban nem áll a Joomla!© Projecttel, sem az Open Source Matters-zel. A Joomla!© logót korlátolt licenc alatt használjuk, melyet az Open Source Matters védjegytulajdonos biztosít az Egyesült Államokban és más országokban. Minden jog fenntartva © 2011-2025 Joomla! Magyarország.
Az oldal tárhelyét a MagyarHosting biztosítja. Ha támogatni szeretnéd az oldal működését, akkor kérjük, hogy az alábbi hivatkozáson keresztül vásárolj tárhelyet.