Jak utworzyć własny szablon dla Joomla! nie dotykając kodu? EF4 cz.2

Jak utworzyć własny szablon dla Joomla! nie dotykając kodu? EF4 cz.2

Chcesz mieć własny, unikalny szablon dla swojego serwisu opartego o CMS Joomla!, ale nie bardzo znasz się na kodowaniu?

Oczywiście - jest to możliwe!

W pierwszej części artykułów poświęconych tworzeniu własnych szablonów dla Joomla! w oparciu o framework EF4 - Jak stworzyć szablon nie dotykając kodu? EF4 cz.1, pokazałem Ci, jak korzystać z Theme Customizera, który jest nieodłączną częścią tego frameworka.

Dzisiaj poznasz framework EF4 od środka... czyli od zaplecza ;-)

Przypomnę tylko, że tytułowy bohater, to produkt polski, prosto spod palców ekipy Joomla_Monster.com. Ważne jest to, że jest całkowicie DARMOWY! Możesz z niego korzystać i wykorzystywać do woli ;-)

W pierwszej części pokazałem Ci, jak zainstalować i przetestować serwis z zaimplementowanymi przykładowymi szablonami oraz dodatkowymi rozszerzeniami (tzw. quickstart), a następnie pokazałem Ci możliwości Theme Customizera, dzięki któremu, bezpośrednio z poziomu witryny, możesz dosłownie kilkoma kliknięciami zmienić kolory oraz ustawienia czcionek i od razu mieć podgląd dokonanych zmian.

W takim razie... DO ROBOTY!

Theme Customizer

Przypominam, że za pomocą Theme Customizera zmieniony został domyślny wygląd szablonu JM Services. Teraz wygląda on podobnie jak na rysunku poniżej:

{edsanimate_animated_zoomIn_eds-on-scroll}Wygląd szablonu po dokonaniu zmian za pomocą Theme Customizer'a{/edsanimate}

Zobaczmy, zatem jakie opcje kryje framework EF4.

Zaloguj się do zaplecza Twojego testowego serwisu, kliknij w menu Rozszerzenia pozycję Szablony, a następnie na liście szablonów kliknij nazwę szablonu domyślnego: jm-services - Default.

Edycja domyślnego szablonu jm-services - Default

Basic settings

W oknie Szablony: Edytuj styl, kliknij w menu po lewej stronie pozycję Basic settings. Znajdziesz tutaj podstawowe opcje ustawień dla Twojego szablonu.

Jeżeli chcesz zmienić grafikę logo Twojego serwisu, w polu Logo kliknij przycisk WYBIERZ, następnie wczytaj lub od razu wskaż plik z logo i kliknij przycisk Wstaw.

Jeżeli nie posiadasz pliku graficznego lub po prostu nie chcesz, aby w tym miejscu wyświetlany był plik graficzny, w polu Logo kliknij przycisk X a następnie w polu Logo text wpisz tekst, który chcesz, aby był wyświetlany zamiast grafiki. Ja wpisuję: EF4 ;-)

W polu Site description wpisz slogan swojego serwisu. Ja wpisuję: Ekstra framework dla Joomla! Tekst wpisany w tym polu będzie widoczny zarówno wtedy, kiedy w polu Logo zdefiniujesz jakiś plik graficzny, jak i wówczas, gdy zamiast pliku graficznego będzie wyświetlany tekst wpisany w polu Logo text.

Jeżeli chcesz, aby nad obszarem z treścią artykułów wyświetlany był przełącznik zmieniający wielkość wyświetlanych w treści czcionek, to w polu Font size switcher kliknij przycisk ENABLED w przeciwnym wypadku pozostaw włączoną opcję: DISABLED.

Bardzo wygodną opcją jest specjalny przycisk, pojawiający się najczęściej w dolnym obszarze strony podczas jej przewijania. Pozwala on na szybki powrót do początku (góry) strony. Jeżeli chcesz, aby ten przycisk pojawiał się w Twoim serwisie, w polu Back to top button kliknij przycisk ENABLED, w przeciwnym wypadku, kliknij przycisk DISABLED.

