Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

Za darmo nie umarło - WordCamp Wrocław

989 views

Published on

W GavickPro zawsze poświęcaliśmy sporo czasu na rozwijanie darmowych produktów dostępnych dla szerokiego grona użytkowników. Ta prezentacja była premierą oraz pokazem możliwości naszych nowych i całkowicie darmowych pluginów dla WordPressa. Ujawnia też czego można się spodziewać po nadchodzącej wersji 2.* naszego darmowego frameworka – GavernWP.

Published in: Technology
  • Be the first to comment

Za darmo nie umarło - WordCamp Wrocław

  1. 1. Tomasz Dziuda ✓ Lead Developer w GavickPro ✓ @dziudek ✓ wp.dziudek.pl ✓ zebymniezapomnial.tumblr.com
  2. 2. Darmowe rozszerzenia
  3. 3. ✓ Oparte na licencji GPL ✓ Darmowe wsparcie techniczne ✓ Pełna funkcjonalność dostępna za darmo ✓ Łatwy wgląd do kodu źródłowego i jego zmian na Githubie: https://github.com/GavickPro
  4. 4. GK LESS
  5. 5. LESS?
  6. 6. LESS = CSS + Zmienne Funkcje Mixiny Warunki Komentarze inline DRY Zagnieżdżone reguły Operacje matematyczne
  7. 7. @base_size: 1000px; .border-radius(@radius: 5px) { -webkit-border-radius: @radius; -moz-border-radius: @radius; border-radius: @radius; } .parent { .border-radius; width: @base_size; .child { .border-radius; float: left; width: @base_size * 0.25; &:hover { background: #eee; } & > div { .border-radius; } } } .parent { -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; width: 1000px; } .parent .child { -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; float: left; width: 250px; } .parent .child:hover { background: #eee; } .parent .child > div { -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; } LESS CSS>> Preprocessor >>
  8. 8. Dla zainteresowanych ✓ http://lesscss.org/ ✓ http://less2css.org/ ✓ http://ciembor.github.io/lesscss.org/ ✓ https://github.com/dziudek/LESS-Mixins ✓ http://www.slideshare.net/dziudek/less-word-up- wrocaw2013 ✓ http://getpreboot.com/
  9. 9. Konfiguracja
  10. 10. Możliwości ✓ Możliwość określenia katalogów wejściowych i wyjściowych ✓ Kompilacja wybranych plików LESS ✓ Kompilacja na życzenie ✓ Generowanie errorlogów
  11. 11. Gdzie pobrać? Github: https://github.com/GavickPro/GK-LESS Dokumentacja: https://www.gavick.com/documentation/ wordpress-themes/plugins-for-wordpress/gk-less/
  12. 12. GK Tabs
  13. 13. Struktura Widżetu
  14. 14. Struktura Widżetu
  15. 15. Konfiguracja Podstawowe Interfejs Animacja Inne
  16. 16. Możliwości ✓ 6 wbudowanych styli ✓ Konfigurowalne animacje ✓ Konfigurowalny interfejs ✓ Cache
  17. 17. Konfigurowalny interfejs
  18. 18. Dostępne Style
  19. 19. Responsywność ✓ Obsługa gestów na ekranach dotykowych ✓ Pełna skalowalność
  20. 20. Własne Style ✓ Tworzymy plik o nazwie my-style.css ✓ Tworzymy w tym pliku odpowiedni nagłówek (File Header API):    /* Name: My style */ ✓ Poprzedzamy wszystkie selektory CSS klasą .my-style ✓ Odświeżamy ustawienia widżetu, wybieramy z listy styli My style i cieszymy się nowym stylem :-)
  21. 21. Akcje i Filtry ✓ gk_tabs_before_tabs_wrapper ✓ gk_tabs_before_tabs_list ✓ gk_tabs_after_tabs_list ✓ gk_tabs_before_tabs ✓ gk_tabs_after_tabs ✓ gk_tabs_after_tabs_wrapper ✓ gk_tabs_tab_title ✓ gk_tabs_tab_content ✓ gk_tabs_prev_button ✓ gk_tabs_next_button
  22. 22. Gdzie znaleźć? Github: https://github.com/GavickPro/GK-Tabs Dokumentacja: https://www.gavick.com/documentation/ wordpress-themes/plugins-for-wordpress/gk-tabs/
  23. 23. Przerwa dla Gardła ;-)
  24. 24. GK News Show Pro
  25. 25. Struktura Wpis Źródło danych Format wpisu Kontener
  26. 26. Wpis ✓ Standardowo składa się z: ✓ Tytułu ✓ Tekstu ✓ Grafiki ✓ Bloku informacji ✓ Hiperłącza
  27. 27. Kontener ✓ Struktura otaczająca wpisy ✓ Pozwala na tworzenie dowolnych układów
  28. 28. Źródło danych ✓ Źródło informacji wyświetlanych we wpisie ✓ Generuje elementy artykułu ✓ Mapuje dane dla formatu wpisu
  29. 29. Format wpisu Opisuje strukturę wpisu za pomocą wstawek zamienianych na odpowiednie wartości {ID} {URL} {TITLE} {TEXT} {IMAGE_FULL} {IMAGE_LARGE} {IMAGE_MEDIUM} {IMAGE_THUMBNAIL} {CATEGORIES} {AUTHOR_ID} {AUTHOR_NAME} {AUTHOR_URL} {DATE} {COMMENT_COUNT} {COMMENTS} <h3> <a href={URL}>{TITLE}</a> </h3> <p>{TEXT}</p> <small>{DATE}</small>
  30. 30. Dostępne źródła danych ✓ WordPress ✓ WooCommerce ✓ Pliki XML ✓ Pliki JSON ✓ Kanały RSS
  31. 31. Dostępne Kontenery ✓ Kontener domyślny ✓ News Gallery ✓ Title Overlay
  32. 32. Konfiguracja
  33. 33. Filtry i Akcje ✓ gk_nsp_art_title ✓ gk_nsp_art_text ✓ gk_nsp_art_image ✓ gk_nsp_art_info ✓ gk_nsp_art_readmore ✓ gk_nsp_link_title ✓ gk_nsp_link_text ✓ gk_nsp_before_article ✓ gk_nsp_after_article ✓ gk_nsp_before_link ✓ gk_nsp_after_link ✓ gk_nsp_before_wrapper ✓ gk_nsp_after_wrapper
  34. 34. Przykłady użycia
  35. 35. Gdzie znaleźć? (beta) Github: https://github.com/GavickPro/GK-News-Show-Pro Dokumentacja: https://github.com/GavickPro/GK-News-Show-Pro/wiki
  36. 36. Let’s talk about future
  37. 37. GavernWP v.2.0
  38. 38. [Screeny]
  39. 39. Nowe rodzaje responsywnego menu
  40. 40. Font Awesome
  41. 41. GK LESS - integracja ✓ Plik variables.less ✓ @nazwa: wartość; //Etykieta;opis
  42. 42. Nowe podstrony ✓ FAQ ✓ Team ✓ Team member ✓ Odświeżona Galeria ✓ Archiwum
  43. 43. Porządki ✓ Przegląd dokumentacji inline ✓ Usunięcie mało popularnych opcji ✓ Zmiana ustawień domyślnych na wygodniejsze
  44. 44. Optymalizacja ✓ Cache plików JSON ✓ Nowa struktura ustawień ✓ Zoptymalizowane Widget Rules
  45. 45. Kiedy? ~Listopad 2013
  46. 46. Ważne Adresy ✓ http://www.gavick.com/ ✓ https://github.com/GavickPro ✓ @gavickpro
  47. 47. Pytania?

×