Bootstrap drupal 7 gyors túrák kezdőknek
Release Bootstrap (korábbi nevén a Twitter Bootstrap) egy pár éve megjelent Drupal 7 hasonlók. Én azonban tanulni vette csak ezen a héten. „Belépés” keretében megjelent nekem egyáltalán nem egyszerű, és beraktam egy csomó dudorok. Tájékoztatás a bootstrap sokat, de az összkép nem helyes. Ezért úgy döntött, hogy összekapcsolják az összes rövid áttekintés a cikket.
Mi Bootstrap? Röviden - ez a tervező, hogy építsenek egy webhely felületén, ami, tekintve a megjelenését. Ez egy felhasználói interfész vezérlők, mint a gombok, fejlécek, beviteli mezők, tippek. (Oochen őket, és sokat. Szépek!).
Bootstrap fejlesztők remek munkát végzett. Ők nem csak azokat a megjelenését és viselkedését az egyes ellenőrzések, hanem a már teszteltük ezt a hatalmas mennyiségű kódot a különböző böngészőkben (beleértve a mobil!).
Mert szeretik Bootstrap soveremennyy programozók?
Mert szeretik Bootstrap tulajdonosok modern oldalak?
- Bootstrap design teszi egy szép, világos, kiszámítható, és a HTML / CSS / JS kódot kompakt.
- Még a mobil internet oldalt az oldal, készült Bootstrap betöltött észrevehetően gyorsabb! Természetesen, ha minden rendben van a jobb kezében, hogy úgy mondjam, és a második és a harmadik, hogy a helyszínen;).
Bootstrap nem attól függ, milyen CMS dolgozik / üzleti honlap. Fontos, hogy csatlakoztassa megfelelően. Én szakosodott Drupal, ezért elmondom, hogyan kell csinálni a dizájn alapján Bootstrap Drupal 7.
Drupal + Bootstrap
Továbbá az eljárás a 3. példában leírt Bootstrap.
Ahhoz, hogy a munka megköveteli egy újabb Bootstrap jQuery könyvtár, mint a Drupal, így fel jQuery_update modult. tartalmazhatnak verzió 1.9 vagy magasabb.
Hogy betöltse megszerezte a jogot, az része a Drupal azonban szükség van a motor igazítani HTML osztályok, amelyek leírása a Bootstrap stílusokat.
Set dizájn bootstrap
Felülírhatja ezt az osztályt és a HTML struktúra drupalnuyu állítsuk dizájn bootstrap 7.x-3.0. A szerkezet a témája a fájlok a képen látható.
Saját téma létrehozása alapján megállapított
Ha azt tervezi, hogy módosítsa a sablonokat, azt javasoljuk, hogy azonnal hozza létre a dizájn alapján a forgatáson. Ha ez történik, a fő téma, minden változás felülíródik (elveszett!) A közeli helyszínen frissítik. Vannak átgondolt opisalovo. De ha ez a rövid és orosz, akkor meg kell tennie:
- bootstrap_subtheme másolni a könyvtárat egy szinttel feljebb (a könyvtárban a téma a site design);
- átnevezni valami saját, például mytheme;
- bootstrap_subtheme.info.starterkit átnevezni a fájlt mytheme .info;
- adott esetben, lehet szerkeszteni mytheme.info fájlt, és módosítsa a nevet a témának.
Létrehozása altéma befejeződött.
Engedélyezése és beállítása létrehozása Skin
Kezdődik a móka. Alapértelmezésben a bootstrap maga betöltődik külső forrásból származó - CDN (Content Delivery Network). Azaz, a szerver bootstraps nincsenek szkripteket. Loaded a teljes verzió, amely tartalmazza az összes rendelkezésre álló elemek. Gyorsan betölt (CDN), de ez messze nem optimális. Most van itt az ideje, hogy mondja el nekünk, milyen történik bootstrap:
Amikor egy CDN optimális? Ha a hely nagy, és valószínűleg használni szinte minden vezérlőt használja a CDN-változat.
A kis helyszíneken, hogy a az erejét egy kevés kontroll, nem szükséges betölteni js-kód és a css-stílus a többi kezelőszerv. Akkor távolítsa el őket, és ezáltal csökkenti a böngésző letöltött fájlokat (azaz felgyorsítja betöltése oldalak mobil eszközök).
Minimalizálása (tömörítés) ad jelentősen csökkenteni lehet a fájlok méretét. De a fejlesztés során az oldal jobb használni a tömörítetlen változat - sokkal kényelmesebb a hibákat és a fájlok szerkesztéséhez (ha szükséges).
A nagyon speciális, az szükséges, hogy a forráskódot. Ez lehetővé teszi, hogy megváltoztassa őket. Szerint a fejlesztés vége, ne feledje, hogy a fájlokat minimalizálni kell.
Csatlakozó hogy betöltse téma tervezés
A legújabb verzió a Bootstrap van git. A dist könyvtárban minimalizálását és normál fájlokat, mint all-in-one fájlban. Ha ezeket a fájlokat helyezni mytheme / bootstrap.
Minimalizálása fájlok kiküszöbölésére redundáns css és js
Miután a helyszínek fejlesztése befejeződött, és tudod, mit alkatrészeket használnak, itt az ideje, hogy minimalizálja a script fájlok és stílusok. Először is, megszünteti a felesleges költségeket, hogy megjelenjen a stílusok és szkriptek oldalon. Nagyon jó, hogy csökkentik a CSS és JS kódot. Ezt meg lehet tenni az alábbi módokon:
- Téma betöltse magát lehetővé teszi, hogy adja meg a fájl * .info kizárt fájlok formájában kizárja [CSS] [] = „modules / könyv / book.css”;
- Használhatja hook_js_alter, hook_css_alter - egy univerzális módon.
Tömörítése és csomagolja be őket lehet harmadik féltől származó eszközök vagy az oldalán Drupal. Az utóbbi esetben a tökéletes megoldás Advanced CSS / JS összesítése. Ez a modul számos beállítást, és lényegesen umenishit script méretét.
Mi a következő lépés?
Akkor használhatja a bootstrap a legteljesebb: add alkatrészek és testre megjelenését. Minden alkatrész nagyon jól le van írva az oldalakon a projekt (a főmenüben vízszintes). Persze, van egy orosz változata ezt a dokumentációt, de nekem úgy tűnt, túl nyers és nem használja azt.
Hogyan lehet csatlakozni a kontroll Bootstrap
hasznos linkek
Bootstrap gyorsan fejlődik, van egy csomó dokumentációt a 2. változat késztetés, hogy legyen óvatos, ez jelentősen eltér a jelenlegi változat.