Post on 11-Nov-2014
description
Gavern Framework
✓ Web Developer w GavickPro
✓ @BartekKrztuk
Bartłomiej Krztuk
Meet Gavernczyli przykład wykorzystania Gavern Framework
Parę słów o Meet Gavern
✓ bezpłatny responsywny szablon dostępny dla Joomla! 3.x
✓ zbudowany w oparciu o Gavern Framework
✓ Bootstrap
✓ LESS
✓ i wiele innych...
Layout Manager
✓ 3 niezależne konfiguracje widoków
✓ szerokość modułów, ilość może być różna dla trybu desktop/tablet/mobile
✓ wizualizacja widoków z uwzględnieniem responsywności
Layout Manager
Layout Manager - pozycje modułów
✓ wizualizacja uwzględnia całą strukturę szablonu (w tym i pozycje niedostępne)
✓ import ustawień z innej pozycji modułu
✓ dodawanie i usuwanie modułów na danej pozycji
Zaawansowane ustawienia pozycji modułu
✓ Default module width - domyślna szerokość modułu gdy nie jest uwzględniony w Layout Manager
✓ Use default module settings - możliwość zrezygnowania z ustawień LM na rzecz domyślnym ustawień Joomla!
Layout Manager - Sidebar
✓ pozycja sidebar’a ( left | right)
✓ szerokość - spanX
✓ override - czyli zaawansowane ustawienia
Layout Manager - Sidebar Override
✓ możliwość przeciążenia/nadpisania ustawień dla konkretnego ItemId menu lub komponentu
✓ nadpisać można zarówno szerokość jak i pozycję
✓ przykładycom_k2 | right | span4198 | left | span6
Ustawieniadomyślne
„przeciążony” widok
...a jak to wygląda w praktyce ?
Layout Manager Live!
LESS
Gavern Framework a LESS
✓ LESS - CSS w nowej formie - Tomasz Dziuda (Dziudek), Aula, jutro 14:40-15:35
✓ CSS w Meet Gavern w 100% stworzony dzięki LESS
✓ Opcje parsowania LESS : jednorazowo lub stale włączone
Fonty
Fonty - wspierane źródła
Fonty - Konfiguracja
✓ nazwa fonta
✓ adres URL do repozytorium fontu
✓ określenie selektorów do których dany font ma być zastosowany
(np. h1,h2,h3, .someAwesomeClass, #notUniqueID)
Fonty - variables.less
✓ wszystkie rozmiary fontów jak i line-height wyliczone są na podstawie dwóch zmiennych LESS
✓ znaleźć je można w pliku less/variables.less
✓ zmiana rozmiaru fontu dla całego szablonu wymaga zmiany tylko w jednym miejscu
Fonty - variables.less
✓ @baseBodyFontSize: 13px; - podstawowy rozmiar (body)
✓ @baseHeadersFontSize: 20px; - nagłówki (czyli header, h1, h2, h3, h4, h5 i inne)
Configuration Manager
Configuration Manager
Configuration Manager
✓ zapisywanie ustawień szablonu i odczytywanie dzięki plikom JSON
✓ integralna część szablonu (nie wymaga dodatkowych pluginów, komponentów, itp.)
✓ przenoszenie ustawień między instancjami Joomla!
✓ pliku zapisywane w miejscu instalacji szablonu - katalog /configs
...o czym warto wspomnieć
✓ Social API
✓ Login with Facebook
✓ Cookie Law
✓ CSS/JS Compression
✓ CSS cache
✓ Prefixfree
✓ Komponenty - K2 (Cobalt)
✓ i wiele innych
Gdzie znaleźć Meet Gavern ?
joomla30.gavick.comgavick.com
github.com/GavickPro/Meet-Gavern/
github.com/GavickPro/Meet-Gavern/issues
- demo- download- download
- bugs, ideas, improvements
Jak można wykorzystać Meet Gavern ?
Trochę na temat przyszłości czyli
Gavern 4
Gavern 4
✓ kolejna wersja naszego framework’a dla Joomla! 2.5 oraz 3.2
✓ ujednolicony panel administracyjny dla Joomla! 3.x oraz 2.x
✓ Layout Manager w szablonach komercyjnych
Gavern 4 i Joomla! 2.5
Gavern 4 i Joomla! 3
Gavern 4 - konfiguracja szablonu
✓ uproszczone zarządzanie szablonem
✓ usunięte zostaną zbędne i nieużywane funkcje
✓ przejrzysty wygląd, intuicyjne kategorie, większa wygoda korzystania
Gavern 4 i Joomla! 3.x
✓ Bootstrap - dołączony i dopasowany stylistycznie do szablonu
✓ Responsywność - zrealizowana za pomocą naszych @media-queries - czyli layout szablonu bez użycia Bootstrap Grid
✓ LESS
✓ Skrypty szablonu w oparciu o bibliotekę jQuery
Gavern 4 i Joomla! 2.x
✓ wsparcie dla LESS (parser PHP)
✓ skrypty szablonu w oparciu o MooTools
✓ Responsywność - jak w szablonach dla Joomla! 3.x
Zalety
✓ Z punktu widzenia użytkownika niezauważalna zmiana z Joomla! 2.x na Joomla! 3.x
✓ LESS - zmiana kolorów szablonu dzięki zmiennym, tak jak w przypadku rozmiarów fontów
✓ Dodanie opcji dostępnych do tej pory jedynie w Meet Gavern
Pytania?