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

✓ Lead Developer

✓ @dziudek

✓ wp.dziudek.pl

✓ zebymniezapomnial.tumblr.com

Tomasz Dziuda

GK News Show Pro

Gdzie szukać? (beta) !

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

Dokumentacja: https://github.com/GavickPro/GK-News-Show-Pro/wiki

Architektura widżetu

Wpis

Źródło danych

Format wpisu

Kontener

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} {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>

Konfiguracja

Wykorzystanie

#1 Czytnik RSS

#2 Galeria produktów z WooCommerce

#3 Lista wpisów

<span>{DATE}</span> <h3> <a href="{URL}" title=“{TITLE}">{TITLE}</a> </h3> <p> Dodane przez: <a href=“{AUTHOR_URL}">{AUTHOR_NAME}</a> </p>

news-list.format

Kod CSS: https://gist.github.com/dziudek/7344172

#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

Wpis

Źródło danych

Format wpisu

Kontener

testimonials.json

testimonials.format

własny kod CSS

[ { "URL": "http://www.gavick.com", "title": "High quality", "text": "Proin non…”, "author_name": "Tomasz Dziuda", "image": “path/to/avatar.jpg” }, … ]

testimonials.json

<blockquote> <img src="{IMAGE}" alt="Testimonial" /> <h3>{TITLE}</h3> <p>{TEXT}</p> <strong>{AUTHOR_NAME}: <a href="{URL}">{URL}</a></strong> </blockquote>

testimonials.format

CSS: https://gist.github.com/dziudek/7356737

Pytania?