Vytvoření knihovny písem pro Arduino. Jak přidat další písma na vstupní stránky v LPgeneratoru? Textové bloky vstupní stránky

13. ledna 2017 v 18:15 hodin

Rusifikace knihovny openGLCD pro Arduino

  • Elektronika pro začátečníky

Psaní ruský text na grafických displejích s ovladačem ks0108 nebo jeho analogy stále představuje značné potíže. Knihovna openGLCD, kterou doporučují oficiální weby Arduina, v původní konfiguraci posledně jmenované tento moment verze žádné neobsahuje Cyrilice písma, kromě písma cp437font8x8. V praxi je to málo použitelné, protože v ruskojazyčné části podporuje kódování Win-1251. Aby se tedy znaky v tomto fontu zobrazily, musí být buď vloženy do textu jako osmičkové resp hexadecimální kódy(a zároveň zůstávají nejasnosti s malým písmem„Já“, jak sám tvůrce písma uvádí v komentáři), nebo jej přesto napište samostatná funkce překódování, jako to udělal arduinec pro knihovnu Adafruit-GFX.

Mimo jiné je cp437font8x8 příliš velký pro obrazovky 128x64 pixelů. Optimální velikost Písmo pro podporu štítků na takovém displeji zůstává System5x7. Zde se zaměříme konkrétně na rusifikaci systémové písmo, i když čtenář může tento příklad použít k nezávislému rusifikování jakéhokoli jiného písma (zejména pokud má větší obrazovku).

Co je za problém?

Nejprve se pojďme ponořit do kořenů problému. Prostředí Arduino IDE je normální textový editor Windows, který běží v univerzálním kódování UTF-8, jako každý jiný v moderně Verze Windows(například Poznámkový blok). UTF-8 je nízkonákladová verze multibyte Kódování UNICODE. V UTF-8 jsou anglické znaky, čísla, tečky, čárky, závorky a všechny možné další znaky reprezentovány jedním bajtem, který odpovídá standardnímu ASCII kódování. Jejich reprezentace v kódu náčrtu proto nepředstavuje žádné potíže: řetězec anglických znaků se po kompilaci přenese do načteného hex souboru beze změn a je srozumitelný pro 8bitový řadič, jak se říká, „bez překladu“.

V procesu této transformace je každý znak, stejně jako v každém programu v jakémkoli programovacím jazyce, reprezentován přímo ve formě svého kódu, tzn. sériové číslo v tabulce písem, ze které program extrahuje grafický styl odpovídajícího znaku. V souboru písma Systém 5x7.h openGLCD knihovna počet znaků reprezentovaných proměnnou font_Char_Count typ uint8_t, to znamená, že nemůže přesáhnout velikost jednoho bajtu. Znaky azbuky, které v UTF-8 zabírají dva bajty, tedy nelze předat řadiči běžným způsobem.

Předchozí pokusyřešení

Všimněte si, že tomu tak nebylo vždy. Verze Arduina 1.0.x (a podle pověstí 1.6.0) zkrátily dvoubajtový kód na jeden bajt, jednoduše zahodily vysoký bajt (což pro azbuku, jak vyplývá z tabulky UTF-8 v odkazu výše , se rovná buď 0xD0 nebo 0xD1). Pro zpřesnění fontu v těchto verzích prostředí je tedy vhodná stará knihovna GLCD v3, ve které bylo pole fontů jednoduše doplněno znaky azbuky tak, aby se jejich pozice shodovaly s nízkým bytem kódování UTF-8 (bajty 0x80 až 0xBF). Tato modernizace je podrobněji popsána v autorově článku „Práce s textem na grafickém displeji“. Opakuji - vyžaduje to jednu z verzí Arduino IDE 1.0.x ve spojení s knihovnou GLCD v3, a ne jejich modernější verze.

V nových verzích Arduino IDE je to stále obtížnější. Knihovna rezolutně odmítá porozumět číslům dvoubajtových znaků a místo toho vydává prázdné místo, takže pouhá změna písma nepomůže. Musíme ho doplnit o funkci pro převod dvoubajtových znaků na jednobajtové.