W polu Favicon image wybierz plik graficzny, który będzie stanowił ikonę ulubionych (czasami nazywany ikoną witryny). Plik ten będzie wyświetlany w polu adresowym z lewej strony adresu witryny oraz po lewej stronie na liście zakładek przeglądarki internetowej obok tytułu strony. Pozwala on internaucie upewnić się, że znajduje się na właściwej witrynie. Plik ten – powinien być zapisany w formacie ico i posiadać rozmiary 16x16 lub 32x32 pikseli. Jeżeli Twój plik zapisany jest w innym formacie (png lub jpg) i ma nieco większe rozmiary, EF4 zadba o to, aby został on skonwertowany do prawidłowego formatu oraz rozmiarów.

Basic settings w szablonie JM Services

Na koniec kliknij przycisk Zapisz i zobacz teraz jak wygląda serwis testowy po prowadzonych zmianach:

Wygląd serwisu po zmianach w Basic settings

Wygląd serwisu po zmianach w Basic settings 

Template layout

W oknie Szablony: Edytuj styl, kliknij teraz w menu po lewej stronie pozycję Template layout. Znajdziesz tutaj podstawowe opcje związane z układem szablonu.

Układ szablonu opiera się na siatce z Bootstrap 2, jednak ekipa z DJ-Projekty poprawiła płynność siatki, aby była podobna do tej, która jest stosowana w Bootstrap w wersji 3.

W polu Template width zdefiniuj szerokość szablonu. Możesz użyć wartości absolutnych, podawanych w pikselach (px) lub relatywnych, podawanych w procentach. Ja zostawiam domyślną wartość: 1170px.

W polu Gutter size określ przestrzeń pomiędzy blokami, modułami i innymi elementami na stronie. Ja zwiększam do 40px.

W polu Left column width zdecyduj o ilości kolumn w siatce dla lewej kolumny szablonu. Ja zostawiam pozycję domyślną: Span3 (3 grid columns).

W polu Right column width zdecyduj o ilości kolumn w siatce dla lewej kolumny szablonu. Ja wybieram z listy, pozycję: Span4 (4 grid columns).

Nie bardzo wiesz, o co chodzi? Chodzi o to, że dzięki siatce Bootstrap możesz umieścić wiele modułów w tej samej pozycji szablonu, a co najważniejsze możesz także określić liczbę kolumn, jaką chcesz użyć dla każdego modułu! Daje to spore możliwości konfiguracyjne szablonu, ponieważ możesz np. w jednej pozycji, która powiedzmy składa się z 3 kolumn mieć moduł, który będzie "zabierał" 2 kolumny, a drugi moduł jedną kolumnę! Wówczas szerokość tego pierwszego modułu będzie większa niż szerokość tego drugiego modułu. Poza tym, wybierając większą lub mniejszą ilość kolumn siatki Bootstrap możesz decydować o szerokości kolumny - w tym przypadku lewej kolumny szablonu.

Zobacz kilka przykładów związanych z ustawieniami lewej i prawej kolumny:

  • Left column width: Span3 (3 grid columns), Right column width: Span3 (3 grid columns)

Wygląd lewej i prawej kolumny przy ustawieniach: Span3 (3 grid columns) 

  • Left column width: Span6 (6 grid columns), Right column width: Span3 (3 grid columns)

Wygląd kolumn szablonu przy ustawieniach: Lewa kolumna: Span6 (6 grid columns), Prawa kolumna: Span3 (3 grid columns)

  • Left column width: Span2 (2 grid columns), Right column width: Span4 (4 grid columns) 

Wygląd kolumn szablonu przy ustawieniach: Lewa kolumna: Span2 (2 grid columns), Prawa kolumna: Span4 (4 grid columns)

Poeksperymentuj trochę z tymi ustawieniami - zobaczysz jak wielkie zmiany w wyglądzie serwisu można uzyskać za pomocą tylko tych dwóch opcji :-)

Jeżeli do tego zmienisz opcje modułu (menu Rozszerzenia -> Moduły -> Nazwa modułu -> Karta: Wzbogacone) w pozycji Rozmiar Bootstrap, to możesz uzyskać jeszcze ciekawsze efekty:

Wygląd kolumn szablonu przy ustawieniach: Lewa kolumna: Span2 (2 grid columns), Prawa kolumna: Span4 (4 grid columns) oraz zdefiniowaną opcją Rozmiar Bootstrap

