Optymalizuj obrazy Drupala podczas tworzenia materiałów

1. 1. Włącz moduły.
2. 2. Utwórz formatowanie stylu wyjścia obrazu w JPG
3. 3. Edytuj ustawienia pola Obraz w wybranym typie materiału lub we wszystkich typach.
4. Optymalizacja istniejących zdjęć
5. Phatch Image Inspector - kompresja obrazu zbiorczego

Przechowywanie zdjęć na hostingu czasami wymaga optymalizacji , jeśli jest wiele zdjęć, a miejsce na dysku nie jest tanie. Podstawowa funkcja optymalizacji obrazów w polu Typ obrazu w Drupalu jest implementowana przez opcję „ Maksymalna rozdzielczość obrazu ” w ustawieniach typu obrazu. Ustawiając, powiedzmy, maksymalnie 1200 na 1500 pikseli, zmuszasz drupala do kompresji dużych obrazów do tej wartości.

Ale co, jeśli chcesz przekonwertować PNG (ważące 3-4 razy więcej niż JPG) na format JPG? Jak dostroić funkcje kompresji obrazu?

Następnie, aby nie zmuszać użytkowników do kompresji i konwertowania obrazów przed przesłaniem ich na stronę, możesz skorzystać z następującej lekcji.

Tematem lekcji jest optymalizacja obrazów załadowanych w polu Typ obrazu i formatowanie w JPG.

Pytania : Jak zapisać zoptymalizowane obrazy podczas ładowania w polu na stronie dodawania materiału? Jak zastosować styl i zachować oryginalny obraz w tym stylu? Jak zmienić rozszerzenie obrazu z PNG i GIF na JPG? Konwersja PNG na JPG? Jak konwertować wszystkie obrazy (format) na JPG? Jak zmniejszyć folder zdjęć? Jak zoptymalizować rozmiar plików graficznych na stronie? Jak natychmiast skompresować plik podczas dodawania materiału? Jak zmniejszyć rozmiar witryny i rozmiar pliku?

Problem został rozwiązany na stronie Dru.io http://dru.io/question/2038 (i inne linki w pytaniach), oto lekcja wizualna ze zdjęciami.

Do pracy ze zdjęciami w tej lekcji używamy trzech modułów:
ImageCache Actions - pakiet modułów, który dodaje nowe narzędzia formatowania dla widoków obrazów (ale działa tylko do wyświetlania zdjęć, nie zapisuje nowego zdjęcia w polu)
Oryginalny obraz ze stylem - przydatny moduł, który stosuje styl do pobieranych plików obrazów i zapisuje zoptymalizowany lub po prostu sformatowany obraz.
Ścieżki pliku (pola) - które po prostu zmieniają rozszerzenie pliku, w naszym samouczku formatujemy wszystkie obrazy w formacie JPG i zapisujemy z takim rozszerzeniem .jpg

Zauważ, że wszystkie transformacje ze zdjęciami są wykonywane przez Drupala z ustaloną jakością, która jest ustawiona na stronie Konfiguracja - Narzędzie do przetwarzania obrazu admin / config / media / image-toolkit. Zaleca się ustawienie jakości od 87 - dobra kompresja, ale utrata jakości - do 97 - praktycznie bez kompresji rozmiaru pliku, ale z zachowaniem jakości. Następnie rozważymy, jak skompresować PNG i przekonwertować go na JPG (zmniejsza to rozmiar pliku o 3-4 razy).

1. Włącz moduły.

Pobierz moduły zaproponowane w kolumnie Moduły i dołącz następujące elementy:
Imagecache Actions - główny moduł z pakietu,
Imagecache Canvas Actions - umożliwia tworzenie płótna w przezroczystych obrazach PNG lub GIF, ustawianie białego tła lub tła witryny,
Imagecache Color Actions - ten moduł dodaje funkcję zmiany formatu pliku (do żądanego jpg),
Oryginalny obraz w dobrym stylu,
Ścieżki do pliku (pola).

Włącz moduły z pakietu ImageCache Actions i innych.

2. Utwórz formatowanie stylu wyjścia obrazu w JPG

Otwórz konfigurację - tryby wyświetlania obrazu , utwórz nowy styl na JPG , wybierz akcję Zmień format pliku , określ format JPG i żądany poziom kompresji w ustawieniach akcji (zalecane od 87 - mały rozmiar pliku i słaba jakość obrazu - do 95 - obraz wysokiej jakości, ale większy plik ). I zapisz tę akcję. Jeśli nie masz opcji Zmień format (lub Zmień format, Format) na liście wyboru, włącz moduł Kolor Imagecache.

Wybierz akcję Zmień format (lub zmień format po przetłumaczeniu)