Řešení

Autor se neponořil do hlubin knihovní funkce a napsal doplněk pro openGLCD ve formě funkce outstr(), který prochází všemi prvky vstupního řetězce a předává je přes operátor výběru Přepínač. Extrahuje znaky azbuky z řetězce a nahradí je jednobajtovými kódy odpovídajícími modernizovanému souboru písem Systém 5x7R.h.

Například pro velké ruské písmeno „F“ bude náhradní řetězec vypadat takto:

Případ "F": GLCD.PutChar(0xA4); přestávka;
Zde 0xA4 je dolní bajt kódování písmene „F“ v UTF-8 (viz odkaz výše). Kompilováno v souladu s tímto kódováním nový soubor písmo Systém 5x7R.h. V zásadě s tímto přístupem můžete použít jakékoli kódování ruských znaků a jakýchkoli dalších glyfů, které chcete do písma vložit. Pokud pouze jejich celkový počet nepřesáhne 128 kusů: od začátku tabulky po symbol 0x7F (127 je poslední symbol standardní stůl ASCII) je vhodné ponechat písmo nedotčené.

Pravda, pár svobod s ASCII tabulka Dal jsem si svolení. Faktem je, že v původním písmu Systém 5x7.h Ikona stupně je umístěna v posledním řádku tabulky a zabírá symbol 0x80, který v našem případě již patří do azbuky. Aby nedošlo k porušení pořadí sestavení tabulky azbuky v souladu s UTF-8, je tento řádek ze souboru odstraněn. A ikona stupně je přidána místo ASCII znaku „~“ (číslo 0x7E), který stejně nebyl ve fontu použit pro zamýšlený účel. Tato náhrada však umožňuje zadat ikonu stupně do textu náčrtu přímo z klávesnice ve formě symbolu „~“.

Další volnost je dána tím, že autor nesnese přeškrtnutou nulu - archaickou věc z dob ATsPU a monochromatických textových displejů. Proto byla nula v modernizovaném písmu nahrazena glyfem písmene „O“. Kdo se drží puristických zásad, může písmo v souboru jednoduše smazat Systém 5x7R.h tuto vložku (starý glyf přeškrtnuté nuly je vynechán s komentářem, jeho kód je 0x30).

V modernizované knihovně openGLCD, který si můžete stáhnout z odkazu na konci článku, došlo k další opravě - změněno pořadí zapojení pinů pro displeje s ovladačem ks0108. Proč autor knihovny zvolil toto pořadí (viz tabulka na odkazu na oficiálních stránkách Arduina) není známo. V modernizovaná verze Připojení displeje (je vybrán například oblíbený MT-12864J) se provádí podle následujícího schématu:

Schéma zapojení MT-12864J


Zde je zapojen variabilní rezistor R1 dle doporučení výrobce a rezistor R2 slouží k omezení proudu podsvícení, pokud není připojen na napětí 5 V, ale přímo na vstupní zdroj (pin Arduino Vin) s vyšším napětím.

Příklad zobrazení ruské abecedy smíchané s latinkou na displeji MT-12864J, stejně jako čísel a ikony stupně, je zobrazen na fotografii:


Načrtněte text pro tento příklad:

Text náčrtu s výstupem ruské abecedy

#zahrnout //zahrnout knihovnu #include //soubor s funkcí pro výstup ruských písmen #include //soubor s ruskými písmennými kódy void setup() ( GLCD.Init(); //inicializace GLCD.ClearScreen(); ) void loop() ( GLCD.SelectFont(System5x7R); //vyberte písmo GLCD.CursorTo(0 , 0 //nastavíme kurzor na výchozí pozici //vypíšeme smíšené anglicko-ruské řádky: outstr("ABC AVGDEZHZIKLMNOP\n"); GLCD.println("1234567890" GLCD.CursorTo(19,4); //nastaví kurzor na předposlední pozici 5. řádku GLCD.print("~C" stupeň C GLCD.println("@); ;/.,|<>()=-_()\"""); GLCD.CursorTo(4,7); //nastaví kurzor na pozici 4 řádku 8 GLCD.print("MT-12864J"); )


