Wiele z nas, blogerek, chce mieć ładny i przejrzysty wygląd bloga, a przy tym dużo obserwatorów, jak i statystyk. Ale jak to osiągnąć? Na pewno nie komentarzami typu: "Obs za obs?". Gdy wchodzę na czyjegoś bloga to pierwsze, co mi wpada w oczy to wygląd. Czego? Wszystkiego, ale szczególnie czytelność postów. Dzisiaj za pomocą kilka rad i kodów CSS, wprowadzę was w świat pięknej blogsfery. Chciałabym was uprzedzić, że jest to nowa seria na moim blogu, rozpoczynająca się na postach. Mam nadzieję, że moje wskazówki, jak i pomoce blogowe, przydadzą wam się w prowadzeniu bloga.


TYTUŁ POSTA
Tytuł posta wprowadza nas do notki, stworzonej przez autora.

Jak wyśrodkować tytuł posta?
SZABLON>DOSTOSUJ>ZAAWANSOWANE>DODAJ ARKUSZ CSS
h3.post-title {text-align: center;}


Data w kółku przy tytule posta
Po wykonaniu następujących czynności z posta na blogu: http://hafija-background.blogspot.com/2013/04/jak-ustawic-date-posta-w-okienku-styl.html#.VDFvRUGSmBV
przejdź do tego posta i wykonaj następujące czynności.


SZABLON>DOSTOSUJ>ZAAWANSOWANE>DODAJ ARKUSZ CSS


Kod css, który należy wpisać:.date-header span {width: 47px; height: 47px; border-radius: 100%;}
Pogrubiony tekst pisany kursywą to liczba pixeli, którą możemy zmienić. 
Tekst pisany samą kursywą to zaokrąglone rogi kółka.
(Tylko liczba 100% daje nam w pełni zaokrąglone rogi!)