Jeżeli chcesz, aby Twój szablon "dopasowywał" się do różnych urządzeń i wielkości ekranów, takich jak typowe ekrany komputerowe, laptopy, tablety, smartfony, itp.), w pozycji Responsive layout kliknij przycisk ENABLED.

Jeżeli chcesz, aby na stronie startowej (lub jakiejkolwiek innej) wyświetlane były tylko same moduły (bez np. artykułów), to w polu Disable component zaznacz właściwą pozycję menu. W moim przykładzie to pozycja Home.

 

Ustawnienia Template layout w szablonie JM-Services

Na koniec kliknij przycisk Zapisz i sprawdź zmiany w wyglądzie Twojego testowego serwisu.

Layout builder

W oknie Szablony: Edytuj styl, kliknij w menu po lewej stronie pozcyję Layout builder. To jedna z najciekawszych opcji, dzięki której możesz przebudować całkowicie wygląd szablonu. Dzięki frameworkowi EF4 otrzymujesz bardzo proste, intuicyjne i przyjazne dla użytkownika narzędzie.

Jak zapewne się orientujesz, typowy szablon na Joomla! składa się z różnych bloków (pozycji) w których umieszcza się moduły. Każdy blok może zawierać jeden lub więcej modułów. Za pomocą Layout builder'a możesz praktycznie dowolnie konfigurować układ szablonu:

  • możesz zmieniać kolejność poszczególnych bloków;
  • możesz zmieniać kolejność kolumn;
  • możesz zdecydować o ilości modułów w tzw. flexi-blokach;
  • możesz przypisywać własne pozycje modułów;
  • możesz zdecydować o ukryciu niektórych bloków w zależności od wielkości ekranu;
  • możesz zdefiniować szerokość modułów w blokach typu flexiblock w zależności od wielkości ekranu;
  • możesz zapisać swoje ustawienia i przypisać je do wybranych pozycji menu;

Nie ma na co czekać! Zapraszam do poznawania Layout builder'a :-)

W polu Current Layout możesz wybrać z listy trzy różne układy szablonu:

  • default (dymyślny układ typu: left-content-right),
  • content-left-right;
  • left-right-content;

Do dyspozycji masz także przycisk COPY LAYOUT,  za pomocą którego możesz skopiować któryś z dostępnych układów i nadać mu własną nazwę. Za pomocą przycisk REMOVE LAYOUT możesz usnąć wybrany układ, natomiast za pomocą przycisku RESTORE LAYOUT TO DEFAULT SETTINGS, możesz załadować ustawienia domyślne do wybranego układu. Przydatna opcja, kiedy tak namieszasz w swoim układzie, że nie będziesz wiedzieć co do czego ;-)

Ok, proponuję, aby utworzyć własny układ i dopiero wówczas zająć się zmianami. W takim wypadku kliknij przycisk COPY LAYOUT, w okienku Layout copy wpisz własną nazwę układu (ja wpisuję: testowy-ef4), a następnie kliknij zielony przycisk Copy layout. Teraz możesz zająć się zmianami w swoim układzie!

W pierwszej kolejności możesz wybrać, czy chcesz zmienić ogólną strukturę szablonu - CUSTOMIZE LAYOUT STRUKTURE, czy dopasować układy responsywne - CUSTOMIZE RESPONSIVE LAYOUT. Proponuję najpierw popracować nad ogólnym układem szablonu.

Zwróć uwagę, na obecny układ poszczególnych bloków. Odzwierciedlają one typowy układ rozbudowanego serwisu, gdzie na samej górze znajduje się blok z górną belką (top-bar), poniżej blok z logo i menu nawigacyjne (top-menu-nav), następnie nagłówek - header (w którym często umieszczany jest tzw. slider z grafikami oraz krótkim opisem.

Pod nagłówkiem masz do dyspozycji dwa bloki, tzw. flexiblocks, w których obecnie znajdują się po cztery bloki top. Pod nimi znajduje się blok breadcrumbs, w którym najczęściej wyświetlana jest informacja w którym miejscu serwisu znajduje się internauta.

Dopiero teraz masz do dyspozycji trzy główne bloki: kolumnę lewą (left-column), główny blok prezentujący treść serwisu (component) oraz prawą kolumnę (right column). Blok treści podzielony jest na trzy części: content-top, component (w którym wyświetlane są np. artykuły), content-bottom. Pod głównymi blokami masz do dyspozycji jeszcze trzy bloki typu flexiblocks: bottom i footer.

Na samym dole zlokalizowane zostały dwa bloki: copyrights oraz blok informacyjny zawierający linki do producenta szablonu i frameworka: Joomla-Monster.com.

Aby dokonać zmian w rozmieszczeniu poszczególnych bloków, wystarczy, że klikniesz niebieski przycisk znajdujący się po prawej stronie większości bloków i przesuniesz myszką w górę lub w dół - w miejsce, w którym chcesz, aby ten blok się znajdował. Podobny przycisk drag & drop znajduje się nad blokami: left-column, content-top i right-column. W tym przypadku możesz przemieszczać te bloki w lewo lub prawo.

Bloki typu flexiblock rozpoznasz po tym, że pod nimi znajdują się przyciski z numerkami, które symbolizują ilość pozycji modułów w danym bloku.

W prawym górny rogu większości pozycji modułów znajduje się mała ikonka z ołówkiem, po kliknięciu której możesz z listy wybrać inną nazwę do wybranej pozycji modułu.

Domyślny układ szablonu w Layout builderze

Domyślny układ szablonu zobaczysz klikając w menu pozycję PAGES testowanego serwisu:

Domyślny układ testowego serwisu

Jeżeli część bloków nie chcesz używać w serwisie, możesz skorzystać ze specjalnego kosza. Po prostu przeciągnij wybrany blok na sam dół do różowego obszaru: EXCLUDED BLOCKS...

Specjalny kosz EXCLUDED BLOCKS do którego można umieścić nieużywane bloki szablonu

Poświęć trochę czasu, aby poeksperymentować z różnymi układami. Spróbuj zmienić układ, podobnie jak ja:

Zmieniony układ szablonu za pomocą Layout buildera

Zapisz zmieniony układ klikając przycisk Zapisz i zobacz jak teraz wygląda układ testowanego serwisu:

Zmieniony za pomocą Template buildera układ testowego serwisu

Font settings

Kolejna pozycja w ustawieniach szablonu JM-Services, to Font settings. Znajdziesz tutaj ustawienia związane z czcionkami używanymi w serwisie. Ustawienia te są identyczne z tymi, które poznałeś w artykule: Jak stworzyć szablon nie dotykając kodu? EF4 cz.1.

W sekcji BASE FONT masz do dyspozycji opcje, za pomocą których zmieniasz czcionkę domyślną dla całego serwisu.

ef4 35 small

W sekcji HORIZONTAL MENU zmienisz ustawienia czcionki dla menu poziomego:

Sekcja HORIZONTAL MENU w ustawieniach Font settings szablonu JM-Services

W sekcji MODULE HEADINGS zmienisz ustawienia czcionki dla tytułów w modułach umieszczonych w serwisie.

Sekcja MODULE HEADINGS w ustawieniach Font settings szablonu JM-Services

Czcionkę tytułów w artykułach ustawisz w sekcji ARTICLE HEADINGS

Sekcja ARTICLE HEADINGS w ustawieniach Font settings szablonu JM-Services

W sekcji ADVANCED SETTINGS możesz zdefiniować ustawienia czcionek dla wybranych selektorów lub identyfikatorów zdefiniowanych w CSS. Dzięki temu możesz zdefiniować inne ustawienia czcionki dla pojedynczego elementu serwisu.

Zobacz, jak będzie wyglądał serwis, jeżeli wprowadzisz następujące zmiany:

  • Font size: 50 px
  • Font type: Google webfont
  • Google webfont urlhttp://fonts.googleapis.com/css?family=Monoton:400,300,300italic,400italic,700,700italic,900,900italic
  • Google webfont family'Monoton', 'sans-serif'
  • Selectors: #jm-logo

Sekcja ADVANCED SETTINGS w ustawieniach Font settings szablonu JM-Services 

Ostatnia sekcja: GENERATED WEB FONT UPLOAD w menu Font settings umożliwia przesłanie na Twój serwer własnego zestawu czcionek, które chcesz wykorzystać w serwisie. Akceptowane są następujące rozszerzenia plików z czcionkami: *.ttf, *.eot, *.woff, *.svg. Warto przesłać co najmniej trzy formaty tej samej czcionki.

Color modifications

Następna pozycja: w ustawieniach szablonu JM-Services, to Color modifications, umożliwia zmianę kolorów poszczególnych elementów serwisu. Opcje te dostępne są także w Theme Customizerze, który opisywałem w artykule: Jak stworzyć szablon nie dotykając kodu? EF4 cz.1.

W sekcji SCHEME COLOR masz do dyspozycji opcje, za pomocą których zmieniasz tzw. kolor bazowy.

W sekcji GLOBAL znajdziesz ustawienia kolorów dla większości elementów serwisu, takich jak: tło strony, tło komponentu, obramowanie komponentu, kolor czcionki bazowej, kolor czcionki w tytułach artykułów.

Sekcja GLOBAL w ustawieniach Color modifications szablonu JM-Services

W sekcjach TOP BAR i TOPMENU BAR zdefiniujesz tło, obramowanie oraz kolor czcionki paska górnego oraz paska z górnym menu poziomym.

Sekcja TOP BAR i TOPMENU BAR w ustawieniach Color modifications szablonu JM-Services

Sądzę, że domyślasz się, że w sekcji MODULES zajdziesz ustawienia kolorów dotyczące modułów? Możesz zdefiniować kolor tła, obramowania oraz czcionki. Dodatkowo masz do dyspozycji trzy pola za pomocą których definiujesz kolory tzw. boxów. To te trzy elementy znajdujące się bezpośrednio pod sliderem na stronie głównej testowego serwisu.

Sekcja MODULES w ustawieniach Color modifications szablonu JM-Services

Natomiast w sekcji FOOTER zdefiniujesz kolor tła, obramowania i czcionki dla stopki serwisu:

Sekcja FOOTER w ustawieniach Color modifications szablonu JM-Services

Advanced features

Kliknij w menu Advanced features, aby wyświetlić opcje związane z włączaniem i wyłączaniem zawansowanych funkcjonalności szablonu.

Jeżeli chcesz modyfikować pliki LESS, używać Theme Customizera lub modyfikować kolory szablonu za pomocą Color Modifications, to w polu Developer mode kliknij przycisk ENABLED. Pamiętaj jednak, że włączenie tej opcji może wydłużyć czas ładowania się serwisu!

Pole Theme Customizer służy do włączania lub wyłączania go na stronie, natomiast pole Theme Customizer login do włączania lub wyłączania formularza logowania widocznego w pasku Theme Customizer'a. Po zalogowaniu się za pomocą tego formularza zostaną wyświetlone dwa dodatkowe przyciski: SAVE, za pomocą którego możesz zapisać wprowadzone zmiany bezpośrednio do bieżącego szablonu (domyślne style zostaną nadpisane) oraz przycisk SAVE AS FILE, aby zapisać zmiany do osobnego pliku konfiguracyjnego. Plik ten dostępny będzie z poziomu panelu administracyjnego w ustawieniach wybranego szablonu w pozycji Settings storage.

Pole Code injection możesz wykorzystać, jeżeli potrzebujesz wkleić dodatkowy kod (np. Google Analytics) lub meta tag do nagłówka szablonu (znacznik header).

Za pomocą pól: Compress CSS i Compress JS możesz przyśpieszyć ładowanie się serwisu w przeglądarkach. Dlaczego? Ponieważ komentarze, puste linie i niepotrzebne znaki są usuwane oraz pliki są łączone w jeden plik (osobno dla CSS i JS). Dzięki temu zmniejsza się czas odpowiedzi serwera na żądanie przeglądarki.

Jeżeli chcesz, aby część plików nie była poddawana kompresji, skorzystaj z pola Skip files. Możesz w nim wpisać nazwy plików lub pełne ścieżki dostępu. Pamiętaj tylko, aby każdy wpis był umieszczony w osobnym wierszu.

Ustawienia Advanced features szablonu JM-Services

Settings storage

Po kliknięciu w menu szablonu pozycji Settings storage otrzymasz dostęp do opcji pozwalających zapisać lub odtworzyć zdefiniowane wcześniej ustawienia szablonu zapisane w pliku konfiguracyjnym znajdującym się na serwerze lub załadować plik zapisany w innej lokalizacji.

Warto mieć zapisanych kilka różnych wersji szablonu, aby móc na przykład pokazać go klientowi lub innym użytkownikom, serwisu i zastosować ten, który przypadnie im najbardziej do gustu ;-)