Protože soubory s funkcí outstr.h a písmo Systém 5x7R.h umístěny v kořenovém adresáři modernizované knihovny, pak na ně musí být umístěny samostatné odkazy na začátek náčrtu pomocí směrnice #zahrnout. Pro nápisy v angličtině je stále vhodné použít standardní vlastnosti println/print, ale pokud potřebujete odřádkování v ruském textu, musíte výslovně zadat znak „\n“.

Můžete si stáhnout opravenou verzi knihovny

Konečně, maticové moduly dorazily z Říše středu. Každý modul se skládá z mikroobvodu MAX7219 (), matice LED a ve svazku je jeden kondenzátor a jeden odpor.


Ovládá se MAX7219 přes rozhraní SPI.


Čipy v clusteru jsou zapojeny do série. Na internetu jsem se dočetl, že maximálně možné sériové připojení umožňuje pouze 8 kusů MAX7219. Nevěř tomu. Připojil jsem 16 modulů a vše funguje skvěle.

Moduly prezentované na Ali přicházejí v několika verzích. Nejoblíbenější jsou 2 typy: s čipem v DIP a v pouzdrech SOIC. Modul s DIP čipem větší velikost a není to tak pohodlné při připojení ke clusteru. Bude tam hromada drátů k připojení.


Moduly s čipem v pouzdře SOIC mají velikost LED matice a spojují se pájením nebo propojkami. Ukazuje se to krásné a elegantní.


Nejznámější knihovny pro práci s maticemi a shluky jsou Panel MAX72xx od Marka Rice A Parola od MajicDesigns: první knihovna se používá snadněji, druhá je obtížnější více příležitostí. Popíšu to podrobněji.

Panel MAX72xx

Při použití panelu MAX72xx musí být knihovna nainstalována Adafruit GFX.

Pro rusifikaci textu si budete muset stáhnout TENTO SOUBOR a nahradit standardní soubor glcdfont.c v adresáři Arduino/Libraries/Adafruit-GFX-Library-master. Také v tomto souboru je kromě potřebných písmen a číslic popsána hromada všemožných symbolů. Ne všechny mohou být užitečné. Níže uvedený obrázek vysvětluje, jak se symboly tvoří.

V případě potřeby si můžete vytvořit vlastní symboly a nahradit jimi všechny nepoužívané v souboru. Téměř všechna bodová písma použitá v různé knihovny, se tvoří podobným způsobem.

Takže jsou nainstalovány knihovny MAX72xx Panel a Adafruit GFX, soubor glcdfont.c je nahrazen. Spusťte Arduino IDE, otevřete SOUBOR. Skica obsahuje funkci utf8rus. Poskytuje konverzi tabulky znaků pro ruský jazyk. Je potřeba pouze pro normální výstup z programu, to znamená, že v programu je požadovaný text napsán v ruštině. Pokud je text zadán přes COM port, pak jsou kódy znaků opraveny ve funkci Serial_Read. Vývojáři použili různá kódování v IDE a v konzoli.

Na začátku souboru jsou řádky nezbytné pro fungování knihovny.

int čísloHorizontalDisplays = 1;

int početVertikálníchDisplí = 16;

Mám moduly s mikroobvodem v pouzdře SOIC. Mají malou zvláštnost. Matice modulů je instalována otočená o 90 stupňů. Jedná se o poplatek za pohodlí připojení. Pokud spustíte skici, které jsou součástí knihoven, budou v každém modulu vystupovat text zdola nahoru. Text se zobrazí cik-cak. Aby se tato nemoc vyléčila, musí to knihovně „řeknout“. vertikální displeje 16 (fyzicky jsou umístěny vodorovně). A pak v nastavení void zadejte řádek do knihovny

matrix.setRotation(matrix.getRotation() + 1);

Programově obrátí každou matici. A vše se zobrazí normálně.

Moduly s pouzdry DIP čipů toto nemají. Všechno je tam krásné, až na hromadu drátů.

