Blogger - zwijanie tekstu i graficzne "czytaj dalej"

Zwijanie tekstu w poście to funkcja, która pozwala zaoszczędzić miejsce na stronie głównej bloga. Po jej zastosowaniu na stronie głównej pojawia się jedynie wybrany przez nas fragment tekstu, zaś reszta tegoż tekstu dostępna będzie dopiero po kliknięciu przycisku "czytaj więcej", "czytaj dalej", "kontynuuj czytanie" lub "read more". Innymi słowy, zawijanie tekstu polega na tym, iż na stronie głównej bloga nie pojawia się całość wpisu, wyłącznie jego kawałek do wybranego przez nas miejsca.

Zwijanie tekstu w poście

W jaki sposób zawinąć tekst w poście? Nic prostszego, wystarczy wejść w opcję tworzenia posta i...

...kliknąć na ikonkę Wstaw zwijanie tekstu:

Wstaw zwijanie tekstu

Powinien wówczas ukazać się nam taki śmieszny pasek z przerywanymi liniami, jak ten oznaczony strzałką na powyższym screenie. Pojawienie się tego paska po kliknięciu ikonki zwijania tekstu oznacza, że tekst został zawinięty i w związku z tym faktem nasza misja zakończyła się powodzeniem.

Niestety, umówmy się, iż domyślny przycisk bloggera "czytaj więcej" nie powala na kolana atrakcyjnością i estetyką oprawy wizualnej. Czy możemy coś z tym zrobić? Na szczęście możemy. :)

Możemy stworzyć i wstawić w kod HTML bloga własny...

Graficzny (obrazkowy) przycisk 

CZYTAJ DALEJ


Przykłady istnienia takiego właśnie graficznego przycisku można znaleźć u mnie na blogach:

Graficzne Czytaj dalej

Graficzne Czytaj dalej
Graficzne Czytaj dalej
Graficzne Czytaj dalej

Graficzne Czytaj dalej

W jaki sposób możemy stworzyć sami taki graficzny (obrazkowy) przycisk? Tutaj z pomocą przychodzą nam dwie sympatyczne strony do tworzenia grafiki online: MyLiveSignature oraz Picmonkey, jednak nie tylko. Przeczytaj post: Gdzie najlepiej tworzyć grafikę?

Kiedy przygotowaliśmy już graficzne "Czytaj dalej", możemy przenieść ową grafikę w przestrzeń internetową, np. przy pomocy strony imgur.com, o której wspominałam już dość obszernie przy okazji posta na temat edycji obrazków online.

Jak zatem stworzyć graficzne "Czytaj dalej" na jednej z wyżej wymienionych stron, MyLiveSignature?

Po wejściu w ową stronę klikamy na przycisk Start now! umieszczony w prawym górnym rogu:

Tworzenie graficznego Czytaj dalej

Następnie, tuż po wejściu w Start now!, zaznaczamy opcję Using the signature creation wizard:

Tworzenie graficznego Czytaj dalej

W następnej kolejności wpisujemy w rubrykę Name pożądany przez nas tekst graficznego przycisku, np. Czytaj dalej, Czytaj więcej, Kontynuuj czytanie, Przeczytaj cały post. Po wpisaniu odpowiedniej frazy wciskamy Next Step:


Tworzenie graficznego Czytaj dalej

Po wykonaniu tych czynności wybieramy czcionkę (do wyboru mamy ich aż 120), rozmiar przycisku, kolor zarówno tekstu, jak i obramowania, a także kąt pochylenia (Slope). Kiedy już przycisk jest gotowy, wówczas możemy pobrać go na dysk lub skopiować adres i wstawić w kod HTML bloga.

Jeżeli bardzo zależy nam na tym, aby nasz nowy przycisk był przezroczysty, czyli transparent, wtedy możemy skorzystać z programu Picmonkey. Jest to chyba najpopularniejszy i najprostszy program do tworzenia grafiki w internecie. Ma jedynie tę wadę, że do jego obsługi niezbędna jest wtyczka Flash Player, bez niej nie da rady. Jak zatem stworzyć graficzne "Czytaj dalej" w tymże programie?

Na początku wchodzimy w Design, a po wejściu w Design zaznaczamy tło Transparent canvas, ustawiamy rozmiar (Resize) i, korzystając z paska bocznego, tworzymy nasz wymarzony przycisk. Możemy użyć samego tekstu bądź też tekstu i obrazka lub tekstu i ramki - do wybory, do koloru. Dobieramy, łączymy, tworzymy, kreujemy, ile tylko dusza zapragnie.

Tworzenie graficznego Czytaj dalej

Po stworzeniu i pobraniu grafiki na dysk, możemy pobrać ją z dysku np. na ww. stronę imgur.com po to, by wygenerować adres tejże grafiki niezbędny do wstawienia jej w kod HTML naszego bloga.

O tym, w jaki sposób wstawić przycisk "Czytaj dalej" w obszar kodu HTML, możecie przeczytać w vademecum blogera. Tam również przy okazji znajduje się bardziej rozbudowana instrukcja korzystania z programu Picmonkey, dla opornych.

Istnieje także możliwość wstawienia przycisku zmieniającego się po najechaniu myszką. Jak go wstawić? Instrukcję znajdziecie na tym blogu.

Po wstawieniu w kod HTML obrazka "Czytaj dalej", nasz blog niespodziewanie zyska nowy, niestandardowy, barwniejszy i o wiele atrakcyjniejszy wygląd. Warto więc poświęcić parę chwil na idealne dopracowanie szczegółów i stworzenie grafiki doskonale komponującej się z naszym blogiem.
2013 © Introwertyczka w sieci. Obsługiwane przez usługę Blogger.