Instrukcja krok po kroku na przykładzie mojego nowego, świeżutkiego profilu BLOGia - oczywiście zapraszam, odwiedźcie mnie ;)
Jak na bloga dodać tablicę z Pinterest
Dodawanie tego gadżetu jest bardzo proste. Pamiętacie dodawanie gadżetu Facebook'a? Tu jest podobnie: należy skonfigurować czyli dopasować sobie wygląd gadżetu, a następnie wkleić w odpowiednie miejsca wygenerowany kod. I tyle. Zaczynamy ...KROK 1. Skopiuj adres tablicy
Wchodzimy na swój profil.
Wybieramy/klikamy wybraną tablicę, przechodzimy do paska adresu, zaznaczamy i kopiujemy cały adres internetowy:
Krok 2. Wejdź na stronę Pinterest i skonfiguruj gadżet:
Wejdź na stronę Pinterest'a: https://developers.pinterest.com/tools/widget-builder/?type=board&boardHeight=240&boardWidth=400&imageWidth=80&template=square
Domyślnie gadżet wyświetla zawartość tablicy Pitnerest. Aby ustawić własną tablicę należy skopiowany wcześniej adres wkleić w pole URL tablicy na Pintereście:
Po poprawnym wklejeniu adresu widoczna powinna być zawartość naszej tablicy:
Możemy wybrać Wielkość (wielkość/kształt) gadżetu, do wyboru mamy: Kwadrat, Pasek boczny, Nagłówek. Jeżeli propozycje te nam nie odpowiadają to wybieramy Utwórz własne i ustawiamy parametry Szerokość zdjęcia, Wysokość tablicy i Szerokość tablicy.
W przypadku, gdy gadżet ustawiany będzie na pasku bocznym bloga, powinniśmy przede wszystkim rozpocząć od ustawienia Szerokości, tak by gadżet zmieścił się. Gdy jest za długi zmniejszamy Wysokość. Gdy obrazki/piny są zbyt małe to powiększamy Szerokość zdjęcia. Pamiętaj jednak, że nie są to dokładne wymiary gadżetu, tylko orientacyjne, to Pinterest dobiera nam wymiary, my tylko oznaczamy więcej/mniej.
Dokładne wymiary są widoczne na samym dole (podkreśliłam czerwoną linią poniżej). Należy manewrować tymi 3 parametrami, aby uzyskać pożądany wygląd:
Krok 3: Pobranie i wklejenie kodu gadżetu (do szablonu, gadżetu bloggera)
Gdy wygląd widgetu nam odpowiada przechodzimy do umieszczenia go na blogu. Na dole pod podglądem wtyczki znajduje się kod, który należy umieścić w szablonie.
Są to dwa kody.
Kod pierwszy
Kopiujemy pierwszy kod. Wklejamy go w miejsce, w którym chcemy, by gadżet był widoczny. Może być to np pasek boczny bloga, stopka ... itd.
Po skopiowaniu kody, przechodzimy do Układ i klikamy Dodaj gadżet w wybranym miejscu np pasku bocznym:
Wybieramy gadżet o nazwie HTML/JavaScript. W pole Tytuł wpisujecie nazwę np Pinterest, w pole treść wklejacie skopiowany wcześniej kod gadżetu, zapisujemy:
Możecie teraz również umieścić gadżet w wybranym miejscu, po prostu przeciągnąć go.
Kod drugi
Teraz trudniejsze zadanie. Wracamy na Pinterest i kopiujemy drugi kod. Musimy wkleić go do szablonu. Dlatego teraz idziemy do Bloggera, klikamy Szablony > Edytuj kod HTML.
Przed wszelkimi zmianami w szablonie należy wykonać sobie jego kopię. Pamiętajcie, że nawet jeden niefortunny znaczek, a może się nam "rozjechać cały wygląd bloga". Robimy kopię: jak zrobić kopię szablonu blogger oraz przechodzimy dalej.
Wyszukujemy w kodzie instrukcję </body>. Aby to zrobić klikamy w pierszą linię kodu szablonu i uruchamiamy wyszukiwanie, czyli wciskamy na klawiaturze jednocześnie klawisze Ctrl i F. W okienko wyszukiwania wpisujemy:
oraz wciskamy Enter, aby wyszukać kod. W kodzie zostanie oznaczony wyszukiwany fragment, tutaj oznaczony kolorem żółtym przez wyszukiwarkę Chrome. Nad linią zawierającą </body> należy teraz wkleić skopiowany drugi kod (jeśli potrzeba zrób sobie miejsce tworząc pusty wiersz/linię po prostu wciskając Enter):</body>
Zapisujemy zmiany.
Na blogu w wybranym miejscu powinien pojawić się gadżet, piny z wybranej tablicy Pinterest.
Pomysł na posta powstał jako odpowiedź na zadanie mi pytanie (poprzez Zadaj pytanie):
Mam pytanie, w jaki sposób dodać pinterestowego widgeta do swojej witryny na blogerze, tak aby ukazał się skrót zdjęć z tablicy, a nie tylko znaczek "P" lub "Pin it".Jeżeli pomogałam albo po prostu uważacie, że post jest przydatny, nie zapomnijcie kliknąć Lubię to poniżej. Dziękuję ;)
Jeżeli szukacie innych przydatnych gadżetów na waszego bloga proponuję dodanie na bloggera gadżetu Newsletter.
Taki bład wyszedł:(
OdpowiedzUsuńBłąd podczas analizowania pliku XML, wiersz 1008, kolumna 15: Attribute name "async" associated with an element type "script" must be followed by the ' = ' character.
u mnie to samo :( co trzeba zrobić??
UsuńHej, blogia nie wkleiła dokładnie tego linka którego miała przy Pintereście. Zauważcie, że jest async="" defere="". a kopiując macie async defere. Zmieńcie ręcznie.
UsuńJa po zmianie nie mam błędu, natomiast nie widać gadżetu na blogu
U mnie się nie udało, bo w całym szablonie nie ma body (piszę bez znaków, bo mnie tu moderator nie puszcza). I ten sam błąd wyszedł jak świetlicowym Inspiracjo,jak próbowałam wkleić drugi kod gdzie indziej.
OdpowiedzUsuńmam ten sam problem. udało Cię Go rozwiązać?
UsuńU mnie niestety też się nie udało. Nie wyskoczył mi żaden błąd, ale nie widać gadżetu na blogu :(
OdpowiedzUsuń