Kurs Joomla 3.0 odcinek 6 - Wstawianie grafiki

Osobiście nie lubie wstawić grafiki taki sposób w jaki umożliwia nam to rdzenna Joomla i niestety w Joomla 3.0 niewiele się to zmieniło, a to za sprawą edytora tekstu. Za pomocą którego ta grafikę wstawiamy. W tym rozdziale pokażę Państwu jak wstawić grafikę do artykułu. Najpierw zacznę od zasad ogólnych.

Grafika na strony internetowej

Obecnie tylko dwa rodzaje plików graficznych używa się do prezentacji grafiki na stronie, jest jpg i png. Dawniej był i do dziś jest sporadycznie stosowany format gif. Były próby wprowadzenia innych formatów, jednak dziś dominują te dwa formaty plików.

Plików z rozszerzeniem jpg używamy najczęściej, służą one głównie do prezentacji obrazów wykonanych aparatami cyfrowymi – czyli zdjęć. Jest to najlepszy format właśnie do umieszczania zdjęć w serwisach www. Format jpg jest formatem kompresji stratnej, to znaczy, że część informacji zwiększając kompresję tracimy.

Pliki z rozszerzeniem PNG, są mniej popularne, a to dlatego że mają inny sposób kompresji i jest to kompresja bezstratna, dodatkowo mają pełna paletę barw. Jednak jest to okupione dużym rozmiarem tych plików. Stąd używa się ich do prezentacji obrazów o prostszej zawartości np. rysunki. W pliku png możemy zawrzeć przezroczyste tło, to jest jedna z najważniejszych właściwości tego formatu, często wykorzystywana przy budowie szablonów strona w Joomla.

Rozmiar grafiki

Czasami wchodzimy na strony, gdzie zdjęcia bardzo wolno się ładują, pomimo że mają mały rozmiar. Wynika to z dwu przyczyn:
•    nie właściwego zastosowania formatu – tutaj zamiast formatu jpg został użyty format png, który nie jest zalecany do zdjęć.
•    Zdjęcie nie zostało zmniejszone do odpowiedniego rozmiaru. Czyli nasz aparat wykonał zdjęcie o rozmiarze np. 4000x3000px – takie zdjęcie jest bardzo duże i nie jest optymalne do wyświetlania na stronach internetowych.
Zalecam zmniejszenie grafiki do odpowiednich rozmiarów. W sieci jest wiele programów, które automatycznie zmniejszają zdjęcia. Oczywiście możemy zachować kilka procent tolerancji. Umieszczając grafikę na stronie najczęściej będzie to grafika o rozmiarze do 800 px szerokości.
Reasumując zaplanujmy wielskość grafik na stronę i zmniejszmy je do wymaganych rozmiarów.

Nazwy plików

Nie stosujmy zbyt długich nazw plików. Nie stosujmy w nazwie polskich znaków i spacji. Tak będzie nam łatwiej dodawać grafiki. Pamiętajmy też o tym, by nazwy pozwoliły nam identyfikować grafikę na serwerze. Ja często stosuję taki format nazwy plików nazwa_pliku_nr.rozszerzenie. Czyli plik nazywam dwoma/trzema słowami rozdzielonych podkreślnikiem oraz trzeci człon to numer.

Wgrywanie grafik na serwer

Joomla ze swoim domyślnym edytorem TinyMCE nie jest zbyt przychylna do wstawiania grafik do artykułów. O ile pojedyncze pliki, można wstawiać w ten sposób o tyle wstawienie wielu grafik to już ciężkie zajęcie. Aby jednak być w zgodzie z zasadami, pokaże Państwu jak to robić w miarę efektywnie.
Przechodzimy kolejno w menu do artykuły i wybieramy z rozwijanego paska media. W ten sposób otworzyliśmy menadżera plików Joomla 3.0. Różni się on od wersji w Joomla 2.5 kilkoma elementami, np. domyślny przycisk z polem do wybierania wgrywania grafiki jest ukryty.menadzer

Popatrzymy na menadzera – Po lewej stronie mamy drzewo katalogów zawartych na folderze images, zaś po prawej stronie podgląd zawartości folderów. Mam też dwa przyciski szczegóły i miniatury. Domyślnym widokiem jest widok miniatury, znany nam z windows jako ikony. Widokiem drugim jest widok szczegóły – czyli widok z informacją o wielkości pliku i jego rozmiarze. Jest to znany nam z windowsa widok szczegóły, tylko ten w windows jest bogatszy w informacje.

Na widoku miniatury przy każdym pliku są dwie okonki, x – która oznacza usunięcie grafik, pliku. Druga ikonka to pole zaznaczenia – czyli ten plik możemy zaznaczyć.

Na górze mamy przyciski do wczytywania plików, usuwania ich i tworzenia katalogów oraz przycisk opcji.

widok menadzera

 

Wgranie plików na serwer jest bardzo proste klikamy przycisk wczytaj. Teraz pojawi się możliwość wyboru plików z naszego komputera – klikamy przycisk przeglądaj i w otwartym oknie zaznaczamy pliki  które chcemy przesłać na serwer. Możemy zaznaczyć kilka plików, wciskamy przycisk alt i zaznaczamy kolejne pliki. Klikamy otwórz u następnie klikamy wczytaj, rozpoczyna się wczytywanie, niestety nie widzimy jak wczytują się pliki i ile będzie to trwało, stąd nie lubię tego menadżera plików.  Jednak trzeba go przedstawić.

wczytywanie plików

