Widżet GK News Show Pro
na 10 sposobów
Tomasz Dziuda
✓

Lead Developer

✓

@dziudek

✓

wp.dziudek.pl

✓

zebymniezapomnial.tumblr.com
GK News Show Pro
Gdzie szukać? (beta)
!

Github: https://github.com/GavickPro/GK-News-Show-Pro
!

Dokumentacja:

https:/
/github.com/Gavick...
Architektura widżetu
Kontener
Źródło
danych

Wpis

Format
wpisu
Składowe wpisu
✓

Tytuł

✓

Tekst

✓

Grafika

✓

Blok informacji

✓

Hiperłącze
Kontener

✓

Tworzy strukturę otaczającą wpisy

✓

Pozwala na tworzenie dowolnych układów
(i zachowań)
Źródło danych

✓

Źródło informacji wyświetlanych we wpisie

✓

Generuje elementy wpisu

✓

Mapuje dane dla formatu wpisu
Format wpisu
Opisuje strukturę wpisu za pomocą wstawek
zamienianych na odpowiednie wartości:
{ID} {URL} {TITLE} {TEXT}
{IM...
Konfiguracja
Wykorzystanie
#1 Czytnik RSS
#2 Galeria produktów
z WooCommerce
#3 Lista wpisów
news-list.format
<span>{DATE}</span>
<h3>
<a href="{URL}" title=“{TITLE}">{TITLE}</a>
</h3>
<p>
Dodane przez:
<a href=“{AU...
#4 Galeria
#5 Filtry obrazów
Więcej o implementacji filtrów:	

!
http://wp.dziudek.pl/devlog/wlasne-filtry-obrazu-sepia-greyscale-w-wp_image_editor
#6 Podmiana grafik
✓ Zastosowanie

zupełnie innej grafiki niż ta

we wpisie
!

✓ Większa

optymalizacja grafik

!

✓ Lepsze

kadrowanie grafik
wp-content/uploads/gk_nsp_cache/overrides/NAZWA_PLIKU.jpg
#7 Blok z wpisami
#8 Treści z różnych
kategorii
#9 Offset
#10 Rekomendacje
testimonials.json
Kontener
Źródło
danych

Wpis

własny kod CSS

testimonials.format

Format
wpisu
testimonials.json
[

]

{

},
…

"URL": "http:/
/www.gavick.com",
"title": "High quality",
"text": "Proin non…”,
"author_n...
testimonials.format
<blockquote>
<img src="{IMAGE}" alt="Testimonial" />
<h3>{TITLE}</h3>
<p>{TEXT}</p>
<strong>{AUTHOR_NA...
CSS: https:/
/gist.github.com/dziudek/7356737
Pytania?
WordUp Łódź #1 - Widżet GK News Show Pro na 10 sposobów
WordUp Łódź #1 - Widżet GK News Show Pro na 10 sposobów
WordUp Łódź #1 - Widżet GK News Show Pro na 10 sposobów
WordUp Łódź #1 - Widżet GK News Show Pro na 10 sposobów
WordUp Łódź #1 - Widżet GK News Show Pro na 10 sposobów
WordUp Łódź #1 - Widżet GK News Show Pro na 10 sposobów
WordUp Łódź #1 - Widżet GK News Show Pro na 10 sposobów
WordUp Łódź #1 - Widżet GK News Show Pro na 10 sposobów
WordUp Łódź #1 - Widżet GK News Show Pro na 10 sposobów
WordUp Łódź #1 - Widżet GK News Show Pro na 10 sposobów
WordUp Łódź #1 - Widżet GK News Show Pro na 10 sposobów
WordUp Łódź #1 - Widżet GK News Show Pro na 10 sposobów
WordUp Łódź #1 - Widżet GK News Show Pro na 10 sposobów
WordUp Łódź #1 - Widżet GK News Show Pro na 10 sposobów
WordUp Łódź #1 - Widżet GK News Show Pro na 10 sposobów
WordUp Łódź #1 - Widżet GK News Show Pro na 10 sposobów
WordUp Łódź #1 - Widżet GK News Show Pro na 10 sposobów
WordUp Łódź #1 - Widżet GK News Show Pro na 10 sposobów
WordUp Łódź #1 - Widżet GK News Show Pro na 10 sposobów
Upcoming SlideShare
Loading in …5
×

WordUp Łódź #1 - Widżet GK News Show Pro na 10 sposobów

583 views

Published on

Prezentacja z pierwszego WordUpa w Łodzi. Opisuje 10 sposobów na wykorzystanie widżetu GK News Show Pro.

Published in: Technology
0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total views
583
On SlideShare
0
From Embeds
0
Number of Embeds
2
Actions
Shares
0
Downloads
3
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide

WordUp Łódź #1 - Widżet GK News Show Pro na 10 sposobów

  1. 1. Widżet GK News Show Pro na 10 sposobów
  2. 2. Tomasz Dziuda ✓ Lead Developer ✓ @dziudek ✓ wp.dziudek.pl ✓ zebymniezapomnial.tumblr.com
  3. 3. GK News Show Pro
  4. 4. Gdzie szukać? (beta) ! Github: https://github.com/GavickPro/GK-News-Show-Pro ! Dokumentacja: https:/ /github.com/GavickPro/GK-News-Show-Pro/wiki
  5. 5. Architektura widżetu
  6. 6. Kontener Źródło danych Wpis Format wpisu
  7. 7. Składowe wpisu ✓ Tytuł ✓ Tekst ✓ Grafika ✓ Blok informacji ✓ Hiperłącze
  8. 8. Kontener ✓ Tworzy strukturę otaczającą wpisy ✓ Pozwala na tworzenie dowolnych układów (i zachowań)
  9. 9. Źródło danych ✓ Źródło informacji wyświetlanych we wpisie ✓ Generuje elementy wpisu ✓ Mapuje dane dla formatu wpisu
  10. 10. 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>
  11. 11. Konfiguracja
  12. 12. Wykorzystanie
  13. 13. #1 Czytnik RSS
  14. 14. #2 Galeria produktów z WooCommerce
  15. 15. #3 Lista wpisów
  16. 16. news-list.format <span>{DATE}</span> <h3> <a href="{URL}" title=“{TITLE}">{TITLE}</a> </h3> <p> Dodane przez: <a href=“{AUTHOR_URL}">{AUTHOR_NAME}</a> </p> Kod CSS: https:/ /gist.github.com/dziudek/7344172
  17. 17. #4 Galeria
  18. 18. #5 Filtry obrazów
  19. 19. Więcej o implementacji filtrów: ! http://wp.dziudek.pl/devlog/wlasne-filtry-obrazu-sepia-greyscale-w-wp_image_editor
  20. 20. #6 Podmiana grafik
  21. 21. ✓ Zastosowanie zupełnie innej grafiki niż ta we wpisie ! ✓ Większa optymalizacja grafik ! ✓ Lepsze kadrowanie grafik
  22. 22. wp-content/uploads/gk_nsp_cache/overrides/NAZWA_PLIKU.jpg
  23. 23. #7 Blok z wpisami
  24. 24. #8 Treści z różnych kategorii
  25. 25. #9 Offset
  26. 26. #10 Rekomendacje
  27. 27. testimonials.json Kontener Źródło danych Wpis własny kod CSS testimonials.format Format wpisu
  28. 28. testimonials.json [ ] { }, … "URL": "http:/ /www.gavick.com", "title": "High quality", "text": "Proin non…”, "author_name": "Tomasz Dziuda", "image": “path/to/avatar.jpg”
  29. 29. testimonials.format <blockquote> <img src="{IMAGE}" alt="Testimonial" /> <h3>{TITLE}</h3> <p>{TEXT}</p> <strong>{AUTHOR_NAME}: <a href="{URL}">{URL}</ a></strong> </blockquote>
  30. 30. CSS: https:/ /gist.github.com/dziudek/7356737
  31. 31. Pytania?

×