Knihovna MAX72xx Panel je poměrně skromná. Vizuální efekty není žádný závěr. Klastr je vnímán jako jeden celek. S MD Parola je to mnohem lepší.

Parola od MajicDesigns.

Majitelé modulů s čipem v pouzdře SOIC se také potýkají s problémem orientace modulů v clusteru. Jen vypadá trochu jinak než v MAX72xx. Zde se bude zdát, že moduly jsou mimo provoz.


Náčrt HelloWorld ze vzorků součástí knihovny.

Nebyl jsem schopen tuto chorobu vyléčit programově v náčrtu. Choval jsem se k němu jinak. V souboru Adruino/libraries/MD_MAX72xx_lib.h na konci musíte najít řádky jako na obrázku.


A opravte zvýrazněnou 1 až 0 ve vybraném řádku Uložte soubor. Arduino IDE není nutné restartovat. Nalijeme a podíváme se.


Nyní můžete používat 24 animačních efektů. Animace se spustí příkazem P.displayText("Text k zobrazení", "zarovnání textu", rychlost, zpoždění zobrazení, efekt vzhledu, efekt zmizení). Jak vidíte, nastavení je poměrně hodně.

A nejlepší na tom je rozdělení clusteru do virtuálních zón. Práce se zónami není příliš náročná. Skicu nezveřejňuji, je ve vzorcích, které jsou součástí knihovny. Nyní můžete bez problémů, téměř bez problémů zobrazit hodiny na začátku clusteru a ticker zpráv na zbývajících modulech.

Jak jste již uhodli, problém je s písmeny azbuky. Je to také řešitelné. U předchozí soubor ve stejném adresáři je soubor MD_MAX72xx_font.cpp. Toto je soubor písma. Znaky v něm jsou tvořeny podobně jako soubor fontu knihovny GFX. Je v tom nepatrný rozdíl. Zde může být velikost symbolu menší než 5 bodů. V knihovně Adafruit GFX Vykřičník, je například také široký 5 bodů, jako každý jiný symbol je použita pouze jedna řada bodů. Zbytek nesvítí, ale je použit jako symbol. V Parole stejný vykřičník také zabírá jednu řadu teček, pouze poblíž nejsou prázdné tečky, ale mohou se objevit sousední symboly. Z obrázku to bude jasnější.


Zatím není čas přidat do souboru znaky azbuky stejným způsobem jako soubor z první diskutované knihovny. Pokud to někdo udělá a pošle mi soubor, přidám ho do tohoto článku a já i hosté mých stránek vám budeme vděční.

Sečteno a podtrženo. Knihovna MAX72xx Panel od Marka Rice se snadno používá a rozumí, ale má špatnou funkčnost.

Knihovna Parola od MajicDesigns je složitější a její možnosti jsou dostačující pro téměř jakoukoli aplikaci.

LED Matrix je grafický indikátor, který lze použít k zobrazení jednoduché obrázky, písmena a číslice. Se strukturou maticových ukazatelů jsme se podrobně seznámili na. Pak se ukázalo, že seskupení několika matic není snadný úkol. Pro každého nový řádek nebo sloupec matic, musíte přidat nový posuvný registr spolu s dráty a odpory a přátelsky také mikroobvod ULN2003.

Naštěstí se inženýři dlouho vyvíjeli specializované čipy pro správu různých druhů ukazatelů. V tomto tutoriálu se podíváme na maticový modul s čipem MAX7219. Jak se později ukáže, práce s takovým modulem je radost.

1. LED maticový modul s čipem MAX7219

Modul je deska s mikroobvodem, nezbytným zapojením pro něj a ve skutečnosti maticovým indikátorem. Obvykle není indikátor připájen do desky, ale vložen do konektoru. To se děje tak, že skupinu modulů lze nejprve připevnit šrouby k nějakému povrchu a poté do nich vložit matrice.

A takto vypadá modul s maticí.

Modul má pět kolíků na každé straně. Na jedné straně data vstupují do modulu, na druhé straně data modul opouštějí a přenášejí se do dalšího. To vám umožní spojit matice v řetězci.

