Dostosowywanie tagów CSS w układzie bloga

Aby użyć w projektancie szablonów arkusza CSS zastosowanego w szablonie bloga, skorzystaj z kilku poniższych wskazówek.

Konfigurowanie zmiennych

W sekcji <head> Twojego kodu musi znaleźć się para tagów <b:skin> </b:skin>.

Określone deklaracje stylów CSS znajdą się pomiędzy tymi tagami razem z nazwami zmiennych, dzięki którym w projekcie będzie można korzystać ze strony Czcionki i kolory.

Przykład
<head>

...
<b:skin>
 <style type='text/css'>
 /*
  * Definicje zmiennych:
  *  <Variable name='bgcolor' description='Kolor tła strony'
      type='color' default='#fff'/>
  */
 body {
   background: $bgcolor;
   margin: 0;
   padding: 40px 20px;
 }
 </style>
</b:skin>
</head>

Kod CSS zawarty między tagami komentarza /* i */ nie będzie widoczny na blogu.

Będzie dostępna lista zmiennych – po jednej dla poszczególnych czcionek i kolorów – które będzie można edytować na karcie „Czcionki i kolory”. Każda zmienna musi zawierać informacje pokazane w powyższym przykładzie i opisane poniżej:

  • name (nazwa) – może zawierać litery lub cyfry. Każda nazwa w szablonie musi być niepowtarzalna.
  • description (opis) – dodany opis pojawi się w sekcji „Czcionki i kolory”.
  • type (rodzaj) – „czcionka” lub „kolor”.
  • default (domyślnie) – wartość domyślna. W przypadku kolorów należy użyć szesnastkowego kodu koloru, na przykład #FF0066. W przypadku czcionek będzie to lista zmiennych określających styl (font-style), grubość (font-weight), rozmiar (font-size) i rodzinę (font-family) czcionki.

Używanie zmiennych

Aby użyć wartości zmiennej, po skonfigurowaniu zmiennych wpisz $variable_name (nazwę zmiennej) w sekcji b:skin arkusza css.

Rodzaje zmiennych

Projektant szablonów umożliwia edycję określonych rodzajów zmiennych w arkuszach CSS. Możesz określić rodzaj zmiennej:

  • zmienne kolorów pozwolą wybierać w projektancie szablonów kolory z palety kolorów;
  • zmienne czcionek pozwolą wybierać w projektancie szablonów czcionki, ich rozmiary oraz pogrubienie lub kursywę.

W powyższym przykładzie występuje zmienna bgcolor, dla której ustawiono kolor biały (#fff). W dalszej części kodu znajduje się ciąg: background: $bgcolor. Ten element kodu nadaje tłu kolor biały i można go zmienić w sekcji „Czcionki i kolory”.

Uwaga: nie musisz tworzyć zmiennych dla pozostałych rodzajów atrybutów CSS. Mogą być one standardowo zawarte w arkuszach CSS (jak w przypadku atrybutów margin: i padding: w powyższym przykładzie).

Więcej informacji o arkuszach CSS

Czy to było pomocne?
Jak możemy ją poprawić?
Szukaj
Wyczyść wyszukiwanie
Zamknij wyszukiwanie
Aplikacje Google
Menu główne
Wyszukaj w Centrum pomocy
false
false
true
true
74
false
false