Po dodaniu akcji konwersji do JPG, musisz zdefiniować białe płótno pod obrazem, w przeciwnym razie przezroczyste pliki Png, gif będzie miało domyślne tło - czarne lub # 000000.
Więc wybierz akcję „Zdefiniuj płótno” lub Canvas (jeśli nie jest przetłumaczone, coś w tym stylu), aw ustawieniach określ kolor HEX ffffff - czyli biały.

Dodaj akcję Zdefiniuj płótno

Konfiguracja, białe tło ffffff - jeśli witryna ma białe tło.

Następnie następujący obraz zostanie wyświetlony na ekranie wyświetlania doJPG :
1. Konwertuj na JPG ...
2. Zdefiniuj płótno ...

3. Edytuj ustawienia pola Obraz w wybranym typie materiału lub we wszystkich typach.

Otwórz strukturę - typy treści, naprzeciwko pożądanego rodzaju materiału - zarządzaj polami. Edytuj pole Typ obrazu, ustaw następujące opcje:
1. Zaznacz pole Włącz ścieżki pliku (pola)?
2. Rozwiń „ USTAWIENIE ŚCIEŻKI PLIKU (POLA) ” zablokuj i popraw szablon nazwy pliku ze standardowego [plik: nazwa-ffp-tylko-oryginał]. [Plik: ffp-rozszerzenie-oryginał] do pliku, którego potrzebujemy [plik: ffp- name-only-original] .jpg - zapisze wszystkie pliki z rozszerzeniem jpg - ale tylko dla nowych materiałów. W przypadku starszych materiałów pozostanie bez zmian, jeśli nie edytujesz ich po tym ustawieniu.
3. w kolumnie „ Zastosuj styl do obrazu po wgraniu” wybierz utworzony styl do JPG - spowoduje to konwersję pobranych plików na jpg lub zgodnie z preferencjami wyświetlanymi na ekranie.

Zmień rozszerzenie pliku

Zastosuj styl obrazu do przesłanego pliku obrazu.

Również w ustawieniach pola Ścieżki pliku (pola) w polu Obraz są dawki do aktualizacji już załadowanych obrazów, ale nie próbowaliśmy zastosować dla nich pożądanego stylu obrazu. Dlatego, jak aktualizować już przesłane pliki, stosować do nich style, konwertować, zmieniać rozszerzenia, zadawać pytania i odpowiadać na forach.

Nie zapomnij także o innych rodzajach materiałów, aby ustawić te pola typu Obraz.
Zmniejszy to rozmiar witryny, pozwoli ci dodać dowolne zdjęcia o dowolnym rozmiarze i rozszerzeniu, optymalizując je natychmiast podczas ładowania i zapisywania materiału.

Jeśli przekonwertowanie PNG na JPG jest niewystarczające, możesz dodatkowo ograniczyć rozmiar obrazu, używając pola „Maksymalny rozmiar obrazu” w ustawieniach typu obrazu lub dodając odpowiednią funkcję skalowania do stylu toJPG.
Jak zezwolić użytkownikowi na wybór stylu zapisanego oryginalnego obrazu podczas zapisywania i ustawić domyślny styl, a także jak zezwolić użytkownikowi na anulowanie formatowania jego obrazu, aby dać możliwość zapisania obrazu w takiej postaci, nie jest omawiany w tej lekcji (chociaż domyślamy się, jak ważna jest ta opcja dla niektóre projekty).

PS: Przy okazji, moduł File (Field) Paths daje błąd, który został rozwiązany w artykule: http://www.drupal.ru/node/112630
„Przestarzała funkcja: preg_replace (): modyfikator / e jest przestarzały, użyj preg_replace_callback zamiast _filefield_paths_replace_path () (linia 328 w ...”

Optymalizacja istniejących zdjęć

Moduł Ścieżki FileFiled ma opcje w ustawieniach pola Typ obrazu: Cofnij aktualizację, Aktywna aktualizacja. Być może instalując te pola wyboru, możesz przenieść lub po prostu zastąpić wcześniej utworzone pliki i zastosować do nich pracę modułu stylu oryginalnego obrazu. Ale jeśli nie ten, to jest inny sposób.

Phatch Image Inspector - kompresja obrazu zbiorczego

Użyj narzędzia Phatch Image Inspector Linux, przykład instalacji i użytkowania opisano tutaj: / node / 145 .
Istnieje opcja kompresji obrazów poprzez skalowanie. Phatch pozwala także na kompresję na danym rozmiarze pliku, czyli na przykład wszystkie obrazy większe niż 150 KB zostaną skompresowane do tego określonego rozmiaru. Opcja kompresji według rozmiaru jest dostępna w funkcji zapisu (akcji) w polu Maksymalny rozmiar pliku (ta opcja pojawia się tylko wtedy, gdy format pliku to JPG, JPEG).