Vstupní konektor:

  • VCC, GND - napájení;
  • DIN - zadávání dat;
  • CLK - synchronizační puls.

Výstupní konektor:

  • VCC, GND - napájení;
  • DOUT - výstup dat;
  • CS - výběr modulu (výběr čipu);
  • CLK - synchronizační puls.

Modul pracuje s napětím 5 voltů.

Spojení

Maticový modul připojíme k ovladači Arduino Uno podle následujícího schématu:

8x8 LED Matrix s MAX7219 VCC GND CIN C.S. CLK
Arduino Uno +5V GND 11 9 13

Schematický diagram

Vzhled rozložení

2. Výstup obrazových bodů pomocí knihovny Max72xxPanel

Pro ovládání čipu MAX7219 použijeme knihovnu Max72xxPanel. Můžete si jej stáhnout z odkazů na konci lekce.

Pojďme nainstalovat knihovnu a psát malý program, který zobrazí pouze jeden bod se souřadnicemi x=3 a y=4. Tečka bude blikat s periodou 600 milisekund.

#zahrnout #zahrnout #zahrnout int pinCS = 9; int čísloHorizontalDisplays = 1; // počet matic vodorovně int početVerticalDisplays = 1; // počet matic vertikálně Max72xxPanel matrix = Max72xxPanel(pinCS, numberOfHorizontalDisplays, numberOfVerticalDisplays); void setup() ( matrix.setIntensity(4); // jas od 0 do 15 ) void loop() ( matrix.drawPixel(3, 4, HIGH); // rozsvítí pixel maticí souřadnic (3,4). zápis ( // výstup všech pixelů do matice matrix.drawPixel(3, 4, LOW);

Jak již bylo zmíněno dříve, maticové moduly s čipem MAX7219 lze snadno kombinovat. Právě za tímto účelem na začátku programu nastavíme počet matic horizontálně a vertikálně. V v tomto případě je použita jedna matice, takže oba tyto parametry se budou rovnat 1.

Je důležité si uvědomit, že po zapnutí a vypnutí pixelů pomocí funkce drawPixel, musíte funkci zavolat napsat. Bez funkce zápisu se pixely na matrici nezobrazí!

Nyní napíšeme program, který na matrici zobrazí smajlíka z minulosti. Úsměv zašifrujeme pomocí pole osmi bajtů. Každý bajt pole bude zodpovědný za řádek matice a každý bit v bajtu bude zodpovědný za bod v řádku.

#zahrnout #zahrnout #zahrnout int pinCS = 9; int čísloHorizontalDisplays = 1; // počet matic vodorovně int početVerticalDisplays = 1; // počet matic vertikálně Max72xxPanel matrix = Max72xxPanel(pinCS, numberOfHorizontalDisplays, numberOfVerticalDisplays); const byte data = ( 0b00111100, 0b01000010, 0b10100101, 0b10000001, 0b10100101, 0b10011001, 0b01000010, 11001); void setup() ( matrix.setIntensity(7); // jas od 0 do 15 matrix.fillScreen(LOW); // vymazání matice pro (int y = 0; y< 8; y++) { for (int x = 0; x < 8; x++) { // зажигаем x-tý pixel PROTI y-tý řádek matrix.drawPixel(x, y, data[y] & (1<

Poznámka. Knihovna Max72xxPanel má funkci setRotation, která nastavuje orientaci obrázku na matici. Pokud chceme například otočit smajlíka o 90 stupňů, budeme muset ihned po volání funkce setIntensity zavolat setRotation s příslušnými argumenty:

matrix.setRotation(0, 1);

prvním parametrem je index matice, v našem případě je roven nule; druhým parametrem je počet otočení o 90 stupňů.

3. Textový výstup pomocí Adafruit-GFX-Library

Stejným způsobem můžete na matici zobrazit jakýkoli jiný symbol, například písmeno. Abychom ale mohli zobrazit jakékoli písmeno anglické abecedy, budeme muset v programu definovat až 26 osmibajtových polí! To je velmi zdlouhavé a samozřejmě to už někdo před námi udělal.

