úterý 5. července 2016

Často vidím na jiných blozích, že v šabloně je nastavené písmo, které ale nepodporuje všechny znaky, tudíž písmena s čárkami a háčky nemusí fungovat. Takže dnes mám pro vás návod, jak správně do šablony zakomponovat font, aby fungoval tak, jak má...


Můj návod.

Kopírovat se zdrojem! 


Fonty si vybírám přímo na googlu. A abych si zajistila, že mi půjde diakritika, vyplním si do zkušebního textu následující text

ěščřžýáíéťďňĚŠČŘŽÝÁÍÉŤĎŇ



V pravém menu si opět hledáte nastavení a typy písma. Široké, tenké, ručně psané a podobně. Můžete si navolit opět Latin extended, ale už to není stoprocentní, že vám to ukáže jen písma, kde diaktirika půjde...


Zvolený text, tedy moje kouzelná písmenka, vložíte přímo do typu písma, které se vám líbí... A u toho, co chcete kliknete na plus... Zobrazí se vám šedá lišta, kde uvidíte všechny písma, která se vám uloží. Po ukončení výběru na ni kliknete.



V záložce Customize pro jistotu zaškrtněte obě položky - Latin i Latin extended, pokud jsou a pokud vám to šablona povolí. Pokud bude šablona vyhazovat hlášky o chybě, Latin Extended nepoužívejte ... Tuhle část obvykle ignoruji.


V záložce Embed zvolíte buď Standart a text zkopírujete, vložíte za <head>, až nad css styly


<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html expr:dir='data:blog.languageDirection' xmlns='http://www.w3.org/1999/xhtml' xmlns:b='http://www.google.com/2005/gml/b' xmlns:data='http://www.google.com/2005/gml/data' xmlns:expr='http://www.google.com/2005/gml/expr'>

<head>
<meta content='...' name='keywords'/>
<meta content='...' name='author'/>
<meta content='...' name='description'/>
<meta content='index, follow' name='robots'/>
<meta content='text/html; charset=utf-8' http-equiv='content-type'/>

<link href="https://fonts.googleapis.com/css?family=Modak&subset=latin-ext" rel="stylesheet"> 


Druhá možnost je použít @import, a to se vkládá jako v předcházející verzi hned za </b:skin>, tedy pod css styly


<style>
@import 'https://fonts.googleapis.com/css?family=Modak&subset=latin-ext';
</style>

A pak už to zůstává stejné,  v posledním kroku na google fonts si už jen zkopírujete název fontu font-family: ..., který použijete v css stylu tam, kde potřebujete. V textu, nadpisech a podobně, například takto:



A to je vše... :-) Už by to mělo fungovat správně.



Sdílení článku:

Autorka článku:

Lucy Lillianne Vždycky mě bavilo hrát si s grafikou, dělat blogy a jejich vzhledy. Nikdy jsem se nepovažovala za nějakého experta a ani nikdy nebudu. To, co sem publikuji jsou věci, které by se mohly někomu do budoucna hodit nebo i mě samotné, pokud bych nějaký postup zapomněla... Každopádně jsem ráda, že sem tam si nějaký článek najde svého čtenáře nebo rovnou uplatnění :-)


vydáno: úterý, července 05, 2016
vaše reakce: 11 komentářů
se štítkem:

11 komentářů:

  1. Tohle je super! Dík za návod! :) S těmi háčky občas docela bojuju a přenastavovat font posedmé se mi většinou nechce.

    OdpovědětVymazat
    Odpovědi
    1. Obvykle se tam dá najít písmo, které blbne, ale když se to udělá tímto postupem, mělo by to být ok :-)

      Vymazat
  2. Velká škoda, že to platí jen pro blogspot, jinak je to skvělý návod! :)

    http://boook-planet.webnode.cz/

    OdpovědětVymazat
  3. Tyhle tipy pro blogery jsou perfektní! S řadou věcí se bezradně potýkám, protože opravdu nejsem žádný IT expert, a tohle je fat nápomocné, tak jen tak dál :-)

    OdpovědětVymazat
  4. Děkuju moc :) Ono je to pak hrozně nevzhledné :p

    OdpovědětVymazat
    Odpovědi
    1. jj, to znam, kdyz jsem zacinala, nasla jsem si treba nadhernou sablonu, ale to pismo me odradilo...

      Vymazat

Každý vzkaz pro mě znamená mnoho a často vykouzlí úsměv a potěší. Děkuji každému, kdo kvůli mě ztratí pár vteřin života :-)