Tego kodu szukałam od dawna. Znalazłam go TU i teraz tłumaczę i wyjaśniam najprościej jak się da. Można nim automatycznie dodać obraz podpis do każdego (starego i nowego) wpisu na blogu.
To bardzo proste! Każdy, nawet nie mający pojęcia o CSS ani html sobie z tym poradzi. Dla mnie ważne, że wystarczy to zrobić tylko raz, a podpis pojawia się automatycznie pod każdym wpisem. W każdym momencie możesz zmienić podpis i zostanie on automatycznie zaktualizowany pod wszystkimi postami. Grafika z podpisem nie ma ramek! To znaczy, że podpis nie będzie definiowany jak wszystkie zdjęcia na twoim blogu i nie zostaną mu przypisane ramki, jakie blogger dodaje do każdego obrazu na twoim blogu. I co równie fajne - jeśli masz dodany kod PIn IT BUTTON, o którym pisałam TU, nie musisz się martwić, że Twój podpis będzie można sobie przypiąć na Pinterest, gdyż zdjęcia dodane przez kod CSS są ignorowane przez PIN IT BUTTON! Fajnie co?
No to zaczynamy!
Krok 1
Wstaw swoje zdjęcie podpisu
Prześlij swoje zdjęcie podpisu do albumu Picasa Web na swoim blogu. Możesz to zrobić bardzo prosto tworząc Nowy Post na blogu. Ja swój zatytułwałam "Roboczy" i mam go w kopiach roboczych na swojej liście postów.
Nowy post --> Wstaw obraz --> Prześlij --> Wybierz pliki --> (po załadowaniu grafiki) Kopiuj adres URL grafiki.
po skopiowaniu URL, kliknij Anuluj, a następnie wklej adres pliku do okna posta. Nie zamykaj okna posta roboczego, będzie Ci jeszcze potrzebne.
Krok2
Dodaj CSS
Aby dodać kod CSS do swojego bloga, przejdź do szablonu --> Dostosuj --> Zaawansowane --> Dodaj arkusz CSS w Bloggerze.
Wklej poniższy CSS w polu "Dodaj niestandardowy arkusz CSS":
Teraz, wymień URL_OBRAZKA na link obrazu z który masz w poście roboczym. Upewnij się, że udało Ci się skopiować i wkleić pełny adres URL w miejsce URL_OBRAZKA dokładnie między nawiasy ()
Oto wypełniony przykład:
.Entry-content:after{content:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgA1agPWm-KAQJNyhzvMgSaoLtI24a4DGLXIOl8gRPpDGtiBSNAVKvuDkUriaPc9S3VgkR4HeoZUrmg6gf6I9aMIQRtoB1m6hSAxp_F76mh8fvQZYo1xevtkVxx00FXtOq9O8_CvjgZ2pIB/s320/PODPIS.png);margin-left:250px;}
Margin-left 250px jest punktem wyjścia; zwiększ lub zmniejsz tę liczbę, aż Twój podpis będzie umieszczony dokładnie tam, gdzie chcesz by się pojawiał. Wszystko będzie widoczne na bieżąco w podglądzie bloga, to na pewno ułatwi Ci pracę.
Gdy wszystko wyświetla się jak należy, naciśnij przycisk "Zastosuj do bloga". Teraz możesz podziwiać swoją pracę - swój podpis pod każdym postem na blogu!
Jeśli masz jakiekolwiek pytania lub potrzebujesz pomocy - pisz śmiało, to dla mnie ogromna przyjemność wiedzieć, że czasem jestem komuś potrzebna :D
To bardzo proste! Każdy, nawet nie mający pojęcia o CSS ani html sobie z tym poradzi. Dla mnie ważne, że wystarczy to zrobić tylko raz, a podpis pojawia się automatycznie pod każdym wpisem. W każdym momencie możesz zmienić podpis i zostanie on automatycznie zaktualizowany pod wszystkimi postami. Grafika z podpisem nie ma ramek! To znaczy, że podpis nie będzie definiowany jak wszystkie zdjęcia na twoim blogu i nie zostaną mu przypisane ramki, jakie blogger dodaje do każdego obrazu na twoim blogu. I co równie fajne - jeśli masz dodany kod PIn IT BUTTON, o którym pisałam TU, nie musisz się martwić, że Twój podpis będzie można sobie przypiąć na Pinterest, gdyż zdjęcia dodane przez kod CSS są ignorowane przez PIN IT BUTTON! Fajnie co?
No to zaczynamy!
Krok 1
Wstaw swoje zdjęcie podpisu
Prześlij swoje zdjęcie podpisu do albumu Picasa Web na swoim blogu. Możesz to zrobić bardzo prosto tworząc Nowy Post na blogu. Ja swój zatytułwałam "Roboczy" i mam go w kopiach roboczych na swojej liście postów.
Nowy post --> Wstaw obraz --> Prześlij --> Wybierz pliki --> (po załadowaniu grafiki) Kopiuj adres URL grafiki.
po skopiowaniu URL, kliknij Anuluj, a następnie wklej adres pliku do okna posta. Nie zamykaj okna posta roboczego, będzie Ci jeszcze potrzebne.
Krok2
Dodaj CSS
Aby dodać kod CSS do swojego bloga, przejdź do szablonu --> Dostosuj --> Zaawansowane --> Dodaj arkusz CSS w Bloggerze.
Wklej poniższy CSS w polu "Dodaj niestandardowy arkusz CSS":
.Entry-content:after{
content:url(URL_OBRAZKA);
margin-left:250px;
}
Teraz, wymień URL_OBRAZKA na link obrazu z który masz w poście roboczym. Upewnij się, że udało Ci się skopiować i wkleić pełny adres URL w miejsce URL_OBRAZKA dokładnie między nawiasy ()
Oto wypełniony przykład:
.Entry-content:after{content:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgA1agPWm-KAQJNyhzvMgSaoLtI24a4DGLXIOl8gRPpDGtiBSNAVKvuDkUriaPc9S3VgkR4HeoZUrmg6gf6I9aMIQRtoB1m6hSAxp_F76mh8fvQZYo1xevtkVxx00FXtOq9O8_CvjgZ2pIB/s320/PODPIS.png);margin-left:250px;}
Margin-left 250px jest punktem wyjścia; zwiększ lub zmniejsz tę liczbę, aż Twój podpis będzie umieszczony dokładnie tam, gdzie chcesz by się pojawiał. Wszystko będzie widoczne na bieżąco w podglądzie bloga, to na pewno ułatwi Ci pracę.
Gdy wszystko wyświetla się jak należy, naciśnij przycisk "Zastosuj do bloga". Teraz możesz podziwiać swoją pracę - swój podpis pod każdym postem na blogu!
Jeśli masz jakiekolwiek pytania lub potrzebujesz pomocy - pisz śmiało, to dla mnie ogromna przyjemność wiedzieć, że czasem jestem komuś potrzebna :D