Populární Adafruit-GFX-Library obsahuje kromě funkcí pro práci s grafikou a textem také databázi latinských písmen velkých i malých písmen a také všechna interpunkční znaménka a další servisní symboly. Odkaz na knihovnu je na konci lekce.

Pomocí této funkce můžete zobrazit symbol na matici drawChar.

drawChar(x, y, znak, barva, pozadí, velikost);

První dva parametry funkce jsou zodpovědné za souřadnice levého horního rohu symbolu. Třetím parametrem je samotný symbol. Barva symbolu v našem případě bude rovna 1 nebo VYSOKÁ, protože matice je dvoubarevná. Pozadí je 0 nebo NÍZKÉ. Poslední parametr „velikost“ nastavíme na 1.

Pojďme napsat program, který jedno po druhém zobrazí na matici všechna písmena fráze: „AHOJ SVĚTE!“

#zahrnout #zahrnout #zahrnout int pinCS = 9; int pocetHorizontalZobrazeni = 1; int početVertikálníchDisplí = 1; Max72xxPanel matice = Max72xxPanel(pinCS, početHorizontalDisplays, NumberOfVerticalDisplays); Řetězová páska = "AHOJ SVĚTE!"; int čekání = 20; void setup() ( matrix.setIntensity(7); // jas od 0 do 15 ) void loop() ( for (int i = 0 ; i< tape.length(); i++) { matrix.fillScreen(LOW); matrix.drawChar(0, 0, tape[i], HIGH, LOW, 1); matrix.write(); } delay(wait); }

Poznámka. Knihovna Adafruit_GFX má mnoho funkcí pro práci s grafikou. Například drawCircle(3, 3, 2, HIGH) nakreslí kružnici se středem (3,3) a poloměrem 2. Posledním parametrem je barva, ale v případě monochromatické matice je to 1 nebo HIGH. Funkce drawLine(0, 0, 3, 6, HIGH) nakreslí čáru mezi body (0,0) a (3,6).

3. Program. Plíživá linie na max7219

Abychom mohli zobrazit několik písmen najednou, musíme jich několik spojit do řetězce LED matrice. Jak již bylo zmíněno, provádí se to velmi jednoduše. Schéma připojení šesti modulů bude vypadat takto.

Schematický diagram

Vzhled rozložení

Program

Posunem souřadnic písmen vytvoříme průběžnou čáru. Pro zobrazení písmene v požadovaných souřadnicích použijeme stejnou funkci drawChar.

#zahrnout #zahrnout #zahrnout int pinCS = 9; int početHorizontalDisplayů = 6; // teď máme 6 matic vodorovně int pocetVerticalDisplays = 1; // a vertikálně, jako předtím, je jedna Max72xxPanel matice = Max72xxPanel(pinCS, početHorizontalDisplays, NumberOfVerticalDisplays); String tape = "site"; // text, který bude plavat int wait = 20; // doba mezi krajními pohyby písmen int spacer = 1; // vzdálenost mezi písmeny int šířka = 5 + mezerník; // velikost písma void setup() ( matrix.setIntensity(7); // jas ) void loop() ( for (int i = 0 ; i< width * tape.length() + matrix.width() - 1 - spacer; i++) { matrix.fillScreen(LOW); int letter = i / width; int x = (matrix.width() - 1) - i % width; int y = (matrix.height() - 8) / 2; // center the text vertically while (x + width - spacer >= 0 && písmeno >= 0) ( if (písm< tape.length()) { matrix.drawChar(x, y, tape, HIGH, LOW, 1); } letter--; x -= width; } matrix.write(); delay(wait); } }

Nahrajte program na Arduino Uno a sledujte ticker!

Úkoly

  1. Digitální hodinky. Sestavte obvod čtyř LED matic a modulu hodin reálného času. Napište program pro Arduino, který bude zobrazovat hodiny a minuty na displeji z matic.
  2. Hra had. Sestavte displej s rozlišením 16x16 pixelů ze čtyř LED matic. Implementujte tak slavnou hru jako „had“ (nebo „python“) na Arduinu. Do obvodu je nutné přidat čtyři tlačítka pro ovládání směru pohybu a také bzučák pro signalizaci události pojídání jablek.