W jaki sposób zapisać zmiany w osobnych plikach?

To bardzo proste! Załóżmy, że chcesz stworzyć trzy wersje wyglądu tego samego szablonu.

Najpierw zdefiniuj ustawienia układu poszczególnych elementów szablonu (Layout builder), ustawienia czcionek (Font settings) oraz kolorów (Color modifications), a następnie zapisz te ustawienia klikając przycisk Zapisz. Teraz kliknij w menu po lewej stronie pozycję Settings storage a następnie w polu Save settings wpisz nazwę pliku, np.: wersja1 i kliknij przycisk SAVE.

Zapisywanie ustawień szablonu w ppliku konfigiguracyjnym

Ponownie zmień ustawienia szablonu oraz je zapisz korzystając z przycisku Zapisz, a następnie w menu Settings storage w polu Save settings wpisz nazwę kolejnego pliku ze zmienionymi ustawieniami szablonu, np.: wersja2 i kliknij przycisk SAVE.

Powtórz te same czynności jeszcze raz pamiętając, aby zanim zapiszesz ustawienia w pliku najpierw zatwierdzić je korzystając z przyciski Zapisz.

W jaki sposób zastosować zmiany zapisane w pliku konfiguracyjnym?

Wystarczy, że w polu Store settings wybierzesz z listy właściwy plik konfiguracyjny, klikniesz przycisk LOAD, a an koniec zapiszesz wprowadzone zmiany klikając przycisk Zapisz

