Witajcie!
Dziś chciałabym Wam przedstawić tutorial Jak wyśrodkować tytuł posta/nagłówek daty/zawartość gadżetów/nagłówek bloga.
W związku z tym, że jest to mój pierwszy post tutorialowy, mam nadzieję, że będzie zrozumiały i pomocny. :)
Zapraszam do czytania!
Zaczynajmy!!
Krok 1.
Wchodzimy w menu Szablon.
Krok 2.
Klikamy na klawisz Dostosuj.
Krok 3.
Pojawia nam się menu Projektant szablonów Bloggera.
Wybieramy Zaawansowane.
Krok 4.
Zjeżdżamy na sam dół listy i klikamy Dodaj arkusz CSS.
Krok 5.
W pole wklejamy nasz kod (kody podam za chwilę) i wciskamy klawisz Enter.
Uwaga! Jeśli w tym polu macie już jakiś/jakieś kod/kody CSS, już Wam pokazuję, co należy zrobić.
Przy ostatnim znaku ostatniego naszego kodu CSS stawiamy kursor i wciskamy klawisz Enter.
Następnie wklejamy nasz kod i ponownie wciskamy Enter.
Kody:
1.Wyśrodkowanie tytułu posta
2. Wyśrodkowanie nagłówka daty
3. Wyśrodkowanie zawartości gadżetów
4. Wyśrodkowanie nagłówka
c) wyrównanie tekstu z obrazkiem:
Gotowe !
Jeszcze jedna wskazówka
Jeżeli chcecie nie wyśrodkować, a wyrównać do prawej/lewej któreś z powyższych elementów bloga,
usuwamy wyraz center w kodzie CSS i zastępujemy go right (jeśli chcemy wyśrodkować do prawej) lub left (jeśli chcemy wyśrodkować do lewej).
Uwaga! Nie umieszczamy żadnych spacji, znaków, usuwamy wyraz i wpisujemy inny.
Powyżej przykłady dwóch kodów (wyśrodkowanie nagłówka daty oraz tytułu posta)
Jak myślicie, czy podobał Wam się mój dzisiejszy post? Czy był zrozumiały? :D
Czas mnie goni, już muszę lecieć! :)
Do zobaczenia w następnym poście!
Krok 2.
Klikamy na klawisz Dostosuj.
Krok 3.
Pojawia nam się menu Projektant szablonów Bloggera.
Wybieramy Zaawansowane.
Krok 4.
Zjeżdżamy na sam dół listy i klikamy Dodaj arkusz CSS.
Krok 5.
W pole wklejamy nasz kod (kody podam za chwilę) i wciskamy klawisz Enter.
Uwaga! Jeśli w tym polu macie już jakiś/jakieś kod/kody CSS, już Wam pokazuję, co należy zrobić.
Przy ostatnim znaku ostatniego naszego kodu CSS stawiamy kursor i wciskamy klawisz Enter.
Następnie wklejamy nasz kod i ponownie wciskamy Enter.
Kody:
1.Wyśrodkowanie tytułu posta
.post-title {text-align:center;}
2. Wyśrodkowanie nagłówka daty
.date-header {text-align:center;}
3. Wyśrodkowanie zawartości gadżetów
.widget {text-align: center;}
4. Wyśrodkowanie nagłówka
a) jeśli obraz nagłówka jest wgrany jako Zamiast tytułu i opisu:
#header-inner img {margin: 0 auto !important;}
#header-inner {text-align:center !important;}
b) jeśli obraz nagłówka jest wgrany jako Za tytułem i opisem:
#header-inner {background-position: center !important; width: 100% !important;}
c) wyrównanie tekstu z obrazkiem:
#header-inner {text-align: center ;}
d) po prawej obrazek, po lewej tekst (tu trzeba pamiętać, by obrazek wstawiany w nagłówku miał mniejszą szerokość, niż blog):
#header-inner {background-position:
right !important; width: 100% !important;} .titlewrapper,
.descriptionwrapper {padding-right: 100px !important;}
Gotowe !
Jeszcze jedna wskazówka
Jeżeli chcecie nie wyśrodkować, a wyrównać do prawej/lewej któreś z powyższych elementów bloga,
usuwamy wyraz center w kodzie CSS i zastępujemy go right (jeśli chcemy wyśrodkować do prawej) lub left (jeśli chcemy wyśrodkować do lewej).
Uwaga! Nie umieszczamy żadnych spacji, znaków, usuwamy wyraz i wpisujemy inny.
Powyżej przykłady dwóch kodów (wyśrodkowanie nagłówka daty oraz tytułu posta)
Jak myślicie, czy podobał Wam się mój dzisiejszy post? Czy był zrozumiały? :D
Czas mnie goni, już muszę lecieć! :)
Do zobaczenia w następnym poście!
Karolina
Pomogło :) dziękuję
OdpowiedzUsuńJezu, skad Ty to wiedziałaś :O dziękuje, pomogło!
OdpowiedzUsuńDzięki!
OdpowiedzUsuńPomocne, dzięki :) Mam jeszcze spoooro pytań, ale mam nadzieję, że znajdę odpowiedzi :) Zapraszam na mojego bloga http://opowiadaniaanes.blogspot.com/ :)
OdpowiedzUsuńNie wiem dlaczego ale u mnie po wpisaniu tych kodów, nic się nie zmienia :(
OdpowiedzUsuńdzięki! pomogło
OdpowiedzUsuńDziękuje <3 Udało się wreszcie ten nieszczęsny tytuł wyśrodkować :)
OdpowiedzUsuńDzieki :)
OdpowiedzUsuńChciałabym wyśrodkować obraz na stronie głównej (pod nagłówkiem i stronami), przy wpisaniu odpowiedniego kodu wyśrodkowuje się również cały tekst postów... Pomocy!
OdpowiedzUsuńCześć,
OdpowiedzUsuńzakładam blog na blogspocie. Zrobiłem kilka wpisów. Potem je edytowałem, m.in. zmieniając tytuły i zdjęcia. Wynik? W pasku adresowym http widnieją stare tytuły wpisów.
Tak samo jest w rubryce "O mnie": tu też są stare tytuły wpisów, a ponadto stare zdjęcia z wpisów. Jak rozwiązać ten dwojaki problem?
PS Nie znam się na HTML-u, więc w nim nawet nie grzebię.
dzięki :)
OdpowiedzUsuńŚwietny artykuł
OdpowiedzUsuńsuper
OdpowiedzUsuńDziękuję bardzo przydatne i świetnie opisane :)
OdpowiedzUsuńOgromne dziękuję :) <3
OdpowiedzUsuń