HTML tagy, ktoré musíte poznať!

Aj bežný užívateľ WordPressu sa skôr či neskôr stretne s obmedzenosťou integrovaného TinyMCE editora. HTML tagy sú veci, ktoré Vám pomôžu. A nie je ani obzvlášť ťažké sa s nimi naučiť robiť. Aspoň s tými základnými.Prečo vlastne?V živote sa stretávame s rozličnými problémami, kedy nepostačuje vstavaná funkcionalita integrovaného WordPress editora. Malá znalosť jazyka HTML nám môže krásne pomôcť a „zachrániť nás“ pred inštaláciou devedesiatého deviatého pluginu, ktorý by túto funkcionalitu doplnil. Ako by ste bežne v editore napísali horný/dolný index? Ako by ste vytvorili tabuľku, či „zresponzivnili“ obrázok? Čo je HTML a ako funguje?HTML je skratka pre Hypertext markup language, čo znamená Hypertextový značkovací jazyk. Programátori sa často rozčúlia, keď o sebe niekto tvrdí, že je HTML programátor, lebo HTML je jazyk značkovací a nie programovací. Neobsahuje v sebe žiadnu logiku, žiadne podmienky, žiadne cykly, proste nič, čo obsahuje ozajstný programovací jazyk. HTML slúži na značkovanie textu. Práve pre túto jeho jednoduchosť ho môže na svojej webovej stránke využiť každý. Html je možné písať do WordPress editora. Jednoducho v pravom hornom rohu editora prepneme z „Vizuálny editor“ na „Textový editor (HTML)„. Tým sa nám ukáže náš text, obohatený HTML značkami. A môžeme ísť na to. V Elementore je možné html písať prakticky všade, aj mimo editor. Teda aj napríklad do popisu, či nadpisu ikony, do obrázkového boxu, do nadpisu,… Základným prvkom v HTML je tzv. Značka (alebo „Tag„).  Tag je jedno, alebo viac písmen, ktoré sa píšu do špicatých zátvoriek. Takmer všetky HTML tagy sú párové, to znamená, že majú otvárací a zatvárací tag. Zatvárací tag sa líši od otváracieho tým, že má pred samotným tagom lomku. <b> Toto je otvárací tag </b> Toto je zatvárací tagCopyKeď teda máme kus textu, môžeme v ňom aplikovať HTML kód tak, že pred vybranú časť textu vložíme otvárací tag a na konci vybraného textu vložíme zatvárací tag. Každý tag má pritom inú funkcionalitu a robí s textom iné veci.  Jednoduchý príkladNajjednoduchšie tagy zrejme poznáte, ide o tagy <b> <i> a <u>. Rovnakú funkcionalitu, ako majú v HTML, majú aj vo Worde. B – z anglického Bold – urobí text hrubšímI – z anglického Italic – urobí text kurzivouU – z anglického Underline – podčiarkne text Keď teda máme jednoduchý text a jeho časti uzavrieme medzi tieto HTML tagy<b>Lorem ipsum dolor</b> sit amet, <i>consectetur adipiscing</i> elit. <u>Vestibulum maximus</u> magna id augue ultricies, quis cursus ex dapibus.CopyDostaneme takýto výstup: Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum maximus magna id augue ultricies, quis cursus ex dapibus.Všimnime si, že časť textu medzi <b> a </b> je hrubým písmom, časti medzi <i> a </i> sú kurzivou a medzi <u> a </u> sú podčiarknuté. Proste tag označuje miesto v texte, od ktorého začína platiť dané pravidlo a toto pravidlo platí až po ukončovací tag. Preto keď zabudneme na uzatvárací tag, dané pravidlo sa bude aplikovať až do konca textu. Ďalšie jednoduché tagyĎalšie tagy, ktoré by ste ako bežný užívateľ WordPressu mohli poznať, sú:br – zlom riadku – vytvorí nový riadok. Nepárový tag.p – odsek – vytvorí nový odsek. Pôvodne bol nepovinne párový, ale všetci s ním pracujeme ako s párovým. Že je <br> nepárový tag, to znamená asi toľko, že existuje len otvárací tag. Dôvod je jednoduchý, keď označíme zlom riadku, tak je tam proste zlom riadku. Keď chceme ďalší riadok, napíšeme jednoducho zas <br>. Nie je proste možné ukončiť nový riadok. Tu<br> bude<br> každé<br> slovo<br> na<br> novom<br> riadku.CopyVyzerať to bude asi takto:Tubudekaždéslovonanovomriadku.Problémom vo WordPresse je to, že on už tie riadky a odstavce robí pomocou editora automaticky. A navyše ich ani negeneruje do HTML kódu editora. Je to dvojsečný meč. Na jednej strane to tam „nezavadzia“, na druhej strane to môže robiť problémy. Ak v editore stlačíte ENTER, (tu stláčam ENTER)jednoducho sa vloží nový <p> tag. Čiže nový odstavec. Pod ním bude nejaká medzera, ako to je bežné medzi odsekmi. Ak však chcete vložiť nový riadok bez nového odstavca, jednoducho stlačte SHIFT+ENTER. (Tu stláčam SHIFT + ENTER) A vloží sa nový riadok. Alebo použijete html značku <br>.Verím, že vidíte ten rozdiel medzi <br> a medzi <p>. IndexyČasto pri e-shopoch, či stavebných stránkach, potrebujeme napísať index. Napríklad metre štvorcové, metre kubické, alebo čokoľvek iné. V bežnom editore máme problém. Použijeme tieto html tagy, do ktorých uzavrieme index. sup – vytvorí horný indexsub – vytvorí dolný indexMnemotechnická pomôcka je, že b ma bruško dole a teda ním urobíme dolný index a p má bruško hore, teda ním urobíme horný index. Jednoduché, nie?  Rozmer pozemku: 600 m<sup>2</sup><br> Objem šachty: 5 m<sup>3</sup><br> Priemerná rýchlosť: v<sub>priem.</sub>CopyVýsledok:Rozmer pozemku: 600 m2Objem šachty: 5 m3Priemerná rýchlosť: vpriem.Úpravy textuOkrem b i a u existuje ešte niekoľko tagov, ktoré sa dajú použiť na úpravu textubig – zväčší písmo o pár percentsmall – zmenší písmo o pár percent. Tieto dva tagy sú už zastaralé a ich používanie sa neodporúča, boli v HTML 4. Každopádne fungujú aj v HTML 5 (čo je vlastne aktuálna verzia), aj keď už sú väčšinou riešené cez CSSko, teda dá sa nastaviť, na koľko % má zväčšiť, či zmenšiť jeden z týchto tagov. V bežnom živote ich môžeme smelo používať, určite kvôli tomu nevybuchne Fukušima, takže žiadne strachy.s – preškrtne písmostrike – absolútne to isté ako tag <s>Preškrtnuté písmo sa hodí hocikedy. Na e-shopoch keď dáme zľavu a starú cenu tam necháme a preškrtneme, aby užívateľ videl, koľko pôvodne stál tovar. Alebo keď napíšeme nejaký článok a časom v ňom niečo opravíme, môžeme nechať preškrtnutú pôvodinu, aby bolo zrejmé, čo sme opravili. Toto je normálne písmo<br> <big>Toto je veľké písmo</big><br> <small>Toto je malé písmo</small><br> <s>Toto je preškrtnuté písmo</s>CopyToto je normálne písmoToto je veľké písmoToto je malé písmoToto je preškrtnuté písmoPS: Ak sa chcete beztrestne pohrávať s HTMLkom, môžete na to použiť trebárs online editor, napríklad na w3school. The post HTML tagy, ktoré musíte poznať! first appeared on Alibition.

