Nadpis uprostřed a nadpis s ozdobnou linkou

Co si budeme povídat, editace nadpisu v prostředí personalizace Bloggeru není nijak zvlášť široká. Proto vám dnes poradím, jak je velice jednoduše aspoň trochu ozvláštnit.

Nadpis uprostřed
Nechápu, proč zrovna taková věc není v návrháři už dávno. Mnohým blogům mnohem víc sluší nadpis uprostřed stránky, nemyslíte? Naštěstí nastavení není vůbec nic těžkého.

1. Vlezete do prostředí Bloggeru, v nabídce kliknete na Šablonu a poté na Personalizovat.

2. V návrháři šablon vyberte Pokročilé a poté sjeďte v nabídce až úplně dolů – na Přidat CSS.

3. Do okna zadejte text

 .post-title {  text-align: center;  }

4. Uložte. (Kliknutím "Použít na blog")

Nadpis z ozdobnou linkou
Zajímavější nadpis pro blogy, ke kterým se hodí nadpis uprostřed stránky.

1. V prostředí Bloggeru opět vyberete Šablonu, nicméně pak kliknete na Upravit HTML.

2. Klikněte do šablony a s pomocí CTRL+F najděte slova post-title entry-title. Pozor, v textu se objevují dvakrát! A nás zajímá právě ten druhý. (Pokud nechcete hledat, stačí při hledání zmáčkout enter dvakrát, ne jednou).

3. Za text <h3 class='post-title entry-title' itemprop='name'> napište <span>

4. Před </h3> napište </span>
5. Poté opět pomocí CRTL+F najděte </b:skin> (Pokud se vám po kliknutí na slovo rozevře další text, nepanikařte, nic se neděje, sjeďte na hledaný text)

6.  Před </b:skin> zkopírujte tento text:

h3.post-title::before {border-top: 1px solid #666; /* changes the border width, style, colour */margin-top: 10px; /* moves the line up or down */content: " ";position: absolute;left: 0;right: 0;z-index: 0; }
h3.post-title span {background: #FFF; /* text background color to cover line */padding: 0 20px; /* adds space to either side of the text */position: relative;z-index: 1 !important;margin: 0 auto; }
.post-title.entry-title { text-align: center; }

7. Uložte.

















(Po kliknutí se fotky zvětší.)

V případě dotazů mě neváhejte kontaktovat!