Aby zmienić kolor daty należy wpisać kod: .date-header span {background-color: #ffd9d9;}

Możemy wpisać inny kod koloru, który wybrać najlepiej z palety RGB dostępnej na tej stronie --> klik
(Jeśli chcecie, aby kolor był przeźroczysty, zamiast #dowolnykolor wpisujecie #transparent)


Położenie tekstu w dacie: .date-header span {text-align: center;}
Aby zmienić położenie tekstu w dacie, w miejsce jaśniejszej czcionki możemy wpisać:
- center - wyśrodkowanie
- right - do prawej
- left - do lewej


Dokładniejsze ustawienie położenia daty: .date-header span {margin: -11px -100px -85px -55px;}
Aby dokładnie ustawić położenie daty co do pixela, pogrubione wartości pisane kursywą możecie zmienić.


Jak usunąć cień lub ramkę przy zdjęciu?
Gdy tak patrzę na zdjęcia innych blogerek, to zawsze przeszkadza mi ta, jakże wszechobecna ramka, i oczywiście cień. Dla niektórych może wydawać to się normalne, ale w moim przypadku mi to przeszkadza.
SZABLON>DOSTOSUJ>ZAAWANSOWANE>DODAJ ARKUSZ CSS i wklejamy ten kod:

post-body img {border: 0 !important;-moz-box-shadow: none !important;-webkit-box-shadow: none !important;box-shadow: none !important;padding: 0px !important;background: none !important;}


Jak zmienić wymiary zdjęcia?
Wchodzimy na stronę: http://picmonkey.com I klikamy na znaczek kadru, a następnie na resize.


W tym kroku możecie zmienić wymiary na jaki chcecie, ale aby pasował do szerokości bloga.



I na końcu zapisujemy, czyli klikamy Save.


Podoba wam się początek serii upiększania bloga? Pomogło to wam w zmianie wyglądu postów?

30 comments:

  1. To wszystko wiedziałam, ale myślę, że dla innych blogerów będzie to na prawdę pomocny post :) Btw świetny wygląd bloga, a też pierwsze co zwracam na to uwagę :)

    http://polinska.blogspot.com

    ReplyDelete
  2. Ja nie bawię się w obs/obs.:) Przydatny post!
    secretsoflifeblog.blogspot.com

    ReplyDelete
  3. Bardzo przydatny post, myślę że nie jedna osoba z niego skorzysta :)

    http://aguu-style.blogspot.com

    ReplyDelete
  4. Post bardzo przydatny i myślę, że skorzystam :)
    http://szarosc-wszedzie.blogspot.com

    ReplyDelete
  5. Bardzo podoba mi się taka seria na blogu :) Ja już znam te kody, ale innym na pewno pomogą! :)

    http://julia-and-fashion.blogspot.com

    ReplyDelete
  6. Bardzo przydatny post! Więcej takich :)

    http://los-i-metek.blogspot.com/

    ReplyDelete
  7. bardzo pomocny post ;D szukałam jak zrobić datę w kółeczku , dziękuję bardzo ! ;*
    http://creamshine.blogspot.com/

    ReplyDelete
  8. good post !
    http://ceodotid.blogspot.com/

    ReplyDelete
  9. Świetne porady :) Ja w sumie sama się do większości już od dawna stosuję, ale zapewne wielu się jeszcze przydadzą!

    lusiaa-lusiaa.blogspot.com

    ReplyDelete
  10. Fajny pomysł na takiego posta, porady są świetne :)

    Julajulia.blogspot.com

    ReplyDelete
  11. Bardzo dobry post i bardzo pomocny, idealnie nada się dla osób takich ja, które dopiero zaczynają,
    świetny pomysł
    xx

    http://ekranowalalkafashion.blogspot.com/

    ReplyDelete
  12. Rewelacyjny i bardzo przydatny post! :)
    Powinnas więcej takich dodawac :)
    Zechcialabys wpasc do mnie na bloga i ocenic moje zdjecia? Niedawno zaglebilam sie w swiat fotografii i chce wiedziec czy mi to wychodzi. Co prawda sa to jeszcze amatorskie zdjęcia, ale od czegoś trzeba zacząć :D
    Jesli blog ci sie spodoba to milo bedzie jak zostaniesz moja czytelniczka :)
    Obserwuje!
    Zapraszam do siebie i pozdrawiam cieplutko! :)

    http://obiektyw-mym-okiem.blogspot.com/

    ReplyDelete
  13. Pomysl Ciekawy Ale Odgapilas te "Ptaszki od Kiki"
    Mój Blog - klik!

    ReplyDelete
    Replies
    1. Dziękuję! A jeśli chodzi o te ptaszki, to inne blogerki też używają je, i te ptaszki nie wykorzystuje jako swoje, bo wtedy było by to niesprawiedliwe z mojej strony. Jednakże ptaszki nie są nigdzie indziej używane.

      Delete
  14. Przydatne...świetny i ciekawy post:)
    Link http://bengbengforyou.blogspot.com/

    ReplyDelete
  15. tez mam taka serie u siebie :)

    Pozdrawiam ♔Nakioo Blog - kllik!

    ReplyDelete
  16. Bardzo ciekawy post, na pewno skorzystam z Twoich rad, dziękuję ;)
    xx


    http://ladyfashworld.blogspot.com/

    ReplyDelete
  17. bardzo przydatny post!
    czas nareszcie to ogarnąć ;))

    justsayhei.blogspot.com

    ReplyDelete
  18. Jejku! Twój blog jest przepiękny, a posty świetnie pisane :)
    Będę wpadać częściej i zapraszam do siebie.

    http://przescignacmarzenia.blogspot.com/

    ReplyDelete
  19. Przydatny post ! Napewno go wykorzystam :)
    http://iggynaturalblog.blogspot.com/

    ReplyDelete
  20. Świetny post, niestety ja wszystkie to funkcje już znam, ale na pewno wielu osobom się to przyda!


    ♡Pozdrawiam~oli-olli.blogspot.com♡

    ReplyDelete
  21. Super rada i pomoc. Przyda się ;)

    ReplyDelete
  22. Te kody już znam, stosuję... Myślę, że komuś kto jest całkiem "świeży" przydadzą się na pewno... :)
    awesome-triangle.blogspot.com

    ReplyDelete
  23. Ciekawy post, ale te wszystkie kody to cos nie dla mnie :)

    Mój blog- klik! :)

    ReplyDelete
  24. Moim zdaniem tekst powinien być wyjustowany, ewentualnie wyrównany do lewej... wyśrodkowany wygląda jak wierszyk :(

    ReplyDelete
    Replies
    1. Kwestia gustu :) Ja jednak lubię wyśrodkowany tekst.

      Delete
  25. Fajny, przydatny post:)
    Zapraszam: www.liviandinga.blogspot.com

    ReplyDelete
  26. wow ja to się nigdy chyba nie nauczę takich trików. Nawet podstawowe funkcje ciągle mi sprawiaja kłopot.

    http://bajkimajki.blogspot.com/

    ReplyDelete