WordPress obsługuje wiele formatów graficznych. Najbardziej Wam znane to PNG I JPG, ale jest jeszcze sporo innych. Zaliczają się one do grupy grafik rastrowych, które w skrócie są obrazami składającymi się z pikseli. Wadą tego formatu jest, iż przy próbie zwiększenia rozmiaru tracą na jakości. Obrazowo tłumacząc, dzieje się to ponieważ piksele próbują się namnożyć. Algorytm nadaje im kolor na podstawie sąsiadujących.
W pewnych przypadkach na ratunek przychodzi grafika wektorowa inaczej nazywaną grafiką obiektową. Spowodowane jest tym, że obraz opisany jest za pomocą figur geometrycznych (w przypadku grafiki dwuwymiarowej) lub brył geometrycznych (w przypadku grafiki trójwymiarowej). Daje to niewyobrażalną elastyczność. Wadą natomiast jest to, że nie da się za jej pomocą stworzyć obrazu przypominającego rzeczywistość. Jednak idealnie się sprawdza do logotypów, ikon, ilustracji czy infografik.
SVG:
JPG:
SVG (ang. Scalable Vector Graphics) oparty jest na XML (ang. Extensible Markup Language), czyli na uniwersalnym języku znaczników. Co daje możliwość umieszczania go na stronach w pierwotnej postaci.
WordPress domyślnie nie obsługuje przesyłania plików SVG ze względu, iż niosą ze sobą pewne niebezpieczeństwa.
Pliki SVG niosą ze sobą z tego powodu pewne niebezpieczeństwo. Dlatego WordPress domyślnie nie obsługuje przesyłania plików SVG.
Jeśli podejmie się próbę przesłania obrazu SVG w WordPress, pojawi się następujący komunikat o błędzie:
Przepraszamy, ze względów bezpieczeństwa ten typ pliku nie jest dozwolony.
Jest to spowodowane tym, że XML jest podobny do HTML (podstawowy język wykorzystywany w pisaniu stron) i umożliwia to tworzenie luk w bezpieczeństwie.
Poniższe metody będą próbować oczyścić pliki SVG w celu poprawy ich bezpieczeństwa. Jednak te wtyczki nie mogą całkowicie zapobiec przesłaniu lub wstrzyknięciu złośliwego kodu.
Dlatego najważniejsze jest to, aby użyć pliku z pewnego źródła.
Jak dodać obsługę plików SVG w WordPress?
Wtyczka nr 1
Wtyczka SVG Support umożliwia dodanie plików SVG i wyświetlanie ich w bibliotece mediów.
Zaznaczenie opcji Restrict to Administrators – Ogranicza możliwość dodania plików tylko dla administratora.
Load frontend CSS – bardzo mały fragment kodu, który w niektórych przypadkach pomaga w wyświetlaniu plików SVG na interfejsie użytkownika.
Enable Advanced Mode – domyślnie pliki SVG używane są jako pliki obrazów. Włączenie tej funkcji umożliwia korzystanie z nich w stopniu zaawansowanym.
Tryb zaawansowany daje możliwość:
- umieszczenie skryptu po zamykającym znacznikiem body zamiast header,
- użycie rozszerzonego pliku JS zamiast zminimalizowanego pliku JS,
- nadanie własnej klasy CSS i usunie domyślnie klasy WordPressa.
Wtyczka nr 2
Wtyczka SVG safe wyposażona jest w funkcję automatycznego czyszczenia i wyświetla pliki w bibliotece mediów.
Wadą jest to, że ta wtyczka w wersji darmowej umożliwia przesyłanie plików SVG przez wszystkich użytkowników, którzy mogą pisać posty w witrynie WordPress.
Funkcje Pro (premium – £39.00):
- optymalizacja SVGO – zaoszczędzenie miejsca,
- ograniczenie przesyłania plików SVG do określonych ról użytkowników witryny WordPress,
- wsparcie Premium.
BONUS – Optymalizacja pliku SVG samodzielnie i za darmo
- Pobierzcie i zainstalujcie darmowy program Visual Studio Coder https://code.visualstudio.com/Download
- Uruchomicie program Visual Studio Coder
- Należy użyć skrótu klawiszowego ctr+shift+x lub przejdź View>Extensions
- W lewym górnym rogu otworzy się wyszukiwarka rozszerzeń (extensions) – Należy wpisać w nią SVG. Wybierzcie pierwszy od góry składający się jedynie z liter ”SVG”. Po prawej stronie pokaże się żółte logo. Wydawca to jock. Znajduje się tam mały przycisk instal. Należy go kliknąć.
- Teraz należy otworzyć własny plik SVG File>Open File.
- Teraz niezbędnie jest pozłużenie się skrótem klawiszowym ctr+shift+p
- Otworzy się mała lista. Należy wpisać minify svg, a następnie kliknąć w odszukany wynik na liście.
- Po kilku sekundach znikną wszystkie zbędne znaki i spowoduje to zmniejszenie wielkości pliku.
Pierowty plik: 23KB. Po optymalizacji: 12KB.
Istnieją optymalizatory online jednak póki co nie jestem wstanie polecić w 100% bezpiecznego.
nie obsługuję Word Pressa, bo nie muszę – bloga mam na bloggerze. I trocgę żałuję, bo wydaje mi się, że WordPress ma więcej możliwości.
Przyznam, że ja nawet nie wiem, czy tego potrzebuję, zupełnie się nie znam, tę wiedzę pozostawiam mężowi, zatem jemu podsunę artykuł. 🙂
Przydatne informacje dla obsługujących WordPress. 🙂
Nie myślałam wcześniej o dodaniu tej możliwości 🙂 Na pewno skorzystam, gdy będę potrzebować. Dzięki za ciekawy artykuł 😉
WordPressa mamy, ale nigdy nie wykorzystywałyśmy informacji z wpisu. Dzięki za wskazówki.