Wtyczka SARE pozwala na łatwe kopiowanie treści z artykułów, a następnie wstawianie ich do odpowiednio przygotowanego szablonu newslettera. Narzędzie korzysta z tagów OG powszechnie używanych na stronach internetowych. Zapamiętuje określone wartości, a następnie uzupełnia w wskazanych miejscach newslettera. Treść po wstawieniu do newslettera może być dowolnie modyfikowana poprzez Edytory SARE. Wtyczka jest kompatybilna z przeglądarkami Firefox i Chrome.
Instalacja wtyczki – serwis dodatków
Wtyczka podobnie jak inne rozszerzenia programu Firefox i Chorome jest dostępna w serwisach z rozszerzeniami do przeglądarki. Wystarczy w polu wyszukiwarki podać nazwę wtyczki SARE OG Tag i postępować zgodnie z instrukcją.
Instalacja przez serwis dodatków Firefox:
- Serwis dostępny jest pod adresem https://addons.mozilla.org/pl/firefox/
- Link bezpośredni do wtyczki to: https://addons.mozilla.org/pl/firefox/addon/sare-og-tag/
Instalacja przez serwis dodatków Chrome:
- Serwis dostępny jest pod adresem https://chrome.google.com/webstore/category/extensions
- Link bezpośredni do wtyczki to: https://chrome.google.com/webstore/detail/sare_og_tag
Zarządzanie treścią w pamięci wtyczki
Po zainstalowaniu wtyczki, w przeglądarce pojawia się ikona wtyczki (). Po jej kliknięciu dostępna są opcje kopiowania treści do pamięci oraz usuwania treści z pamięci. Kliknięcie w ikonę narzędzia po instalacji, nie zawiera żadnych i danych wygląd następująco:
Wybranie opcji kopiuj tagi (), powoduje skopiowanie tagów OG z aktualnie przeglądanej strony. W przypadku gdy na stronie nie ma tagów OG, narzędzie nie wykona żadnej akcji i pamięć wtyczki będzie pusta. Strony opisane tagami będą kopiowane do pamięci. Przykładowo będąc na stronie: https://www.google.pl/ , wtyczka skopiuje do pamięci parametry i wyświetli następującą treść:
W oknie narzędzia pojawia się informacja:
- O typach pobranych tagów
- O adresie URL
Zapamiętane dane można wkleić do wiadomości – przycisk wklej () lub usunąć – przycisk usuń (
). Dodanie kolejnej strony skutkuje pojawieniem się w okienku narzędzia nowej pozycji którą można zarządzać w ten sam sposób. Dodatkowo opcja usuń wszystkie (
) pozwala na wyczyszczenie pamięci dodatku.
Przygotowanie newslettera
Skopiowane do pamięci wtyczki dane, można wykorzystać we wcześniej przygotowanej wiadomości. Sama wiadomość jest standardowym kodem HTML zawierającym odpowiednio przygotowane pola. Dzięki takiemu rozwiązaniu można wstawić następujące dane do wiadomości:
- og:title – tytuł kopiowanej strony
- og:type – typ, kategoria kopiowanej strony
- og:url – adres URL strony
- og:image – grafika wykorzystywana do opisu strony
- og:audio – plik audio wykorzystywany do opisu strony
- og:description – tekst opisujący stronę
- og:determiner – przedrostek opisujący stronę, wykorzystywany w stronach anglojęzycznych
- og:locale – informacja o lokalizacji
- og:site_name – nazwa wykorzystywana w przypadku, gdy strona jest częścią dużego serwisu
- og:video – wideo opisujące stronę
Wskazane elementy powinny zostać zamieszczone wewnątrz newslettera. Ważne, aby element który będzie wypełniany treścią, został odpowiednio oznaczony – akapit, komórka, tabela itd. zawierając pola do podmiany. Pola te, powinny być dodane do klasy og:container (oznaczenie w HTML: class=”og-container”). Sposób ich wyświetlenia, stylowania i zachowania jest dowolny. Ważne, aby w treści wiadomości zawrzeć elementy, które mają być wypełnione skopiowaną ze stron treścią. Znacznik powinien być wprowadzony w treść maila bez dodatkowych znaków (bez znaku % jak przy personalizacji prostej). Przykład uzupełnienia wiadomości:
Na screenie widać że treści zostały w wybranych miejscach pogrubione, ustawione kursywą oraz różnej wielkości czcionkami. Grafika w wiadomości może mieć z góry założoną szerokość, dzięki czemu po wstawieniu treści układ wiadomości nie powinien ulec zmianie – grafika dopasuje wysokość do założonej szerokości.
Przykład kodu HTML który powala na wstawianie treści podobnie jak na screnie, znajduje się poniżej.
1 |
<table style="width: 400px;" border="0" cellspacing="0" cellpadding="0" align="center"><br><tbody><br><tr><br><td class="og-container"><br><p align="left"><strong>Tytuł: og:title</strong><br>Typ: og:type<br>URL: <a href="og:url" title="og:title">og:url</a> <br>Grafika: og:image<br>Audio: og:audio</p> <p align="justify"><font size="2"><em>Opis: og:description</em></font></p> <p align="left"><br>Przedrostek dla stron ANG: og:determiner<br>Info o lokalizacji: og:locale<br>Nazwa strony: og:site_name<br>Video: og:video</p> <p><img border="0" src="og:image" width="300"></p><br></td><br></tr><br></tbody><br></table> |
Przy kopiowaniu tagów okazuje się że najczęściej wykorzystywanymi tagami są pierwsze z listy tj.:
- og:title
- og:type
- og:url
- og:image
- og:description
- og:locale
- og:site_name
Przygotowaną kreacje warto zapisać i wykorzystywać jako szablon wiadomości.
Wstawianie treści z pamięci wtyczki
Po przygotowaniu szablonu newslettera wykorzystującym tagi OG, można przystąpić do wypełniania treścią. Wstawianie treści polega na ustawieniu kursora w sekcji oznaczonej class=”og-container” a następnie kliknięcie w wklej () we wtyczce przeglądarki. Po kliknięciu, pola wiadomości zostają zastąpione treścią z pamięci wtyczki. Wstawiona treść zostaje uzupełniona w kodzie HTML wiadomości. Możliwe jest dowolne edytowanie poprzez edytor wiadomości jak i kod HTML. Rozwiązanie nie pozwala na ponowne wstawienie treści w miejsce docelowe – raz zamieniony kod, zostaje nadpisany.
Poniżej przykład wypełnionej treści po wklejeniu zawartości z pamięci: