„Nigdy nie oceniaj wysokości góry, dopóki nie osiągniesz jej szczytu. Wtedy zobaczysz, jak była niewysoka.” Dag Hammarskjöld
Czyli dalej upiększamy i personalizujemy nasze blogi.
Dzisiaj chciałabym zaproponować Wam kolejny etap personalizacji bloga czyli dodanie spersonalizowanych zakładek “O mnie”, “O blogu”, “Kontakt”, “Współpraca” (czy jakkolwiek je nazwiecie). Tworzymy je jako osobne strony statyczne. A że warto to zrobić to temat na osobny wpis. W tym temacie czeka Was mała niespodzianka. Bardzo fachowa osoba (tj Agnieszka alias Lifemanagerka, która zawodowo jak freelancerka zajmuje się wyszukiwaniem blogów pod współpracę dla swoich klientów) obiecała napisać jak przygotować taką idealną zakładkę Współpraca. Nie patrzcie na tę moją (przygotowałam ją “per noga”, ale nie z braku szacunku dla czytelników, tylko dla tego, że przy obecnych statystykach na zainteresowanie zainteresowanych Współpracą ze mną raczej nie liczę. Ale namotałam. A tymczasem tylko chciałam byście dzięki mojemu blogowi uwierzyli, że
- “Im bardziej chcę coś zrobić, tym mniej nazywam to pracą”. Richard Bach (pisarz amerykański)
- „Większość ludzi przegapia okazję, bo jest ona ubrana w kombinezon i wygląda jak praca.” Thomas Edison
- „Ponoś porażki często, abyś mógł odnieść sukces szybciej.” – Tom Kelley, Ideo
- „Geniusz to 1% inspiracji i 99% potu.” – Thomas Edison
- „Jeśli nie zbudujesz swojego marzenia, ktoś inny Cię zatrudni, abyś pomógł mu zbudować jego.” – Tony Gaskins
- „Ludzie, którzy tracą czas czekając, aż zaistnieją najbardziej sprzyjające warunki, nigdy nic nie zdziałają.
- „Najlepszym sposobem na smutek jest nauczenie się czegoś nowego.” Theodore White
Jak stworzyć nową stronę na blogu?
Teraz zastanawiacie się pewnie co zrobić, by te przygotowane strony stały się widoczne. Udajemy się do zakładki Układ, Dodaj gadżet i tam wyszukujemy przygotowany na tę okazję widżet: Strony.
Teraz możemy wybrać sobie, które strony chcemy by były widoczne i w jakiej kolejności.
Tak przygotowane strony możemy ustawić sobie w panelu bocznym na blogu, albo u góry strony w obszarze pod którym pojawiają się kolejne wpisy.
Np tak to wygląda na podglądzie po dodaniu Strony nad treścią postu. Ja juz mam tu etykiety z kilku wybranych kategorii, wiec zrobił sie tu tłok.
A tak korzystając z tego gadżetu w kolumnie bocznej.
Jak spersonalizować zakładki O mnie, Współpraca, Konakt?
Ale gdybyśmy chcieli je spersonalizować, doprawić je we własnym sosie i podpasować pod jedyny i unikalny charakter naszego bloga. Otóż jest to bardzo proste, a przynajmniej metoda, którą Wam pokażę. Choć na pewno istnieją metody dużo bardziej skomplikowane.
U mnie efekt koncowy wygląda tak: Niby mała rzecz, a cieszy.
Jak to przygotować? Bardzo prosto korzystając ze świetnego programu ogólnie dostępnego on line (i bardzo intuicyjnego), jakim jest PicMonkey.
Ale przedtem jeszcze sprawdzcie wymiary Waszej kolumny bocznej. W tym celu udajemy się do zakładki Szablon, Dostosuj, Dostosuj ustawienia szerokości i notujemy gdzieś w pamięci jaką szerokość ma nasz panel boczny na blogu.
Jeżeli chcemy, by nasze zakładki współgrały z kolorystyką naszego szablonu możemy sprawdzić i skopiować sobie oznaczenia naszego koloru w języku HTML. W tym celu: ciągle jesteśmy w Szablonie, Dostosuj i przechodzimy do zakładki Zaawansowane. Ja np sprawdziłam i skopiowałam sobie (CTRL C) kolor etykiet i czcionę w gadżetach w panelu bocznym.
Tu sprawdziłam, jaką czcionkę używam w panelu bocznym.
A teraz wchodzimy do Picmonkey. Wybieramy opcję Design. Przygotowujemy sobie przezroczstą kanwę tło.
Możemy przygotować sobie wymiary naszego tła (jest tu opcja Resize), ale nie musimy się na samym początku tym przejmować, możemy to zrobić potem (przymierzając “w praniu” do bloga, albo zmniejszyć już na Bloggerze, ale o tym za chwilkę).
Teraz wybieramy sobie ikonkę Motylka czyli różne Overlays, ja akurat skorzystałam z opcji Banner, ale gorąco polecam Wam podłubanie i poszukanie “tego Waszego szczęścia”. A mozna zrobić tu wiele. Ja puściłam luzno wodze fantazji i zaserwowałam Wam mała próbke u góry we wpisie.
Po to, by kolor moich zakładek pasował do koloru szablonu skopiowałam tu ręcznie kolor pobrany wcześniej z Szablonu na Bloggerze (żeby idealnie trafić w odcien). Zapisałam sobie w pamięci komputera. I teraz kolejno stworzyłam 4 różne zakładki (o takich samych wymiarach), czyli “O mnie”, “O blogu”, “Współpraca”, “Kontakt”. Tekst dorzucamy klikając na ikonkę T.
Gdy Wasze zakładki są już gotowe, otwieracie kolejny post w Bloggerze i pobieracie je do niego (jako zdjęcia). Tu jeżeli wymiary Wam nie odpowiadają zawsze możecie probowaóć wybierając inny rozmiar fotki np mały, duży, a na wejściu oryginalny. A jeżeli tak nie traficie w wielkość, wróccie do PicMonkey i skorzystajcie z opcji Resize, by przewymiarować Wasze obrazki.
Teraz, gdy wszystkie obrazki są już w odpowiedniej kolejności w obszarze pisania tekstu, dodajecie do każdej z nich osobno link prowadzący do danej strony. W tym celu gdy dana ikonka jest podświetlona klikacie u góry na ikonkę link.
Gdy ten etap jest zakonczony, przechodzimy do wersji naszego wpisu w języku HTML (zaznaczyłam Wam na czerwono odpowiednią ikonkę) i pobieramy kod HTML tego, co zrobilismy.
Z zapisanym w pamięci kodem ponownie udajemy się do zakładki Układ, Dodaj gadżet i wybieramy Gadżet HTML/Java Script. Tu wklejamy nasz kod. I gotowe. Sprawdzamy na podglądzie, przesuwamy w odpowiednie miejsce. Dopracowujemy rozmiary ikonek (tu np wracamy do treści wpisu i zmniejszamy lub zwiększamy naszego uznania obrazki). I probujemy. Odwagi: świat należy do odważnych.
A jeżeli szukacie innej metody, możecie skorzystać z dostępnego on line narzędzia do mapowania Image-maps. Jak ono działa przeczytacie we wpisie: Jak samodzielnie przygotować ikonki mediow spolecznościowych.
A to moja pierwotna próba zakładek, ale stwierdziłam, że mniej znaczy lepiej i wybrałam coś bardziej stonowanego.
Pozdrawiam serdecznie
Beata
na taki post czekałam 🙂 dziękuję i zabieram się do pracy 😉
Bardzo pomocne szczególnie dla takiego laika jak ja ,dziękuje i pozdrawiam
super post! bardzo dziękuję i wieczorem zasiadam do pracy:)
Czas zakasać rękawy 😉
Kolejny świetny post! A cytaty bardzo trafne!
Dla mnie bardzo przydatny post, ponieważ nie mam zamiłowania do informatyki, a głównie lubię pisać i siłą rzeczy na tym się koncentruję, na modernizację bloga ciągle nie znajduję czasu (tym bardziej, że wszystkiego uczę się na żywym organizmie…). Dzięki Tobie jakąś część pracy będę miała za sobą, kiedy nadejdzie odpowiednia chwila 🙂
Uwaga będzie pytanie, co mam zrobić ze stronami które miałam wcześniej o mnie itp., jakoś je ukryć czy usunąć, bo niestety nie wiem.
Z samymi stronami (moim zdaniem), tymi ktore masz opublikowane nie rob nic. Tylko usun bloggerowski gadzet i zostaw na jego miejsce Twoje spersonalizowane grafiki. Ja tak zrobilam. I u mnie dziala. Pozdrawiam Beata
Bardzo przydatne, szczególnie jak ktoś – czyt. ja, jest mało kompatybilny i niezreformowalny, hihi
Ja mam pytane – probowałam na trzy sposoby ale bez rezultatu dodać wtyczkę fb do bloga – jak to zrobić w prosty sposób ???
Pozdrawiam, Marlena
Marleno nie przejmuj sie, na pewno dasz rade, ja napisalam o tym wpis Tutaj Zajrzyj, a jak bedziesz miala pytania – pisz. Pozdrawiam Beata
kochana a jak zrobic aby te strony w gadzecie u góry były wypośrodkowane??? zerknij u mnie- narazie puste są… jak zrobić ,aby były na środku??? i da się jakoś zrobić w tej czcionce polkie “ł” ?? hm…. podoba mi się…ale ta czcionka nie posiada polskich znaków i tu jest ból :/
i jeszcze jedno pytanie- w stronce “pracownia projektowa” chciałabym aby było bezpośrednie przekierowanie na inna strone www, czy jest to możliwe???
Jak wysrodkowac pasek stron znajdziesz we wpisie na blogu Hafija
Tutaj
Pozdrawiam serdecznie Beata
ja lubię minimalizm. im mniej upiększeń, tym lepiej 🙂
masz ten dar,że w prosty i przyjemny sposób objaśniasz zawiłe tematy:) chciałabym sobie stworzyć takie blogowe zakładki,ale nie wiem czy mój szablon z wordpressa mi na to pozwoli.
dziękuję Ci, bardzo mi pomógł ten wpis, dzięki niemu mam wreszcie stronę o mnie na swoim blogu
Świetna porada, właśnie próbowałam się do niej zastosować 🙂 . Mam takie pytanie. Jest sposób by te strony były na górze pod tytułem i nie jedna pod drugą tylko w poziomie? 🙂
Super! TEraz czas wprowadzic zmiany na moim blogu. 🙂
Dziękuję bardzo za takie tutoriale, Juz zrobiłam 2 stronki na moim blogu http://vernora1.blogspot.com/ z Pani pomocą. Pozdrawiam, Milena
Spróbuję zrobić takie zmiany na swoim blogu. Pozdrawiam
Świetny post, bardzo dziękuję bo właśnie o takie coś mi chodziło !
Czy ten program PicMonkey jest gdzieś do ściągnięcia za darmo? Nie mogę nigdzie znaleźć…
Dorota, PicMonkey znajdziesz tu: http://www.picmonkey.com/, nie trzeba nic ściągać, instalować, ani nawet się rejestrować. Z bezpłatnych programów polecam Paint.net.
Bardzo przydatne informacje i jasno opisane – super! Skorzystałam i mam nadzieję, że mój blog stał się teraz bardziej efektowny 😀
Witam a mam pytanie co ja mam zrobić by w moim menu u góry posty się szeregowały? np w domu pojawiały się posty o domu, ogrodzie??
Pozdrawiam ….Anka
Idealnie!!! Dziękuję 🙂
Dzięki za wskazówki, zabieram się 🙂
Dzięki! Zrobione!
kolejny raz mi pomagasz !!! dziękuję!!♥
– http://arakumla.blogspot.com/
Przyda mi się, jutro w wolnej chwili biorę się za prace 🙂 dziękuje za tak przydatny wpis + cytaty <3
hej!
Zrobiłam wszystko wg instrukcji i faktycznie mam cale menu, jednak pod przyciskami jest szare tło, jak mogę się tego pozbyć?
fajne i przydatne 🙂
Kolejny raz skorzystałam z Twojej “pomocy” 🙂 Dziękuję 🙂
Menu zrobione, wielkie dzięki! Tyle czasu się z tym męczyłam i w końcu jest!
Ale….
Jak zmienić jego położenie? Jest ciut za blisko nagłówka (w postaci obrazka), a nie mogę ruszyć ani tego ani tego :/
Próbowałam kodem:
#HTLM {border-left: ?px}
i zamiast ‘border’ pisałam ‘margin’
Proszę o szybką pomoc! (Ja wiem, że to stary post, ale przecież stronka jest używana)
Bardzo pomocny post, szczególnie dla tych początkujących. Dzisiaj z niego skorzystałam 🙂
jeju Twój blog jest swietny! Bardzo nam pomaga! Co prawda jeszcze duzo nauki przed nami, ale jestes niesamowitym źródłem wiedzy 🙂
Czy ta sama zasada dotyczy utworzenia własnych chmurek z kategoriami, a w przypadku bloggera etykietami?
a co jeśli nie mogę dodać linku do obrazka? poprostu kiedy naciskam opcje link odznacza mi się obrazek. co zrobić?
mam tak samo 🙁
świetny poradnik, dziękuję bardzo 🙂
przydało się, dziękuje <3
Bardzo praktyczny post. Mam bloga postawionego blogspocie od dłuższego czasu, jednak nie wiedziałem, że ma tyle fajnych opcji. Pozdrawiam 🙂
Bardzo fajny i przydatny wpis. Ja chciałam utworzyc osobne strony np “moda””uroda””podróze” i jak zrobić to że po kliknieciu w strone podroze wyświetliły się wszystkie wpisy z tej dziedziny?