Wybór pliku konfiguracyjnego z zapisanymi ustawieniami szablonu

Jak zapisać plik konfiguracyjny na swoim komputerze?

Jeżeli chcesz zapisać plik konfiguracyjny w jakiejś innej lokalizacji i wykorzystać go np. w innym serwisie, to po wybraniu go z listy w polu Store settings, kliknij przycisk LOAD, następnie przycisk Zapisz.  Teraz kliknij prawym przyciskiem myszy przycisk DOWNLOAD SETTINGS i wybierz pozycję Zapisz element docelowy jako (lub podobnie brzmiącą jeżeli korzystasz z innej przeglądarki niż Firefox), a następnie zapisz plik w dowolnej lokalizacji na swoim komputerze.

Zapisywanie pliku konfiguracyjnego w dowolnej lokalizacji

Jak zaimportować plik zapisany na swoim komputerze?

Aby to zrobić, wystarczy, że klikniesz w polu Upload settings przycisk Przeglądaj, wskażesz plik konfiguracyjny, który chcesz zaimportować, następnie klikniesz przycisk UPLOAD znajdujący się po prawej stronie pola Upload settings i na koniec zapiszesz wprowadzone zmiany za pomocą przycisku Zapisz

Import pliku konfiguracyjnego w szablonie JM-Services

Gdzie przechowywane są pliki konfiguracyjne szablonu?

Pełną ścieżkę dostępu do plików konfiguracyjnych znajdziesz w polu Storage location. Dzięki tej informacji możesz łatwo uzyskać dostęp do wszystkich plików konfiguracyjnych, jakie zostały wcześniej przez Ciebie utworzone.

Pole Storage location zawierające informacje o lokalizacji plików konfiguracyjnych szablonu

Documentation

Po kliknięciu w menu pozycji Documentation, zobaczysz trzy linki:

  • General Info - prowadzący do dokumentacji framework'a EF4 w języku angielskim;
  • Our Extensions - Documenation, po kliknięciu którego otworzysz okno z dokumentacją rozszerzeń oferowanych przez DJ-Extension;
  • Bootstrap Grid System - Documentation, prowadzący do artykułu, w którym bardzo dokładnie objaśniono zasadę działania siatki Bootstrap;

Menu Documentation w szablonie JM-Services 

Upadtes

W menu Updates znajdziesz informacje dotyczące wersji zainstalowanego szablonu oraz framework'a EF4, a także link, za pomocą którego, sprawdzisz, czy zostały wydane nowsze wersje.