Závěr

Spojením maticových modulů na max7219 můžete sestavit poměrně velké displeje a použít je v projektech Arduino, kde je vyžadován výstup živé obrazy. LED displeje jsou na rozdíl od LCD displejů odolné vůči nízké teploty. Například ticker vyrobený z matric lze umístit venku i ve 30stupňovém mrazu.

Kromě jednobarevných maticových modulů na max7219 existují další podobná zařízení. Například trikolóra LED displeje s rozlišením 32x16 a dokonce 64x32 pixelů. O takových modulech budeme hovořit v následujících lekcích a článcích.

užitečné odkazy

1. Knihovna Max72xxPanel:

2. Knihovna Adafruit-GFX-Library.

Dobrý den, vážení uživatelé LPgenerátoru!

Poznámka: za účelem připojení písma standardním způsobem, použijte hotový nástroj. Snadno se používá a umožňuje přidávat doplňková písma bez dalšího úsilí:

V tomto příspěvku se dozvíte, jak přidat další písmo na vaši vstupní stránku pomocí služba Google Písma pomocí přidávání skriptů.

2. Nezapomeňte uvést abecedu, tedy sadu znaků.

Pokud je vstupní stránka v ruštině, vyberte latinku ( latinský) a azbukou ( cyrilice):

3. Vyberte písmo, které se vám líbí, a klikněte na „ +":

4. Přejděte do kolekce přidaných písem. Chcete-li to provést, klikněte na černý pruh níže:

5. V okně, které se otevře, první položka zobrazuje dříve vybraná písma.

Pamatujte: použijte velké množství různá písma Písma Google může zpomalit načítání vaší vstupní stránky. Vliv vybraných stylů na rychlost načítání stránky je zobrazen vpravo.

6. Pokud je nastaveno a vzhled jste spokojeni s přidanými fonty, přejděte do sekce "EMBED" a zcela zkopírujte obsah pole "STANDART":

Nezavírejte karta Google Fonty, budeme je potřebovat později.

Otevřete požadovanou vstupní stránku v editoru LPgenerator a klikněte na nástroj "skripty":

  • v okně, které se otevře, klikněte na "Přidat nový skript";
  • zapište si název skriptu;
  • vyberte pozici skriptu "Uvnitř značky HEAD";
  • vložte zkopírovaný kód;
  • nezapomeňte uložit změny.

7. Vraťte se na kartu Písma Google.

Zkopírujte vygenerovaný kód CSS pro použití načtených písem.

Každý font používá svůj vlastní CSS.

Například pro písmo Lobster vypadá kód takto: font-family: "Hor", kurzíva;

8. Vraťte se do editoru LPgenerator a klikněte na prvek (text nebo tlačítko), na který chcete použít stažené písmo.

Existují funkce použití stylů pro různé prvky vstupní stránka.

CTA prvky

Chcete-li změnit styl písma na tlačítku, stačí na něj kliknout a v pokročilých vlastnostech napravo přidat CSS pro písmo (zkopírované v kroku osm).

Textové bloky vstupní stránky

Abyste mohli použít externí písmo na textový blok, u kterého jste již písmo změnili, nestačí pouze zadat styl v jeho pokročilých vlastnostech. Musíte také resetovat aktuální formátování. Chcete-li to provést, vyberte text a klikněte na tlačítko „Odebrat formátování“ v bloku pro úpravy textu.

Poznámka: Tímto resetujete všechny změny, které jste provedli ve velikosti písma, stylu písma, zarovnání atd.

Poté můžete znovu zadat velikost, zarovnání a další atributy.

Pokud je to poprvé, co vytváříte textový blok na vstupní stránce a nezměnili jste jeho písmo, můžete jednoduše kliknout na text a přidat CSS pro písmo v pokročilých vlastnostech prvku.

9. Uložte změny a obdivujte výsledek.

Upozornění: v editoru LPgenerator zůstane písmo stejné; další písma se zobrazí pouze v náhledu a při návštěvě publikované vstupní stránky.




Horní