prejsť na článok

Základy HTML tagov a ich význam pre SEO

HTML (Hypertext Markup Language) je základný stavebný kameň každej webovej stránky. Ako jazyk určený na štruktúrovanie a prezentáciu obsahu na internete, HTML používa rôzne tagy alebo značky na definovanie rôznych častí webového obsahu. Príspevok Základy

prejsť na článok

Ako správne nastaviť SEO pre kategórie a produkty vášho e-shopu?

Riešite správne nastavenie SEO pre e-shop? V hlave vám koluje mnoho otázok. Ako podniknúť analýzu kľúčových slov pre jednotlivé kategórie? Ako vytvoriť popisky, ktoré predávajú? Či ako a ktoré meta tagy vyplniť? Nasmerujeme vás, aby ste na nič nezabudli a

prejsť na článok

Ako sa naučiť programovať 5 pravidiel, ktoré musíš poznať

Premýšľaš nad tým ako začať programovať, ako sa naučiť programovať? Alebo už programuješ a chceš vedieť ako sa zlepšiť v programovaní? Mám tu pre teba 5 rád, ktoré mi pomohli a verím, že pomôžu aj tebe. Pravidlo 1: Oklamte mozog pomocou 20 minútového prav

prejsť na článok

Máte web na WordPresse? Toto musíte pravidelne urobiť

The post Máte web na WordPresse? Toto musíte pravidelne urobiť appeared first on Pixweb.

prejsť na článok