Menu Updates w szablonie JM-Services

Przypisz do pozycji menu

Kolejna pozycja w menu szablonu JM-Services, to Przypisz do pozycji menu. Funkcjonalność ta dostępna jest dla każdego szablonu w Joomla! Dzięki niej możesz na przykład użyć wiele szablonów w obrębie jednego serwisu! Przydaje się ona wówczas, gdy prowadzisz rozbudowany serwis i chcesz na przykład przedstawić i różny sposób treści w poszczególnych działach.

Zwróć uwagę, ze w Twoim testowym serwisie, dla szablonu jm-services - Default, zaznaczona jest tylko jedna pozycja w menu: Main Menu. Jeżeli chcesz, aby Twój zmodyfikowany szablon był widoczny także w innych pozycjach menu, zaznacz odpowiednie pola.

Menu: Przypisz do pozycji menu w szablonie JM-Services

Więcej na temat stosowania wielu szablonów w jednym serwisie przeczytasz i obejrzysz w artykule: Wiele szablonów w jednym serwisie w Joomla! 3.3.

Jestem pewien, że znasz już dokładnie większość opcji, jakie oferuje framework EF4. Przyznasz, że dzięki swojej prostocie jest łatwy w użyciu, a mimo to daje możliwość szybkiej modyfikacji wielu ustawień szablonu. Napisz w komentarzu pod tym artykułem, czy za pomocą tego darmowego narzędzia jesteś w stanie dostosować go do swoich potrzeb. Czy czegoś brakuje? Napisz w komentarzu!

To co do tej pory Ci pokazałam, było głównie omówieniem wszystkich opcji dostępnych zarówno z poziomu serwisu za pomocą Theme Customizera, jak i z poziomu zaplecza za pomocą opcji dostępnych w szablonie.

W kolejnej części pokażę Ci na konkretnym przykładzie istniejącego serwisu, jak nie dotykając kodu, wykorzystując framework EF4 i szablon JM-Services, stworzyć własny szablon dostosowany do wymagań konkretnego serwisu.

 

Chcesz otrzymywać powiadomienia o moich kolejnych wpisach lub projektach?

Jak zaktualizować Joomla! 2.5 do Joomla! 3.x?
Moja przygoda z Joomla! - Danuta Idzik

Podobne wpisy

 

    By accepting you will be accessing a service provided by a third-party external to https://www.slawop.net/

    Najnowsze komentarze

    Gość - Studio Jak wybrać hosting dla Joomla!?
    13 wrzesień 2019
    Warto jeszcze dopisać punkt, żeby przy wyborze wybrać panel między DirectAdmin/cPanel. Niektóre hostingi mają swoje własne rozwiązania - czasami bardzo specyficzne, co niekoniecznie jest dobrą rzeczą
    Gość - Marek Szyfrowanie symetryczne a niesymetryczne
    09 czerwiec 2019
    "Klucz przekazany do publicznej wiadomości, nazywany jest kluczem publicznym lub jawnym. Może on być stosowany do szyfrowania lub deszyfrowania informacji otrzymanych od osoby, która go wygenerowała. ...
    Gość - Marek Tworzenie szablonów dla Joomla! Helix Ultimate
    10 maj 2019
    Witam, napotkałem problem pojawiający się przy zmianie kolorów tła czy czcionek oraz importowaniem ustawień. W pierwszym przypadku, po zmianie kolorów i ich zapisaniem, panel podglądu strony przeładow...
    Gość - Andy SSL i Joomla! w Smarthost
    03 styczeń 2019
    Dzięki, jak zwykle dobra robota! Warto dodać, że instalacja certyfikatu SSL nie zapewnia bezpieczeństwa transmisji danych. To jest możliwe po wdrożeniu polityki bezpieczeństwa w firmie. Co do SSL - to...
    Gość - Henryk Jak utworzyć menu poziome w szablonie protostar?
    02 styczeń 2019
    Robię punkt po punkcie i nie wyświetla się poziome menu Nie wiem gdzie tkwi błąd i co robię źle?Jeśli to możliwe to proszę o pomocps. posiadam książkę "Joomla! 3x" i tu również niema pomocy Pozdrawiam...