Wczytane pliki pokażą nam się na liście.

Skoro już pliki mamy na serwerze w odpowiednich folderach teraz przechodzimy do tworzenia artykułów. Czyli klikamy Artykuły, dalej artykuły i utwórz artykuł.

Wstawianie grafiki do artykułu

Na dole strony widzimy taki przycisk jak grafika, naciskamy go otwiera nam się okno z menadżerem plików już wcześniej widzianym. Niestety w tym widoku nie możemy stworzyć folderu, sąd wgrywaliśmy pliki w menadżerze.

przycisk grafika

 

przycisk wstaw

Zaznaczamy grafikę przez jej kliknięcie i klikamy wstaw grafikę i już grafika jest na stronie pozostaje nam zapisać artykuł i podejrzeć efekt pracy.

 

W ten sposób widzimy grafikę, która wstawiliśmy na stronie możemy ja teraz sformatować, to jest wyrównać do prawej czy lewej, zwiększyć odstęp grafiki od tekstu, oraz nadąć jej podpis.skalowanie i edycja grafiki

Klikamy na grafikę i w edytorze tekstowym, klikamy przycisk wstaw dostosuj obrazek. W otwartym oknie kolejno nadajmy opis obrazka i jego tytuł. W drugiej zakładce decydujemy o takich parametrach jak:
Wyrównanie – jest ta opcja nam znana, określamy z której strony obrazka ma być tekst.

Rozmiar obrazek w pikselach – jeśli jest za duży możemy go zmniejszyć, ale nie powiększyć. Jednak łatwiej w tekście rozmiar obrazka zmniejszać za pomocą przeciągania za rogi obrazka. Po kliknięciu na obrazek pojawił się na jego rogach kwadraciki kliknijmy na nie i przeciągajmy je z wciśniętym klawiszem myszy.

Odstępu obok oraz nad i pod – tutaj ustalamy odstęp obrazka od tekstu, jeśli tego nie ustawimy tekst będzie dotykał obrazka – nie jest o estetyczne.

opcje grafiki

Klikamy wstaw o już obrazek jest wstawiony.

Nowe opcje wstawiania grafikiw Joomla 3.0

 opcje grafiki dla joomla 3

Po edytorem jest ople obrazki i łącza. Jest to nowość w Joomla 3.0. Tutaj wstawiamy obrazki dla tekstu wprowadzenia i tekstu pełnego.

Wcześniej klikaliśmy opcje grafika na dole edytora tekstu. W Joomla 3.0 grafikę do tekstu można wstawić również wykorzystując tą nowość. Czyli chwilowo zapominamy o tamtym przycisku.

Klikamy przycisk wybierz przy opcji Ilustracja wprowadzenia –  z menadżera wybieramy obrazek jaki chcemy wstawić we wprowadzeniu do artykułu. Poniżej w kolejnych polach opisujemy obrazki w  już obrazek wstawiony. Niestety nie pojawi się on nam w edytorze, jednak wiemy, że będzie we wprowadzeniu do artykułu na samy początku, a tekst będzie go opływał tak jak założyliśmy.

Ta operację powtarzamy dla obrazka, który ma być wstawiony w pełnej treści artykułu. O dzieleniu artykułów w  kolejnych częściach.

W ten sposób możemy wstawić tylko dwie grafiki. Jeśli chcemy wstawić ich więcej robimy to metodą opisana wyżej.

Ta nowość w jest bardzo przydatna do szybkiego wstawiania grafik wg schematu. Po prostu wlewamy tekst resztę załatwiamy opcjami. Ci co znają taki komponent jak K2 do Joomla czy też WORDPRESSA wiedzą, że taka możliwość jest już w tych systemach, wprowadzenie jej do Joomla 3.0 było tylko kwestują chwili. Chodź Joomla poszła dalej i umożliwiła wstawienie dwu obrazków, dla wstępu i rozwinięcia.

To są podstawowe informacje o wstawaniu grafiki w Joomla 3.0, w kolejnej części zajmiemy rozbudową struktury naszego serwisu o kategorie i i umieszczanie artykułów w odpowiednich kategoriach.

 

Książka o Joomla 3

Pierwsza polska książka o najnowszej Joomla serii 3.

TYLKO 29,99 zł brutto - Faktura VAT 23% odlicz od podatku.

Ebook Joomla 3.x

Okładka ksiazki

Kupiłeś kurs co dalej

Kursy z mojej strony są dostarczane tylko w postaci elektronicznej. Nie wysyłam kursów pocztą.

Jak pobrać kupiony kurs:

Po zakupie kursu i opołaceniu otrzymają Państwo, drugi mail. Tutuł tego meila zaczyna się od Potwierdzono zamówienie, w tym meilu obok jest link w postaci tytułu kursu. Nalezy na niego kliknąć i pobrać plik PDF, tam są dane do serwera FTP oraz jak się podłaczyć. Po podłączeniu przeciągamy wszystkie pliku z fodera na swój komputer, Poza filmami sa tam też pliki rozszerzeń użytych w kursie, lub kopie stron jakie stworzyliśmy, nie ma rozszerzeń płatnych.

Prawa autorskie

Wszystkie treści tutaj publikowane są objete prawem autorskim - jeśli chcesz korzystać z tekstów i filmów zawartych na tej stronie powiadom mnie o tym. Zostawa proszę adnotacje o autorze tekstu lub filmu.

Odcinki darmowego kursu Joomla 3.X

  • Default
  • Title
  • Date
  • Random
load more hold SHIFT key to load all load all