2015/02/15

Poradnik blogowy #1

'Hej! ♥' Pewnie zauważyliście, że na moim blogu wygląd wykonałam sama. Dostaje od was maile, o tym jak zrobić samemu nagłówek, ikonki itd. Tak więc postanowiłam, że stworze poradnik. Na początku mam dla was myślę, że przydatne kody css. Niby małe zmiany a mogą nam udoskonlić  naszego bloga.  Przygotowałam również moje zdjęcia ulubione z tego tygodnia. Jeżeli macie jakieś pytania napiszcie w komentarzu lub na maila.
Dla początkujących kody wpisujemy w arkuszu.
szablon ~> dostosuj ~> zaawansowane ~> dodaj arkusz css
Podświetlenie zdjęcia na biało
Na pewno zauważyliście, że jeżeli najedziecie na moim blogu na zdjęcie to podświetli się na biało.
Jeżeli chcecie mieć również na blogu taki efekt wystarczy wpisać kod :
.post img { opacity: 1;
transition:opacity 0.4s ease-in-out; 
-o-transition:opacity 0.4s ease-in-out;
-moz-transition:opacity 0.4s ease-in-out; 
-webkit-transition:opacity 0.4s ease-in-out; 
}
.post img:hover {
opacity: 0.70; 
transition:opacity 0.4s ease-in-out; 
-o-transition:opacity 0.4s ease-in-out; 
-moz-transition:opacity 0.4s ease-in-out; 
-webkit-transition:opacity 0.4s ease-in-out; 
}
Obramowanie komentarzy
Mi się bardzo podoba ten efekt, tak jak wcześniej wystarczy wpisać kod :
.comment .comment-block {
margin-left: 70px;
position: relative;
border: 1px solid #000000;

overflow: hidden;
padding: 15px 20px 5px;
Możecie również zmienić kolor i rodzaj obramowania.
Wystarczy wpisać w miejsce :
#000000 - Kolor z palety : klik
Solid- rodzaj kreski : kreskowana- dashed , ciągła- solid,  kropkowana- dotted
Podkreślenie tytułu posta
h3.post-title {border-bottom: 1px #000000 solid ;}
Żeby zmienić czcionkę, kolor, rodzaj wystarczy wpisać w miejsce :
1px - Tym większa wartość tym grubsza kreska.
#000000 - kolor kreski. Możecie zmienić , wpisując kod z palety : klik
solid - rodzaj kreski : solid- linia ciągła, dotted- kropkowana, dashed- kreskowana
Chcielibyście kolejny taki post ? :)





41 komentarzy:

  1. super post i desing masz śliczny ^^ ja praktycznie w ogóle się na tym nie znam ;P
    zapraszam ♥
    http://madeline-girl.blogspot.com/

    OdpowiedzUsuń
  2. Przydatne kody, znam się na designie ;)
    http://asia-asiaablog.blogspot.com/2015/02/be-happy.html <-- mogę liczyć na komentarz?

    OdpowiedzUsuń
  3. Very nice pics!!!
    I'm following you via GFC. I hope you follow me back :-)
    Kisses!!

    OdpowiedzUsuń
  4. Dla mnie idealne porady, średnio ogarniam tego typu rzeczy, więc twój post bardzo mi się przydał :)
    Prosimy o więcej takich postów :D

    OdpowiedzUsuń
  5. Zrób więcej takich postów :)

    http://weraweronika.blogspot.com/

    OdpowiedzUsuń
  6. Takie posty są bardzo fajne! :)

    rilseee.blogspot.com

    OdpowiedzUsuń
  7. Świetnie że pomagasz mało obeznanym w tym osobom :)

    Zapraszam do mnie. :) Liczy się każdy komentarz!
    malinowe-ciasto.blogspot.com

    OdpowiedzUsuń
  8. Dzięki ;* Napewno skorzystam :) Bardzo pomocne ;)

    http://lifestylegirl88.blogspot.com

    OdpowiedzUsuń
  9. Świetny blog!
    Uwielbiam twoje zdjęcia :)
    Czekam na kolejne posty! ;)
    Pozdrawiam cieplutkooo :D

    Również zapraszam do mnie! klik♥ liczę na komentarzyk ;*

    OdpowiedzUsuń
  10. bardzo lubię takie posty, bo dzięki nim zrobiłąm swój własny design :)
    http://agataweranika.blogspot.com/

    OdpowiedzUsuń
  11. Bardzo przydatny post, szczególnie dla początkujących:) Śliczne zdjęcia:)
    http://xsomething-positivex.blogspot.com/

    OdpowiedzUsuń
  12. Świetny poradnik i zdjęcia! Na pewno pomogłaś wielu osobom ;)
    kikaa-blog.blogspot.com [KLIK]

    OdpowiedzUsuń
  13. Świetny post :) Uwielbiam twojego bloga ;)
    Pozdrawiam

    OdpowiedzUsuń
  14. Takie posty są bardzo przydatne dla początkujących blogerów. Chciałabym zobaczyć ich więcej na Twoim blogu :)

    duo-jessie.blogspot.com <-- KLIK

    OdpowiedzUsuń
  15. takie posty są bardzo przydatne, a kolejny taki post z chęcią przeczytam ;)
    MÓJ BLOG, gorąco zapraszam ! ♥

    OdpowiedzUsuń
  16. Pewnie,że chcemy! genialny post :-) buziaki
    poklikasz u mnie w linki?

    http://nataliazarzycka.blogspot.com/2015/02/romwe-wishlist.html

    OdpowiedzUsuń
  17. Bardzo przydatny post;)
    pozdrawiam cieplutko :))
    woman-with-class.blogspot.com

    OdpowiedzUsuń
  18. Ratujesz mi życie, dziękuję! <3
    Skorzystam z twoich rad, ale muszę je rozkminić i pomyśleć hehe
    Trzymaj się :*

    thekallasowa.blogspot.com

    OdpowiedzUsuń
  19. Skorzystałam z tego kody na obramowanie w komentarzach ;) przydatny post

    OdpowiedzUsuń
  20. Znam efekt 1 i 3, ale pozwoliłam sobie skorzystać z efektu 2! :D

    ♥ kochacznaczyblogowac.blogspot.com (KLIK) ♥

    OdpowiedzUsuń
  21. Ta notka z pewnością pomoże wielu osobom, chociaż ja chętnie poznałabym kody css, które trudno znaleźć na innych blogach, może jesteś w stanie takie znaleźć? :)


    Jeśli znajdziesz chwilkę, to zapraszam na nowy post:___BLOG___

    OdpowiedzUsuń
  22. bardzo przydatne te porady! :) pisz dalej takie posty :)

    OdpowiedzUsuń
  23. Bardzo przydatny post, tymbardziej że nie jestem tak obcykana w kodach css itd, więc skorzystam z twojej pomocy :)

    Zapraszam do mnie! Dopiero zaczynam i byłoby mi bardzo miło gdybyś wpadła i zostawiła po sobie ślad.
    Mój blog ♥

    OdpowiedzUsuń
  24. Świetny post i super blog!
    Co powiesz na obs za obs?
    Zapraszam do mnie:

    http://ellane-style.blogspot.com/

    OdpowiedzUsuń
  25. Bardzo fajny pomysł na post, na pewno wielu osobom taki post/posty pomogą. Ładne zdjęcia i wygląd bloga. Pozdrawiam.

    muminek-enter.blogspot.com

    OdpowiedzUsuń
  26. Świetny post. Takie rady są bardzo przydatne ;)

    kajoooja.blogspot.com

    OdpowiedzUsuń
  27. Żałuję, że dopiero teraz to przeczytałam!
    Ale może kiedyś sama zrobię design :)
    Ciekawy blog.
    Zapraszam,
    http://imercyyou.blogspot.com/?m=1

    OdpowiedzUsuń
  28. Dla mnie takie rzeczy nie są obce, ale pewnie wielu osobom się przydadzą :)

    mój blog

    OdpowiedzUsuń
  29. Świetny blog ;) Obserwuję ..
    Zapraszam ..http://agatamalinowa.blogspot.com/

    OdpowiedzUsuń
  30. Twój blog jest zaskakująco fajny, przyjemnie się go przegląd ;) Będę zaglądała, życzę dalszych sukcesów i wytrwałości :)

    http://mjrm-madeline.blogspot.com/2015/02/next-lazy-day.html zapraszam serdecznie na mój blog, każdy komentarz i obserwowanie jest odwzajemniane. Proszę o klikanie w banery po prawej stronie bloga, to dla mnie bardzo ważne.

    OdpowiedzUsuń
  31. Fajny poradnik, możesz zrobić ich więcej, bo wydaje mi się, że ludzie lubią takie rzeczy ;p

    Zapraszam
    polgia.blogspot.be

    OdpowiedzUsuń
  32. Przydatny post :)
    www.blog017.blogspot.com ♥

    OdpowiedzUsuń
  33. świetny post i cudowne zdjęcia ;)
    zapraszam do mnie, jeśli spodoba Ci się mój blog zaobserwuj, na pewno się odwdzięczę :))
    http://xblueberrysfashionx.blogspot.com/

    OdpowiedzUsuń
  34. Jasne, dodaj kolejny taki post :)

    indyjskipalisander.blogspot.com

    OdpowiedzUsuń
  35. Ten komentarz został usunięty przez autora.

    OdpowiedzUsuń
  36. Natasza ten post był świetny dzięki tobie też mam ten efekt przy podświetlaniu zdjęć na moim blogu . Takich postów jak najwięcej ! Tu link do mojego bloga , dopiero zaczynam więc nie jest zbyt idealny ( taki jak twój ) i nie ma na nim zbyt dużo postów ale proszę chociaż na niego wejdź i zobacz jak nie będzie ci się podoba to nie. Okey ?Już nie mogę się doczekać następnego posta ! https://www.blogger.com/blogger.g?blogID=948611228166380739#overview/src=dashboard

    OdpowiedzUsuń

Dziękuje za szczere obserwacje i komentarze.
Odpowiadam na dłuższe komentarze.
Jeżeli twój blog mi się spodoba to zaobserwuje.