Jak zrobić motyw dla Wordpressa (12)

To jest właściwie wszystko. Zostały tylko dodatki.  Wystarczy zrobić własną skórke 2 kolumnową lub jedno kolumnową przy pomocy tych instrukcji i używać ją jako szablon do tworzenia kolejnych skórek.
Ta instrukcja dotyczy tylko bardzo prostych skórek, które można zrobić najprościej bez znajomości php.

 

Miniaturka templatki

Pozostało jeszcze zrobienie miniaturki, która będzie się wyświetlała w zakladce Wygląd – Motywy.

  • otwórz swój blog w przeglądarce
  • wciśnij Print Screen na klawiaturze
  • otworz pusty dokument w jakimś programie graficznym i wklej zrzut z ekranu – ctrl+v
  • wykadruj go na 300 x 225 pikseli
  • zapisz go jako png pod nazwą screenshot.png
  • wyślij na serwer do katalogu templatki

Dodatkowe elementy

Wyświetlanie daty

Jeśli chcemy wyświetlić datę nad wpisem – data może być nad tytułem, pod tytułem, gdzie chcemy.  Należy dodać następujący kod:
<div><span><?php the_time(‘M’) ?></span> <span><?php the_time(‘d’) ?></span></div>

Ja jeszcze dodałam na swoim blogu rok: <span><?php the_time(‘Y’) ?></span>
Moim zdaniem to ważne jeśli chcemy prowadzić blog długo.

Wyświetlanie poziomego menu
Większość blogów ma poziome menu w nagłówku wyświetlające strony statyczne. Aby je wyświetlić wstaw do pliku header.php kod:

<div id=”menu” ><!– menu gorne –>
<ul>
<li><a href=”<?php bloginfo(‘url’) ?>” title=”Home” >Home</a>
<?php wp_list_pages(‘depth=1&title_li’); ?>
</ul>
</div>

Powstanie wtedy lista, która wyświetli strony jedną pod drugą.  Aby je ustawić poziomo na jednej linii i bez kropek listy dodaj odpowiedni kod do arkusza styli style.css.

#menu {
width:100%; margin: 0; padding: 0; }
#menu ul {
list-style-type:none; float: left; list-style: none; margin: 0; padding: 0;  }
#menu ul li {
display:inline;   }

Warto dodać jeszcze wielkości czcionek (opisując znacznik a, gdyż menu będzie linkami), marginesy, dopełnienia, tło aby menu wyglądało ładnie.

Jednakowa długość kolumn

Właściwie jedynym sposobem na to jest stworzenie tła graficznego z  dwoma kolumnami w 2 kolorach.

 

Leave a reply

Twój adres email nie zostanie opublikowany. Pola, których wypełnienie jest wymagane, są oznaczone symbolem *

This site uses Akismet to reduce spam. Learn how your comment data is processed.