HTML podpis e-mailu s grafickým obrázkem v Mozilla Thunderbird

Napsal(a) Napsáno čtvrtek, 29 srpen 2013 Zveřejněno v Rady a návody Přečteno 43306 krát
Ohodnotit tuto položku
(10 hlasů)

Vrtá vám hlavou, jak mít ve svém e-mailovém podpise pěkný text, který má styl a třeba i obrázek? Ať už chete mít v podpisu firemní logo nebo jen chcete mít svůj automaticky vkládaný podpis pěkný, návod najdete zde. Sice je mířený především pro emailového klienta Mozilla Thunderbird, ale velmi podobný postup bude i např. v Microsoft Outlook i jiných programech tohoto typu.



V kostce

Napíšeme krátký HTML kód s naším podpisem, kterému pomocí atributu style dáme pěkný design. Tento kód pak vložíme do nastavení schránky v Thunderbirdu. Druhá možnost je, že celý podpis bude jeden větší obrázek a o styly se nemusíme starat - pouze napíšeme kód pro vložení obrázku, což ale není úplně ideální řešení. Výsledek u obou postupů může být u HTML mailů stejný - např. následující podpis.

 1-podpis-hotovy

Jak na HTML podpis

Chceme podpis, který může obsahovat libovolný počet řádků a také může obsahovat obrázek. Nejjednodušší je vložit podpis přímo do příslušného okénka v ThunderBirdu, kód je tam ale špatně čitelný, protože okénko je malé. Otevřete si proto tedy např. Poznámkový blok a tam zkopírujte, kde kód budete psát, a ten pak vždy zkopírujte do onoho malého okénka v Thunderbirdu.  U každého kódu si pochopitelně můžete texty přepsat dle libosti. 

Až budete chtít podpis vyzkoušet, aby se vám v Thunderbirdu zobrazil a posílali jste ho, postup je následující:

1) kliknete pravým tlačítkem na e-mailovou schránku, u které chcete podpis nastavit, a vyberete "Nastavení"

nastaveni-1

2) zaškrtnete "Použít HTML" a zkopírujete nebo vepíšete nějaký kód z tohoto článku do prostoru pod tímto zatržítkem.

nastaveni-2

Základní HTML

<p>
S přáním pěkného dne,<br />
Tomáš Janeček -webkodér |
Tato e-mailová adresa je chráněna před spamboty. Pro její zobrazení musíte mít povolen Javascript. | 774 249 724<br />
www.webzpravodaj.cz
</p>
 

Značka (tag) <p></p> znamená odstavec. Všechen text, který odstavec obsahuje, musí být uzavřený mezi značkami <p> a </p>. Veškerý text našeho podpisu je tedy jeden odstavec. Značka <br />zalomí řádek, veškerý text za ní se tedy objeví na dalším řádku. Svislý oddělovač ("|") napíšeme pomocí klávesové zkratky pravý Alt + W., nicméně není vůbec nutné jej používat. V e-mailu se tento podpis zobrazí nějak takto: 

2-podpis-zaklad 

Kurzíva, tučné písmo a odkazy

Na první pohled poněkud suchý. Proto přidáme některé další značky - text mezi značkami <em></em> bude v kurzívě a text mezi značkami <strong></strong> bude tučný. Navíc uděláme naši e-mailovou adresu klikatelnou s tím, že po kliknutí se nám otevřene emailový klient s vyplněným adresátem. To uděláme pomocí značky <a href="mailto:Tato e-mailová adresa je chráněna před spamboty. Pro její zobrazení musíte mít povolen Javascript."></a> - Tato e-mailová adresa je chráněna před spamboty. Pro její zobrazení musíte mít povolen Javascript. musíte pochopitelně přepsat na emailovou adresu, kterou chcete mít v podpisu. Pokud bychom chtěli mít klikatelný i odkaz na náš web, museli bychom přidat značku <a href="http://adresawebu.cz>text odkazu</a> - kde opět musíte přepsat adresu webu i text odkazu. Kód vypadá tedy nějak takto:

 <p>
<em>S přáním pěkného dne,</em><br />
<strong>Tomáš Janeček - webkodér</strong> <strong>|</strong> <a href="mailto:Tato e-mailová adresa je chráněna před spamboty. Pro její zobrazení musíte mít povolen Javascript.">Tato e-mailová adresa je chráněna před spamboty. Pro její zobrazení musíte mít povolen Javascript.</a>
<strong>|</strong> <em>774 249 724</em> <strong>|</strong><br />
<a href="http://www.webzpravodaj.cz">www.webzpravodaj.cz</a>
</p>

A v praxi vypadá takový podpis následovně:

 3-podpis-vylepseny

Barevný HTML podpis

To už je malinko lepší, využíváme kurzívu, tučné písmo i odkazy. Nyní můžeme přidat barvy. Barvy už jsou ryze záležitostí stylu, nastavíme je tedy pomocí CSS stylů. Jak? 

Mějme obyčejný odstavec <p>Text v odstavci</p>. Protože Thunderbird má výchozí písmo šedé, můžeme chtít podpis výraznější - černý. Do první značky odstavce přidáme atribut " style="" " následovně: <p style="">. Do vytvořených úvozovek již můžeme psát své styly. Pro černý odstavec vyplníme buď "color: black;" nebo "color: #000000;", nabízí se i RGB formát, "color: rgb(0,0,0);". Volba je na vás, já osobně preferuji hexadecimální formát #000000 (zkráceně #000). Odstavec s černou barvou textu bude vypadat tedy takto: <p style="color: #000000;">Text odkazu</p>.

Odkazy uvnitř zůstanou modré. Pokud bychom chtěli změnit i jejich barvu, udělali bychom to stejně jako u odstavce. Pro tmavě šedou barvu by to vypadalo nějak takto:

 <a href="mailto:Tato e-mailová adresa je chráněna před spamboty. Pro její zobrazení musíte mít povolen Javascript." style="color:#333333;">Tato e-mailová adresa je chráněna před spamboty. Pro její zobrazení musíte mít povolen Javascript.</a> 

Velká většina lidí má ale modrou zafixovanou jako barvu odkazu a tak bych doporučil neměnit.

Kód pro podpis s černým písmem je stejný jako u předchozí příkladu, pouze jsme přidali "style="color:#000000" na první řádek.

<p style="color:#000000;">
<em>S přáním pěkného dne,</em><br />
<strong>Tomáš Janeček - webkodér</strong> <strong>|</strong> <a href="mailto:Tato e-mailová adresa je chráněna před spamboty. Pro její zobrazení musíte mít povolen Javascript.">
Tato e-mailová adresa je chráněna před spamboty. Pro její zobrazení musíte mít povolen Javascript.</a> <strong>|</strong> <em>774 249 724</em> <strong>|</strong><br />
<a href="http://www.webzpravodaj.cz">www.webzpravodaj.cz</a>
</p>

A jak vypadá? Lépe.

4-podpis-cerny

Neslaný, nemastný?

A i přesto, že podpis výše je už docela pěkný, ještě by bylo pěkné mu dodat trochu šťávy - nějakou výraznou barvu. Například svítivě zelenou na jedno jediné slovo. Proč ne třeba slovo "webkodér". Jelikož ale není samo v nějaké značce, které bychom dali styl, musíme si onu značku sami přidat - to takovou, která nic nezmění - <span></span>. Spanu pak dáme styl barvy. Svítivě zelená je #99cc33 , velmi podobná (ještě světlejší, na bílé ale špatně čitelná) je barva "lime". Značky "span" musíme dát okolo slova, které budeme obarvovat, stejně jako odstavec někde začíná a končí, i span někde začíná a končí (je párová). Odkaz na WebZpravodaj v plánu původně nebyl, pouze jsem na něm chtěl ukázat možnost odkazů na web, proto jsem v tomto kroku už odstranil.

Kód vypadá přesně takto, jediná změna je opět pouze span a jeho styl:

<p style="color:#000000;">
<em>S přáním pěkného dne,</em><br />
<strong>Tomáš Janeček - <span style="color:#99cc33;">webkodér</span></strong> <strong>|</strong> <a href="mailto:Tato e-mailová adresa je chráněna před spamboty. Pro její zobrazení musíte mít povolen Javascript.">
Tato e-mailová adresa je chráněna před spamboty. Pro její zobrazení musíte mít povolen Javascript.</a> <strong>|</strong> <em>774 249 724</em> <strong>|</strong><br />
<a href="http://www.webzpravodaj.cz">www.webzpravodaj.cz</a>
</p>

4-podpis-skoro-hotov

Obrázek do HTML podpisu

Ať už si vytvoříme nějaký podpis ve PhotoShopu jako jsem to udělal já, nebo chceme použít firemní logo, důležité je, kam jeho soubor uložíte - protože je třeba k němu znát cestu a po dobu využívání podpisu ho nesmíte smazat. Nejlepší je v tomto případě přímo složka Mozilly Thunderbird - nasměrujte se na Tento Počítač => Místní disk (obvykle C:) => Program Files (x86 v 64bitovém Windows) => Mozilla Thunderbird. Když do této složku uložíte svůj obrázek html podpisu, je v bezpečí a nehrozí, že byste jej nechtěně smazali.

Pak už jen stačí přidat krátký kousek kódu do podpisu. Obrázek má značku <img />, je nutné ji ale využívat spolu s atributemsrc="/" ", který udává zdroj obrázku. Pokud jste uložili obrázek do cesty výše zmíněné, tedy C:\Program Files (x86)\Mozilla Thunderbird , stačí přidat tento kód nad odstavec vašeho podpisu. Nemusíte se bát, obrázek se v podstatě odešle jako příloha, jen se jako příloha u HTML mailu nezobrazí, takže bude vidět na všech počítačích.

<img src="file:///C:/Program Files (x86)/Mozilla Thunderbird/obrazek-do-podpisu.png" />

Zbytek zůstává stejný. Celkově tedy

<img src="file:///C:/Program Files (x86)/Mozilla Thunderbird/obrazek-do-podpisu.png" />
<p style="color:#000000;">
<em>S přáním pěkného dne,</em><br />
<strong>Tomáš Janeček - <span style="color:#99cc33;">webkodér</strong> <strong>|</strong> <a href="mailto:Tato e-mailová adresa je chráněna před spamboty. Pro její zobrazení musíte mít povolen Javascript.">Tato e-mailová adresa je chráněna před spamboty. Pro její zobrazení musíte mít povolen Javascript.</a> <strong>|</strong> <em>774 249 724</em> <strong>|</strong><br />
<a href="http://www.webzpravodaj.cz">www.webzpravodaj.cz</a>
</p>

6-podpis-obrazek-nad 

Jak sami vidíte, obrázek je nyní nad podpisem. To může být žádoucí a s podpisem již můžete být spokojeni. Pokud byste jej chtěli dát pod text, stačí celý řádek se značkou <img /> přesunout až na konec kódu za </p>.

Obrázek vedle podpisu 

Pokud ale chcete obrázek vedle svého podpisu (většinou vlevo), je možné obrázku dát styl obtékání podobně jako ve Wordu a výsledku tak dosáhnete. Obtékání nastavíme pomocí stylu "float:left;" u obrázku.

<img style="float:left;" src="file:///C:/Program Files (x86)/Mozilla Thunderbird/obrazek-do-podpisu.png" />
<p style="color:#000000;">
<em>S přáním pěkného dne,</em><br />
<strong>Tomáš Janeček - <span style="color:#99cc33;">webkodér</strong> <strong>|</strong> <a href="mailto:Tato e-mailová adresa je chráněna před spamboty. Pro její zobrazení musíte mít povolen Javascript.">Tato e-mailová adresa je chráněna před spamboty. Pro její zobrazení musíte mít povolen Javascript.</a> <strong>|</strong> <em>774 249 724</em> <strong>|</strong><br />
<a href="http://www.webzpravodaj.cz">www.webzpravodaj.cz</a>
</p>

Obrázek pak bude jednoduše vlevo a text ho bude obtékat.

7-podpis-obrazek-vedle

V tomto případě je odstavec vůči obrázku na nepěkné pozici, proto náš odstavec s podpisem posuneme trochu doprava a dolů. Abychom tohoto efektu dosáhli, obrázku nastavíme odsazení vpravo (margin-right) a odstavci s podpisem odsazení ze shora (padding-top). Za styl margin-right i padding-top vždy dosazujeme číslo v pixelech, např. margin-right: 10px u obrázku znamená, že vpravo od obrázku bude vždy desetipixelová mezera. To samé padding-top: 10px u odstavce, nad odstavcem udělá mezeru 10px. Celý kód pak je následující

<img style="float:left; margin-right: 10px;" src="file:///C:/Program Files (x86)/Mozilla Thunderbird/obrazek-do-podpisu.png" />
<p style="color:#000000; padding-top: 10px;">
<em>S přáním pěkného dne,</em><br />
<strong>Tomáš Janeček - <span style="color:#99cc33;">webkodér</strong> <strong>|</strong> <a href="mailto:Tato e-mailová adresa je chráněna před spamboty. Pro její zobrazení musíte mít povolen Javascript.">Tato e-mailová adresa je chráněna před spamboty. Pro její zobrazení musíte mít povolen Javascript.</a> <strong>|</strong> <em>774 249 724</em> <strong>|</strong><br />
<a href="http://www.webzpravodaj.cz">www.webzpravodaj.cz</a>
</p>

A náš podpis krásný :)

8-podpis-hotovy

 

Testování - správné zobrazení i s vyplým HTML

Když jsme už nějaký podpis vytvořili, není úplně zcestné ho také vyzkoušet. Proto jsem poslal svůj mail z Thunderbirdu na Centrum a Seznam, abych viděl, jak se můj podpis zobrazí třeba tam. A výsledek nepřekvapil.

centrum1

Se zaplým HTML (které v 95% ne-li více zaplé je) se zobrazí takto - téměř identicky. Jediný rozdíl je ve velikosti písma a pozice odstavce, kterou si emailový klient nastavuje sám. I tomu bychom mohli zabránit nastavením stylů, které jsou rozdílné - font-size, line-height apod. To je ale zbytečné, protože i tento podpis je velmi pěkný.

Pokud HTML vypneme, podpis se zobrazí hůře.

centrum2

Můžeme si všimnout, že kde byly tagy <strong> a <em>, jsou nyní hvězdičky namísto strongu a lomítka namísto kurzívy em. I tomu můžeme zabránit - stačí tučné ztučnit pomocí span s určitým stylem (font-weight: bold; font-style: italic;) místo použití elementů <strong> a <em>. Vyzkoušíme a získáme finální kód.

Finální kód

Jak jsme si řekli - nahradíme značky strong a em.

<strong></strong> za <span style="font-weight: bold;"></span> 

<em></em> za <span style="font-style: italic;"></span>

Výsledný kód je pak takovýto:

<img style="float:left; margin-right: 10px;" src="file:///C:/Program Files (x86)/Mozilla Thunderbird/obrazek-do-podpisu.png" />
<p style="color:#000000; padding-top: 10px;">
<span style="font-style italic;">S přáním pěkného dne,</span><br />
<span style="font-weight:bold;">Tomáš Janeček - <span style="color:#99cc33;">webkodér</span> <span style="font-weight:bold;">|</span> <a href="mailto:Tato e-mailová adresa je chráněna před spamboty. Pro její zobrazení musíte mít povolen Javascript.">Tato e-mailová adresa je chráněna před spamboty. Pro její zobrazení musíte mít povolen Javascript.</a> <span style="font-weight:bold;">|</span> <span style="font-style:italic;">774 249 724</span> <span style="font-weight:bold;">|</span><br />
<a href="http://www.webzpravodaj.cz">www.webzpravodaj.cz</a>
</p>

Tento podpis se zobrazí v HTML verzi úplně stejně jako předchozí, tedy takto:

centrum1

Ale i s vyplým HTML se zobrazí správně. Hurá :)

centrum3

 

Závěr

Kvůli využití kódu se může zdát HTML podpis složitý, nicméně není. Jde jen o pár značek/tagů, které je třeba si zapamatovat. Jmenovitě <p></p> pro odstavec, <br /> pro zalomení řádku, <img /> pro obrázek, <a></a> pro odkaz a konečně <span></span> pro naše styly určitých částí (nejen) textu.

Také na internetu existuje řada generátorů, které by starost s kódem měly převzít za vás, nicméně "udělej si sám" je v tomto případě snad i lepší. Pokud nesouhlasíte, jistě nějaký sami najdete.

Ještě jsem nezmínil, že text je možné rozmístit (pozicovat) také pomocí tabulky, to bych doporučil ale pouze při více sloupcích - např. jeden sloupec s kontakty na firmu a druhý s kontakty na autora mailu. U tabulky je pak třeba pomocí stylů odstranit rámečky.

 

 

Přidáno 21.10.2013

Zašedlý podpis v Mozilla Thunderbird

Jak se pan Zdeněk Šták zmínil v komentáři, s poslední aktualizací Mozilly Thunderbird došlo k zašednutí všech HTML podpisů. Problém je způsoben tím, že Mozilla jako společnost se snaží sjednotit jisté systémy v Thunderbirdu a Firefoxu a proto na podpis jakožto méně důležitou část emailu aplikovala průhlednost. 

Řešení spočívá v přidání dalšího kódu do podpisu, který odstraní styly pro průhlednost podpisu pro všechny vaše emaily. Tento kód pak stačí vložit za poslední značku ve vašem podpisu:

<style>
<!--
.moz-txt-sig, .moz-signature { opacity: inherit !important; }
-->
</style>

 Pokud tento kód přidám do podpisu v příkladu výše, kód bude následující:

<img style="float:left; margin-right: 10px;" src="file:///C:/Program Files (x86)/Mozilla Thunderbird/obrazek-do-podpisu.png" />
<p style="color:#000000; padding-top: 10px;">
<span style="font-style italic;">S přáním pěkného dne,</span><br />
<span style="font-weight:bold;">Tomáš Janeček - <span style="color:#99cc33;">webkodér</span> <span style="font-weight:bold;">|</span> <a href="mailto:Tato e-mailová adresa je chráněna před spamboty. Pro její zobrazení musíte mít povolen Javascript.">Tato e-mailová adresa je chráněna před spamboty. Pro její zobrazení musíte mít povolen Javascript.</a> <span style="font-weight:bold;">|</span> <span style="font-style:italic;">774 249 724</span> <span style="font-weight:bold;">|</span><br />
<a href="http://www.webzpravodaj.cz">www.webzpravodaj.cz</a>
</p>

<style>
<!--
.moz-txt-sig, .moz-signature { opacity: inherit !important; }
-->
</style>

Aplikace je tedy skutečně jednoduchá, kód se značkou <style></style> pouze přidáte do kódu vašeho podpisu na úplný konec. 

 

 

Přidáno 7.11.2013

Přidání ikon s odkazy na sociální sítě do HTML podpisu

Pro váš zájem opět rozšiřuji článek o ukázku, jak do podpisu přidat ikonky sociálních sítí s odkazy na vaše profily, kanály nebo kamkoliv jinam. Budeme pokračovat v posledním nejvymakanějším podpisu. Jak si tedy představujeme náš výsledek? Třeba nějak takto...

odkazy1

Abychom tohoto cíle dosáhli, stačí nám pár jednoduchých kroků. Vememe tedy náš HTML kód z předchozích kroků, který je následující:

<img style="float:left; margin-right: 10px;" src="file:///C:/Program Files (x86)/Mozilla Thunderbird/obrazek-do-podpisu.png" />
<p style="color:#000000; padding-top: 10px;">
<span style="font-style italic;">S přáním pěkného dne,</span><br />
<span style="font-weight:bold;">Tomáš Janeček - <span style="color:#99cc33;">webkodér</span> <span style="font-weight:bold;">|</span> <a href="mailto:Tato e-mailová adresa je chráněna před spamboty. Pro její zobrazení musíte mít povolen Javascript.">Tato e-mailová adresa je chráněna před spamboty. Pro její zobrazení musíte mít povolen Javascript.</a> <span style="font-weight:bold;">|</span> <span style="font-style:italic;">774 249 724</span> <span style="font-weight:bold;">|</span><br />
<a href="http://www.webzpravodaj.cz">www.webzpravodaj.cz</a>
</p>

<style>
<!--
.moz-txt-sig, .moz-signature { opacity: inherit !important; }
-->
</style>

V principu přidáme jeden oddíl ( <div></div> ), což si můžete představit jako neviditelný obdélník, do kterého můžeme vkládat jednotlivé ikony (nejenom). Do tohoto obdélníků umístíme jednotlivé odkazy na naše profily sociálních sítí (<a></a> a  místo toho, abychom mezi značky <a></a> napsali text odkazu, vložíme tam obrázek <img />. To je celé. Pouze tomu všemu musíme přidat některé další CSS styly, kterých ale nebude mnoho. Ukažme si rovnou výsledný kód.

<img style="float:left; margin-right: 10px;" src="file:///C:/Program Files (x86)/Mozilla Thunderbird/obrazek-do-podpisu.png" />
<p style="color:#000000; padding-top: 10px; margin: 0px;">
<span style="font-style italic;">S přáním pěkného dne,</span><br />
<span style="font-weight:bold;">Tomáš Janeček - <span style="color:#99cc33;">webkodér</span> <span style="font-weight:bold;">|</span> <a href="mailto:Tato e-mailová adresa je chráněna před spamboty. Pro její zobrazení musíte mít povolen Javascript.">Tato e-mailová adresa je chráněna před spamboty. Pro její zobrazení musíte mít povolen Javascript.</a> <span style="font-weight:bold;">|</span> <span style="font-style:italic;">774 249 724</span> <span style="font-weight:bold;">|</span><br />
<a href="http://www.webzpravodaj.cz">www.webzpravodaj.cz</a>
</p>

<div style="padding-top: 10px;" >
  <!-- Facebooková ikona -->
  <a style="margin-right: 5px;" href="http://facebook.com" title="Můj Můj FaceBook profil"><img src="file:///C:/Program Files (x86)/Mozilla Thunderbird/fb.png" width="32" height="32" /></a>  
  <!-- Google+ ikona -->
  <a style="margin-right: 5px;" href="http://plus.google.com" title="Můj profil Google+"><img src="file:///C:/Program Files (x86)/Mozilla Thunderbird/g+.png" width="32" height="32" /></a>  
  <!-- YouTube ikona -->
  <a style="margin-right: 5px;" href="http://youtube.com" title="Můj YouTube kanál"><img src="file:///C:/Program Files (x86)/Mozilla Thunderbird/yt.png" width="32" height="34" /></a>  
</div>

<style>
<!--
.moz-txt-sig, .moz-signature { opacity: inherit !important; }
-->
</style>

První věc, kterou jsme udělali, bylo přidání do druhého řádku s <p></p> do atributu style="" ještě jeden styl, který je "margin: 0px;" - bez těchto úvozovek, zkrátka přesně tak, jak to vidíte. Tato změna je třeba proto, aby byl podpis zobrazen stejně jak ve webových prohlížečích, tak v emailových klientech jako je třeba právě Mozzila Thunderbird. Jedná se pouze o přípravnou činnost, která je zde nutná.

Druhá věc je přidání vlastních ikon. Nejprve přidáme obalový obdélník, takzvaný div (z anglického division, tedy oddíl). To je následující část kódu

<div style="padding-top: 10px;" > 
 
</div>

Pokud byste se divili, proč je přidaný atribut style="padding-top: 10px;", je to proto, aby byly jednotlivé obrázky sociálních sítí odsazeny o 10 pixelů od odstavce nad ním.

Pak mezi začátení <div ...> a koncovou značku </div> vložíme jednotlivé odkazy (<a></a>). Style="margin-right: 5px;" je nutnost. Slouží k vytvoření mezery široké 5 obrazových bodů mezi jednotlivými ikonami. Pak tu máme ale další 2 atributy, a sice href="/adresa-vašeho-profilu-či-jiného-místa-kam-chcete-ikonou-odkazovat" a title="váš-titulek-ikony-který-se-zobrazí-pokud-na-ni-najedete-myší". Oba tyto atributy si můžete upravit, odkaz si upravit dokonce musíte, protože jistě nechcete odkazovat na titulní stranu facebooku - proč také. Takže do atributu href="/" vložíte mezi úvozovky přesnou adresu např. vašeho facebookového profilu a do atributu title libovolný text, který se bude zobrazovat lidem, kteří na tuto ikonu najedou kurzorem myši. Mezeru mezi <a> a </a> necháme zatím prázdnou, tak přijde až obrázek - samotná ikona.

<div style="padding-top: 10px;" >   
  <a style="margin-right: 5px;" href="http://facebook.com" title="Můj Můj FaceBook profil"></a>   
  <a style="margin-right: 5px;" href="http://plus.google.com" title="Můj profil Google+"></a>   
  <a style="margin-right: 5px;" href="http://youtube.com" title="Můj YouTube kanál"></a>
</div>

Nyní tedy už jen přidáme obrázky, které budou právě ony hezké ikony. Sám jsem nějaké našel na Google obrázcích, upravil je na ideální velikost (32x32 pixelů, standard) a uložil. Klidně si je můžete z následujích 3 obrázků uložit a použít je, nebo si vytvořte vlastní.

fb

g

yt

 

Kód s již přidanými obrázky je následující:

<div style="padding-top: 10px;" >   
  <a style="margin-right: 5px;" href="http://facebook.com" title="Můj Můj FaceBook profil"><img src="file:///C:/Program Files (x86)/Mozilla Thunderbird/fb.png" width="32" height="32" /></a>   
  <a style="margin-right: 5px;" href="http://plus.google.com" title="Můj profil Google+"><img src="file:///C:/Program Files (x86)/Mozilla Thunderbird/g+.png" width="32" height="32" /></a>   
  <a style="margin-right: 5px;" href="http://youtube.com" title="Můj YouTube kanál"><img src="file:///C:/Program Files (x86)/Mozilla Thunderbird/yt.png" width="32" height="34" /></a>
</div>

Já si obrázky uložil do kořenového adresáře Mozilly Thunderbird, která je v C:/Program Files (x86)/Mozilla Thunderbird/. Pokud máte Windows pouze 32bitový, pak v adrese nebude závorka (x86). Cestu ale můžete upravit ku svým potřebám, pokud se ale soubor načítá z vašeho počítače, vždy musí začínat předponou file:///, za níž následuje absolutní cesta. Může to být i adresa na obrázek, který máte uložený např. na vašich webových stránkách - to je na vás. Každopádně je atribut src nesmírně nutné vyplnit a pokud se vám obrázek nebude zobrazovat, hledejte chybu v cestě u tohoto atributu.

Pak je také dobrým zvykem vyplňovat rozměry obrázku. K tomu slouží atributy width (šířka) a height (výška). V našem případě mají obrázky 32 pixelů na šířku i na výšku, YouTube ikona pak na výšku o 2 pixely více kvůli stínu.

Tím jsme ale u konce a náš podpis je zase o něco dokonalejší. Ještě jednou tedy výsledný kód a výsledek...

<img style="float:left; margin-right: 10px;" src="file:///C:/Program Files (x86)/Mozilla Thunderbird/obrazek-do-podpisu.png" />
<p style="color:#000000; padding-top: 10px; margin: 0px;">
<span style="font-style italic;">S přáním pěkného dne,</span><br />
<span style="font-weight:bold;">Tomáš Janeček - <span style="color:#99cc33;">webkodér</span> <span style="font-weight:bold;">|</span> <a href="mailto:Tato e-mailová adresa je chráněna před spamboty. Pro její zobrazení musíte mít povolen Javascript.">Tato e-mailová adresa je chráněna před spamboty. Pro její zobrazení musíte mít povolen Javascript.</a> <span style="font-weight:bold;">|</span> <span style="font-style:italic;">774 249 724</span> <span style="font-weight:bold;">|</span><br />
<a href="http://www.webzpravodaj.cz">www.webzpravodaj.cz</a>
</p>

<div style="padding-top: 10px;" >
  <!-- Facebooková ikona -->
  <a style="margin-right: 5px;" href="http://facebook.com" title="Můj Můj FaceBook profil"><img src="file:///C:/Program Files (x86)/Mozilla Thunderbird/fb.png" width="32" height="32" /></a>  
  <!-- Google+ ikona -->
  <a style="margin-right: 5px;" href="http://plus.google.com" title="Můj profil Google+"><img src="file:///C:/Program Files (x86)/Mozilla Thunderbird/g+.png" width="32" height="32" /></a>  
  <!-- YouTube ikona -->
  <a style="margin-right: 5px;" href="http://youtube.com" title="Můj YouTube kanál"><img src="file:///C:/Program Files (x86)/Mozilla Thunderbird/yt.png" width="32" height="34" /></a>  
</div>

<style>
<!--
.moz-txt-sig, .moz-signature { opacity: inherit !important; }
-->
</style>

 Snad se vám váš nový podpis líbí :)

odkazy1

Ještě bych rád dodal - pokud chcete, aby byly ikony úplně pod vaším podpisem, a to zcela, i pod plovoucím obrázkem (tj. se stylem "float:left", písemena TJ v tomto případě), je nutné přidanému divu přidat ještě styl "clear:both;". To se ale hodí pouze v případě, že máte ikony velké, široké nebo jich je větší počet. V našem případě by to příliš pěkné nebylo - posuďte sami.

odkazy2



Naposledy změněno pátek, 29 srpen 2014 09:53

Zaujal Vás tento článek? Sdílejte ho a šiřte dál...

Tomáš Janeček

Student aplikované informatiky na FIM UHK, nadšený do kódu všeho druhu, tvorby webových aplikací i webdesignu. Vytvořil jsem svůj blog tomasjanecek.cz kam taky občas píšu. Žiju sportem - volejbal, horské kolo, (orientační) běh..., počítači i hraním na sopránové ukulele.



Komentáře   

 
Petra
+2 # Petra 2013-10-15 21:42
Ahoj Tome!

děkuji za Tvůj popis.... napsal jsi vše moc hezky a výstižně! Sice s html bojuji ;), ale podle Tvého návodu to není boj nepříjemný ;) Díky! Ať se Ti daří! :)
P.
Odpovědět | Odpovědět citací | Citovat
 
 
Tomáš Janeček
0 # Tomáš Janeček 2013-10-15 22:38
Ahoj Petro,
chvála se čte vždycky hezky - díky za reakci :) pokud budeš potřebovat pomoc, napiš text a jak ho chceš uspořádat, html kód ti pro to rád napíšu.
Odpovědět | Odpovědět citací | Citovat
 
 
Jirí Chládek
0 # Jirí Chládek 2014-08-31 22:11
Zdravím,

bylo by možné abych Vám zaslal mail s textem a obrázkem a vy mi toto předělal do html? Dost to spěchá. Zaplatit není problém. Děkuji Chládek
Odpovědět | Odpovědět citací | Citovat
 
 
Tomáš Janeček
0 # Tomáš Janeček 2014-09-01 09:00
Dobrý den,
kontaktujte mě prosím na a určitě se domluvíme.
Odpovědět | Odpovědět citací | Citovat
 
 
Zdeněk Šták
+1 # Zdeněk Šták 2013-10-21 16:47
Díky za názorný popis, ale bojuji nyní v Thunderbirdu ještě s jednou věcí. I když mám v html kódu nastaveno písmo podpisu jako černé, tak Thunderbird nyní (po aktualizaci) automaticky podpis změní na šedivý. Poklikáním a vypnutím atributu textu se text změní na černý, ale musí se to provádět u každé nové zprávy. Není možné to změnit někde globálně pro všechny nové zprávy? Děkuji za odpověď.
Odpovědět | Odpovědět citací | Citovat
 
 
Tomáš Janeček
+2 # Tomáš Janeček 2013-10-21 20:30
Ahoj Zdeňku, díky za reakci,
barvou textu v Thunderbirdu se trápit nutně nemusíš. To, co nyní vidíš, je pouze nastavení Thunderbirdu, podpis jako takový se posílá v barvách, který jsi nastavil. Nicméně pokud mail bude prohlížet jiný uživatel Thunderbirdu, uživatel uvidí podpis ve stejných šedých barvách jako ty.

Vše je způsobeno novinkou po aktualizaci, kdy kvůli srovnání jistých stylů Thunderbirdu a Firefoxu Mozzila přidala do podpisů průhlednost.
Pokud se jí chceš zbavit (jistě že), a to tak, aby podpis viděli v požadovaných barvách všichni včetně uživatelů Thunderbirdu, přidej na úplný konec kódu (za poslední značku) Tvého HTML podpisu krátký kód - přidán na konec článku.

Jedná se pouze o styly, které zajistí, že průhlednost se bude dědit, a její výchozí hodnota je 1 (100% neprůhlednost). Tím se vše vyřeší - nyní jsem to testoval.

Článek jsem rozšířil o vyřešené tohoto problému, jelikož by z toho mohl být často řešený problém.
Odpovědět | Odpovědět citací | Citovat
 
 
Zdeněk Šták
+2 # Zdeněk Šták 2013-10-23 12:41
Děkuji za vyřešení problému. Opravdu to funguje a šlo mi právě o ty uživatele Thunderbirdu, kteří by měli podpis šedivý. Ještě jednou děkuji za rychlé řešení.
Odpovědět | Odpovědět citací | Citovat
 
 
Tomáš Janeček
0 # Tomáš Janeček 2013-10-23 13:49
Není zač, jsem rád, že se problém vyřešil :)
Odpovědět | Odpovědět citací | Citovat
 
 
Zdeněk Štuksa
+1 # Zdeněk Štuksa 2013-10-31 15:11
Dobrý den
Bylo by možné zde udělat nějaký podpis, který by obsahoval i ikonky propojené se sociálními sítěmi ?
Například u posledního podpisu, který se mi líbí nejvíce, že by byl ještě jeden řádek kde by byly malé ikonky souciálních sítí. Jako je Facebook, Google + a Youtube. S propojenými odkazy na ně.
Děkuji za informaci a pomoc.
S pozdravem Zdeněk Štuksa
Odpovědět | Odpovědět citací | Citovat
 
 
Tomáš Janeček
0 # Tomáš Janeček 2013-11-07 17:03
Dobrý den Zdenku,
ano, i to je možné a celkem jednoduše. Omlouvám se, že reaguji až teď - byl jsem velmi zaneprázdněn školními povinnostmi, ale nyní jsem snad vše napravil.

Článek jsem rozšířil, aby vám vysvětlil, jak ikony s odkazy přidat :) snad vám to pomůže.
Odpovědět | Odpovědět citací | Citovat
 
 
Aleš
0 # Aleš 2013-12-08 08:27
ahoj,
podpis jsem vyřešil,šlo to ,,sqvjele" i když jsem počítačový analfabet.Mám dotaz,jde použít logo jako vodoznak na celou stránku v mozille,prostě skoro průhledné na pozadí.Díky za odpo Aleš
Odpovědět | Odpovědět citací | Citovat
 
 
Tomáš Janeček
0 # Tomáš Janeček 2013-12-12 21:08
Ahoj Aleši, to už je problém. Musel by se obrázek nastavit na pozadí oblasti, ve které píšeš, což není dost dobře možné žádným jednoduchým způsobem. Nastavit vodoznak do oblasti podpisu by bylo jednodušší, protože tam jsi pánem HTML kódu ty - v textové části mailu ale ne.
Odpovědět | Odpovědět citací | Citovat
 
 
Tomáš
0 # Tomáš 2014-01-06 10:24
Dobrý den.
Děkuji moc za perfektní návod. Pro Thunderbird jsem si díky němu udělal podpis podle svých představ.
S vytvořením podpisu po mě chtějí pomoct i kolegové, kteří používají Outlook v MS Office 2013 a tam se mi nedaří.
Ve zprávě i když je zvolený formát zprávy html tak se vždy zobrazí text tak jak je v html kodu psán.. prostě např toto:


S přáním pěkného dne,
Tomáš Janeček - webkodér | | 774 249 724 |
www.webzpravodaj.cz


Nevíte kde coa jak vOutloku nastavit?
Děkuji. Tomáš
Odpovědět | Odpovědět citací | Citovat
 
 
Tomáš
0 # Tomáš 2014-01-06 10:36
aha tak i tady se podpis zobrazuje správně (pominu li obrázek) Vložil jsem do textu dotazu přímo html kod včetně tagů, chtěl jsem Vám ukázat co se mi vkládá v outlooku, ale asi rozumíte co mám na mysl
Odpovědět | Odpovědět citací | Citovat
 
 
Tomáš Janeček
0 # Tomáš Janeček 2014-01-06 13:43
Dobrý den, s OutLookem vám bohužel nepomůžu - nemám jej nainstalovaný.
Odpovědět | Odpovědět citací | Citovat
 
 
Zdenka
0 # Zdenka 2014-01-09 10:19
Ahoj,
v e-mailu mám nastavený obrázek jako podpis. Při posílání se mi zobrazuje správně. Problém je v tom, že pokud mi někdo, většinou je to někdo ze seznamu, na e-mail odpoví, podpis (obrázek) se už nezobrazí, ale připojí se do přílohy. Je to tím, že ten na druhé straně nepoužívá žádný e-mailový prohlížeč? Dá se to nějak vyřešit?

Díky Zdenka
Odpovědět | Odpovědět citací | Citovat
 
 
Tomáš Janeček
0 # Tomáš Janeček 2014-01-15 02:17
Ahoj Zdenko, to je tím, že email pravděpodobně druhá strana nemá dostatečně kvalitního emailového klienta nebo má vyplé HTML zobrazení mailů. S tím ze své strany nic nezmůžeš.
Odpovědět | Odpovědět citací | Citovat
 
 
Peter
0 # Peter 2014-01-14 11:00
Ahoj,
chcem sa spýtať či je možné zmeniť veľkosť písma.
Príklad:
" S pozdravom Dedo Mráz" ( štandardná veľkosť písma)
"Hračkárstvo južný pól" ( menšia veľkosť písma)
Ďakujem za odpoveď
Odpovědět | Odpovědět citací | Citovat
 
 
Tomáš Janeček
+1 # Tomáš Janeček 2014-01-15 02:22
Ahoj Peter,
je to jednoduché. To, co chceš mít jinou velikostí písma, obal do span nebo do odstavce p a jako atribut mu dej style="font-siz e: 20px;" nebo jakoukoliv jinou velikost, která ti bude vyhovovat. Standardní bude asi 13px, opět záleží na emailovém klientovi, ty si ji ale můžeš přizpůsobit. Do span můžeš obalit klidně i jedno jediné písmenko a změnit jeho velikost (font-size: 10px), barvu (color: green), odsazeni, posunutí... vše co CSS dovoluje :)
Odpovědět | Odpovědět citací | Citovat
 
 
Peter
0 # Peter 2014-01-15 06:44
Ahoj,
ešte raz ďakujem za odpoveď, ale mám ďalšiu otázku:
môžem si zmeniť aj štyl písma a tiež ako si dokážem spraviť tabuľku, ktorú spomínaš vyššie a rozmiestniť v nej text.
Ďakujem za odpoveď.
Odpovědět | Odpovědět citací | Citovat
 
 
Tomáš Janeček
0 # Tomáš Janeček 2014-01-30 00:08
Tabulka má velmi jednoduchý princip a určitě pomůže www.jakpsatweb.cz/tabulky.html. Tabulka jako taková má obal v podobě tagu "table", ten musí obsahovat řádky "tr" a v každém řádku je dobré mít nějaké buňky "td", kolik jich bude, je jen na tobě. Všechny řádky ale musí obsahovat stejný počet buněk, pokud buňky neslučuješ pomocí atributu colspan. Krásně vysvětleno na odkazu výše, Jak Psát Web.

Pak může nastat problém a to ten, že bude vidět ohraničení buněk tabulky. Pak je potřeba přidat atribut "style" tabulce i všem buňkám "td". Vše co musí nutně obsahovat je "border: none;", to je klíčové, tím se totiž zbavíme ohraničení. Celý atribut pak tedy vypadá takto: style="border: none;" .

Rozmístění pomocí tabulky jsem do článku přidávat už nechtěl, jelikož to znamená příliš mnoho HTML kódu a další styly na odstranění rámečků a ještě třeba odsazení.

Co se týká změny stylu písma, stačí do atributu "style="..."" připsat: font-family: "Tahoma", sans-serif; nebo třeba: font-family: "Times", serif; .
Je dobrý zvykem napsat na prvním místě název fontu, který chceš použít, a na posledním generickou rodinu zvoleného fontu, tedy serif pro patkové písmo (Times New Roman třeba) a sans-serif pro bezpatkové (např. Arial).

Snad to takhle stačí :-)
Odpovědět | Odpovědět citací | Citovat
 
 
Daniel Vondrák
+2 # Daniel Vondrák 2014-02-03 20:09
Chci touto cestou vyjádřit poděkování Tomáši Janečkovi, který mně během 3 dní (a to se ještě omlouval za zpoždění :-) ) poslal kompletní HTML kód celkem komplikovaného podpisu do Thunderbirdu. Je vidět, že jde o zapáleného fanouška, systematického mladého kluka - studenta. Radost číst jeho stránky. Přeji mnoho úspěchů v životě a ještě jednou - děkuji ...
Odpovědět | Odpovědět citací | Citovat
 
 
Tomáš Janeček
0 # Tomáš Janeček 2014-02-03 20:52
Rádo se stalo a taky díky :-)
Odpovědět | Odpovědět citací | Citovat
 
 
David
0 # David 2014-04-02 20:42
Milý Tomáši, jsem Ti velice zavázán za perfektní návod na tvorbu podpisu s logem firmy. Díky Tvému zdrojovému kódu se mi vše podařilo vytvořit cca za několik minut. Pokud bych měl vše programovat, (programování je pro mne neprobádaný vesmír) ztratil bych min celý den. Až budeš nakupovat auto a budeš potřebovat radu, rád pomohu. Jsem Tvůj dlužník. Hezký večer.
Odpovědět | Odpovědět citací | Citovat
 
 
Tomáš Janeček
0 # Tomáš Janeček 2014-04-02 20:59
Ahoj Davide, díky za chválu :)
Auto plánuju až za pár let a jak tak čtu autoforum.cz, měl bych jasno celkem rychle... a nakonec stejně skončím s Octavií jako celá naše rodina. Každopádně ještě jednou díky a užívej si podpisu, snad bude sloužit.
Odpovědět | Odpovědět citací | Citovat
 
 
Lukáš Petránek
0 # Lukáš Petránek 2014-06-03 22:29
Ahoj Tomáši,
Mohl bych na tebe mít prosbičku jestli by si mi neposlal HTML kód který by sloužil jako podpis v thunderbirdu? Vše bych ti poslal e-mailem. Pokud by si byl tak hodný komunikuj prosím se mnou e-mailem . Zatím moc díky za čas L
Odpovědět | Odpovědět citací | Citovat
 
 
Petr Jiránek
0 # Petr Jiránek 2014-06-23 21:22
Ahoj Tome,
objevil jsem hezké rozšíření do ThunderBirdu: https://addons.mozilla.org/cs/thunderbird/addon/signature-switch/, umožňuje přepínat přednastavené podpisy nezávisle na účtu. Možná by jsi to mohl doplnit do článku, nebo udělat pokračování. Dají se hezky využít tvoje návody.
Petr
Odpovědět | Odpovědět citací | Citovat
 
 
Tomáš Janeček
0 # Tomáš Janeček 2014-07-09 20:55
Ahoj, díky, do dalšího článku jej možná zahrnu. Uvidíme, nechci článek zbytečně natahovat.
Odpovědět | Odpovědět citací | Citovat
 
 
Michal R
+1 # Michal R 2014-07-08 11:12
Díky moc Tomáši za vaše návody. Jsou napsané opravdu blbovzdorně, což dokládá fakt, že jsem si udělal podpis s obrázkem sám :) Ještě jednou díky moc.
Odpovědět | Odpovědět citací | Citovat
 
 
Tomáš Janeček
0 # Tomáš Janeček 2014-07-09 20:54
Není zač :) brzy chystám rozšíření článku, tento návod je vzhledem k své jednoduchosti částečně limitovaný podporou emailových klientů, abych byl konkrétní, OutLook jej nebere tak úplně jak bychom si přáli.
Odpovědět | Odpovědět citací | Citovat
 
 
Samy
+1 # Samy 2014-11-28 13:24
Strašně moc děkuji. Toto je nejgeniálnější článek (popis a návod), jak na to! Seš borec, že sis s tím dal tahkle práci. Díky. S.
Odpovědět | Odpovědět citací | Citovat
 
 
Tomáš Janeček
0 # Tomáš Janeček 2015-03-27 10:01
Díky! Je to jen jednoduchý základ, který má také své proti (třeba v outlooku obrázek obtékat nebude), proto už dlouho chystám pokračování, ale stále jsem nenašel čas ho napsat.
Odpovědět | Odpovědět citací | Citovat
 
 
Jan Březina
0 # Jan Březina 2015-03-28 08:05
Dokonalý popis! Díky
Odpovědět | Odpovědět citací | Citovat
 
 
jandis
0 # jandis 2015-04-13 09:11
Dobrý den,

děkuji za Váš návod na napsání podpisu. S jednou věcí ale stále bojuju.. Potřebuju nastavit velikost a barvu textu současně a pořád mi to nejde.. Prosím Vás o radu, děkuji, Jandis. :-)
Odpovědět | Odpovědět citací | Citovat
 
 
Tomáš Janeček
0 # Tomáš Janeček 2015-04-13 17:56
Dobrý den,
"nejde" je dost široký pojem, pokud je to prostý text v odstavci, stačí do atributu style u odstavce napsat něco jako color:#000000;f ont-size:14px; a musí to fungovat. Pokud jsou v odstavci ale další elementy, např. odkazy, na které se má styl včetně velikosti a barvy písma vztahovat také, u odkazů je typické, že potřebuju barvu předefinovat i pro samotný odkaz.
Odpovědět | Odpovědět citací | Citovat
 
 
jandis
0 # jandis 2015-04-14 08:25
Dobrý den,
děkuji za odpověď, zřejmě jsem někde dělal chybu, teď už je to v pořádku.
Ještě jednou děkuji, přeji hezký den a vše dobré.
Jandis 8)
Odpovědět | Odpovědět citací | Citovat
 
 
CHINA WHOLESALE
0 # CHINA WHOLESALE 2015-06-04 12:27
a musí to fungovat. Pokud jsou v odstavci China Wholesaler http://www.gift-stor.com/ ale další elementy, např. odkazy, na které se má styl včetně velikosti a barvy písma vztahovat také, u odkazů je typické, že potřebuju barvu předefinovat i pro samotný odkaz.
Odpovědět | Odpovědět citací | Citovat
 
 
Ondřej
0 # Ondřej 2015-07-21 15:01
Dobrý den,
prosím poraďte - příliš se v takových věcech nevyznám. Lze vložit obrázek (firemní logo) nad automatický podpis (text) v emailu přes webové rozhraní, Pokud ano - nevíte jak? Neznám nikoho kdo by dokázal poradit, snad budete vědět jak, jste velmi erudovaný odborník. Děkuji
Odpovědět | Odpovědět citací | Citovat
 
 
Andrej
0 # Andrej 2015-08-03 15:54
Ahoj ,
dik za navod je vidiet , ze si fachman , ale ja si s tim neviem radi . V outlooku som podpis nastavil jednoducho , ale firemny podpis nastavit v thunderbirde ja fakt na mna komplikovane .
Nevedel by si mi s tim prosim pomoct , podpis ti viem poslat na email . Za odpoved vopred dik.
S pozdravom
Andrej
Odpovědět | Odpovědět citací | Citovat
 
 
true
0 # true 2015-08-22 09:15
After opening the celine outlet and unfurling the poor thing,goyard outlet upon closer inspection,Gius eppe Zanotti I noticed some things I didn’t see in the listing online
Odpovědět | Odpovědět citací | Citovat
 
 
haf
0 # haf 2015-09-27 14:44
Dobrý den,
E-maily z Thunderbirdu s takto vloženým obrázkem dostávají od spamassassinu dost velkou penalizaci:
* 2.1 HTML_IMAGE_ONLY _12 BODY: HTML: images with 800-1200 bytes of words
Naše firemní logo má 3009 byte a rozměr 154 x 50 bodů.
Nevíte někdo, co s tím?
Odpovědět | Odpovědět citací | Citovat
 
 
reflective vest
0 # reflective vest 2016-05-17 10:42
To je opravdu skvělé, že jsem hledat pro celou tuto dobu. naprosto úžasné a já stále ptají, jak mohu navštívit tento web
Odpovědět | Odpovědět citací | Citovat
 
 
Blanka
+2 # Blanka 2016-07-16 00:23
Dobrý den, právě jsem po několika hodinách vyrobila podpis i s logem podle svých představ, bez Vás by to nebylo možné. Moc děkuji za pomoc!
Odpovědět | Odpovědět citací | Citovat
 
 
RF
0 # RF 2017-02-02 14:06
Mockrát děkuji za návod, našel jsem tam jen drobnou chybku:

"font-style italic" by mělo být "font-style: italic"

Každopádně ještě jednou mockrát díky :-)
Odpovědět | Odpovědět citací | Citovat
 
 
žanet
0 # žanet 2017-04-06 12:35
Dobrý den,

prosím kde si to mohu v gmailu nastavit, abych text podpisu mohla psát v HTML ?

Děkuji moc za odpověď
Žanet
Odpovědět | Odpovědět citací | Citovat
 
 
Johnny
0 # Johnny 2017-05-16 01:58
What's up i am kavin, its my first time to commenting anyplace, when i
read this paragraph i thought i could also make comment due to this good paragraph.
Odpovědět | Odpovědět citací | Citovat
 
 
FreddieStroh
0 # FreddieStroh 2017-06-21 20:32
I see your page needs some fresh articles. Writing manually is time consuming, but there is solution for this
hard task. Just search for; Miftolo's tools rewriter
Odpovědět | Odpovědět citací | Citovat
 
 
Anemonalove
0 # Anemonalove 2017-07-05 07:33
Hello guys! Who wants to chat with me? I have profile at hotbabescams.co m, we can chat, you can watch me live for free, my nickname is Anemonalove , here is
my pic:

https://3.bp.blogspot.com/-u5pGYuGNsSo/WVixiO8RBUI/AAAAAAAAAFA/JWa2LHHFI2AkHParQa3fwwHhVijolmq8QCLcBGAs/s1600/hottest%2Bwebcam%2Bgirl%2B-%2BAnemonalove.jpg
Odpovědět | Odpovědět citací | Citovat
 
 
Anemonalove
0 # Anemonalove 2017-07-07 21:50
Hi fellas! Who wants to meet me? I'm live at HotBabesCams.co m, we can chat,
you can watch me live for free, my nickname is Anemonalove ,
here is my photo:

https://3.bp.blogspot.com/-u5pGYuGNsSo/WVixiO8RBUI/AAAAAAAAAFA/JWa2LHHFI2AkHParQa3fwwHhVijolmq8QCLcBGAs/s1600/hottest%2Bwebcam%2Bgirl%2B-%2BAnemonalove.jpg
Odpovědět | Odpovědět citací | Citovat
 
 
Anemonalove
0 # Anemonalove 2017-07-09 22:16
Hello fellas! Who wants to meet me? I have profile at HotBabesCams.co m, we can chat,
you can watch me live for free, my nickname is Anemonalove , here is my photo:

https://3.bp.blogspot.com/-u5pGYuGNsSo/WVixiO8RBUI/AAAAAAAAAFA/JWa2LHHFI2AkHParQa3fwwHhVijolmq8QCLcBGAs/s1600/hottest%2Bwebcam%2Bgirl%2B-%2BAnemonalove.jpg
Odpovědět | Odpovědět citací | Citovat
 
 
Rose1979
0 # Rose1979 2017-07-26 06:44
Hi admin, do you monetize your webzpravodaj.cz ?
There is easy way to earn decent money every day, just search
on youtube - How to earn with wordai 4
Odpovědět | Odpovědět citací | Citovat
 
 
Ondřej
0 # Ondřej 2017-07-31 14:10
Díky moc, skvělý článek :)
Odpovědět | Odpovědět citací | Citovat
 
 
bit.ly
0 # bit.ly 2017-08-03 03:32
Hi there! This is my 1st comment here so I just
wanted to give a quick shout out and say I truly enjoy
reading through your posts. Can you suggest any other blogs/websites/ forums
that deal with the same topics? Thanks a ton!
Odpovědět | Odpovědět citací | Citovat
 
 
website
0 # website 2017-08-03 05:38
wonderful publish, very informative. I wonder why the opposite experts
of this sector do not realize this. You should proceed
your writing. I'm confident, you have a huge readers' base already!
Odpovědět | Odpovědět citací | Citovat
 
 
76Selene
0 # 76Selene 2017-08-06 20:36
Hello admin, i must say you have high quality posts here.
Your page can go viral. You need initial traffic only.
How to get it? Search for: Mertiso's tips go viral
Odpovědět | Odpovědět citací | Citovat
 
 
86Alexander
0 # 86Alexander 2017-08-08 13:20
I see you don't monetize your site, don't waste your traffic, you can earn extra cash every
month because you've got high quality content.

If you want to know what is the best adsense alternative,
search in google: adsense alternative Mertiso's tips
Odpovědět | Odpovědět citací | Citovat
 
 
86Kina
0 # 86Kina 2017-08-09 07:12
I see you don't monetize your page, don't waste your traffic,
you can earn additional bucks every month because you've got hi quality content.
If you want to know what is the best adsense alternative, type in google: adsense
alternative Mertiso's tips
Odpovědět | Odpovědět citací | Citovat
 
 
www.monplawiki.com
0 # www.monplawiki.com 2017-08-09 23:03
Now, what correspondents experimented with glean a little
coming from Staff Sky’s limited media contact on the relax evening, Brailsford
accused a cyclingnews.com author, Barry Ryan, involving “engraving shit about [him]” also reported him he or she stayed don't include by listen in for you to Froome
for the reason that line innovator chatted in order to television set means.
That happened following a comparable instance while
using website’s publisher Daniel Benson past from the
run. - www.monplawiki.com
Odpovědět | Odpovědět citací | Citovat
 
 
boule-dauborn.de
0 # boule-dauborn.de 2017-08-10 14:52
In this article, so writers attemptedto glean anything via Workforce Sky’s control media contact for the rest day time, Brailsford
accused a cyclingnews.com article author, Craig Ryan, of “contact shit regarding [him]” next warned him he / she was present prohibited via listen closely
for you to Froome for the reason that people
innovator spoke for you to tv set wall plug. To stretched
after having a similar show with all the website’s editor Daniel Benson ahead inside the people.
- boule-dauborn.de
Odpovědět | Odpovědět citací | Citovat
 
 
rssnews.it
0 # rssnews.it 2017-08-10 15:01
In this article, what correspondents attempted to glean a thing coming from Staff Sky’s limited media access within the
place evening, Brailsford accused a cyclingnews.com article writer,
Craig Ryan, of “producing shit about [him]” as well as warned him he / she was left out by pay attention to be able to Froome
for the reason that race chief conversed for you to telly passages.
In which occurred from a similar instance with all the website’s manager
Daniel Benson past inside the pursuit. - rssnews.it
Odpovědět | Odpovědět citací | Citovat
 
 
www.liveinternet.ru
0 # www.liveinternet.ru 2017-08-10 16:08
Right here, seeing that correspondent experimented with glean a
thing by Team Sky’s limited media read around
the balance period, Brailsford accused a cyclingnews.com article author, Barry Ryan, connected with
“record shit around [him]” and passed on him he /
she was real banished through listen closely to Froome since the nation head chat to help
television stores. To turned up from a similar show while using the website’s publisher Daniel Benson ahead inside contest.
- www.liveinternet.ru
Odpovědět | Odpovědět citací | Citovat
 
 
alm01.tlgroup.co
0 # alm01.tlgroup.co 2017-08-10 16:25
In this article, when journalists attempted to glean a little from Group Sky’s restriction media entry for the place day time, Brailsford accused a
cyclingnews.com author, Craig Ryan, connected with “engraving shit around
[him]” with advised him he / she became banished via pay attention to be able to Froome because line
leader told for you to television pipes. That reached following a equivalent episode with all the website’s publisher Daniel
Benson ahead inside contest. - alm01.tlgroup.co
Odpovědět | Odpovědět citací | Citovat
 
 
oscarotero.com
0 # oscarotero.com 2017-08-16 13:49
Right here, since reporter attemptedto glean a little from Group Sky’s restriction media admittance around the break
evening, Brailsford accused a cyclingnews.com author,
Barry Ryan, associated with “recording shit approaching [him]”
and showed him he or she was alive rejected coming from hearing for you
to Froome because nation chief talked in order to telly channels.
To approached from related show while using website’s
publisher Daniel Benson earlier inside race. - oscarotero.com
Odpovědět | Odpovědět citací | Citovat
 
 
rssaggregator.com
0 # rssaggregator.com 2017-08-16 15:26
Here, so surgeons attemptedto glean anything from Party Sky’s control
media accessibility within the place period, Brailsford accused a cyclingnews.com author,
Craig Ryan, involving “produce shit on [him]” in addition to narrated him
he or she happened banished by hearing to be able to Froome since the battle boss tell
to tv set channels. Of which reached following a identical show with
all the website’s manager Daniel Benson past within the race.
- rssaggregator.com
Odpovědět | Odpovědět citací | Citovat
 
 
www.meetme.com
0 # www.meetme.com 2017-08-16 15:49
Right here, so surgeon attemptedto glean somewhat through Side Sky’s control media read about the rest period,
Brailsford accused a cyclingnews.com article writer, Barry Ryan, connected with “carving shit approaching [him]” after that notified him he or she lived don't include coming from listen closely in order to Froome
for the reason that people chief chatted in order to tv stores.
That will went after having a related episode with all the website’s publisher Daniel Benson before in the battle.
- www.meetme.com
Odpovědět | Odpovědět citací | Citovat
 
 
boom beach hacks
0 # boom beach hacks 2017-08-20 00:36
Utilize Gunboats to provide support on the ground troops.
Odpovědět | Odpovědět citací | Citovat
 
 
www.histurion.pl
0 # www.histurion.pl 2017-08-21 14:42
Right here, so surgeon experimented with glean rather through
Players Sky’s limited media access for the place day, Brailsford accused a cyclingnews.com author, Craig Ryan, of “recording shit regarding [him]” as
well as notified him he or she ended up being banished coming from listen in to Froome as the people head chatted in order to tv holes.
Of which fell following a identical instance while using the
website’s publisher Daniel Benson past from the competition. - www.histurion.pl
Odpovědět | Odpovědět citací | Citovat
 
 
Www.mates.pl
0 # Www.mates.pl 2017-08-21 15:00
Now, when reporter attemptedto glean anything by Crew Sky’s restriction media admittance
for the support day, Brailsford accused a
cyclingnews.com article author, Craig Ryan, involving “entering shit around [him]” after that recognized him he lived left out coming from hearing to help Froome because nation innovator tell to help tv set pipes.
To occurred after having a identical event using the website’s editor Daniel
Benson earlier inside chase. - Www.mates.pl
Odpovědět | Odpovědět citací | Citovat
 
 
pt.glosbe.com
0 # pt.glosbe.com 2017-08-21 16:37
Below, while journalists attemptedto glean a bit by Group Sky’s limited media gain access to within the
sleep day, Brailsford accused a cyclingnews.com author, Barry Ryan, regarding “contact shit
about [him]” with warned him he happened excluded from
hearing to be able to Froome because nation leader chat for you to
telly wall plug. To went after a equivalent episode with the website’s editor
Daniel Benson earlier inside pursuit. - pt.glosbe.com
Odpovědět | Odpovědět citací | Citovat
 
 
smacznego.pl
0 # smacznego.pl 2017-08-21 18:02
Right here, while journalists attempted to glean somewhat coming from Staff
Sky’s restriction media read within the balance day time, Brailsford
accused a cyclingnews.com article author, Craig Ryan, connected with “entering shit
about [him]” along with ordered him he remained prevented by listening in order to Froome
since the competition leader talk for you to tv set passages.

That will took place following a identical instance with the website’s manager Daniel
Benson before inside pursuit. - smacznego.pl
Odpovědět | Odpovědět citací | Citovat
 
 
http://chess24.com/
0 # http://chess24.com/ 2017-08-21 18:04
In this article, since writers experimented with glean a little via Crew Sky’s control media read
around the break evening, Brailsford accused a cyclingnews.com copy writer,
Barry Ryan, connected with “generating shit approaching
[him]” along with instructed him he or she stayed stopped
by tune in to help Froome since the line head
address to help tv set markets. In which occurred from a similar show while using the website’s manager Daniel
Benson past inside contest. - http://chess24.com/
Odpovědět | Odpovědět citací | Citovat
 
 
www.serenada.pl
0 # www.serenada.pl 2017-08-21 19:45
Right here, as reporters experimented with glean rather by Staff Sky’s restriction media accessibility within the
support morning, Brailsford accused a cyclingnews.com writer, Barry Ryan,
connected with “contact shit about [him]” then showed him he
was present eliminated by hearing to help Froome because the people head converse for you to tv set markets.
To took place from related episode while using the
website’s publisher Daniel Benson past in the nation. - www.serenada.pl
Odpovědět | Odpovědět citací | Citovat
 
 
nba live mobile game
0 # nba live mobile game 2017-08-22 14:03
Together with earning players and coins in the sets.
Odpovědět | Odpovědět citací | Citovat
 
 
Rssaggregator.com
0 # Rssaggregator.com 2017-09-04 14:07
The following, so surgeon attempted to glean a little through Staff
Sky’s control media access on the relaxation period, Brailsford accused a cyclingnews.com
copy writer, Barry Ryan, regarding “carving shit regarding [him]” also recognized
him he or she was present left out from listening
in order to Froome because nation boss tell to help telly holes.
That befell following a identical instance with the website’s editor Daniel Benson before inside battle.
- Rssaggregator.com
Odpovědět | Odpovědět citací | Citovat
 
 
Mylekis.wip.lt
0 # Mylekis.wip.lt 2017-09-04 15:16
The following, when surgeon attemptedto glean one thing through Party Sky’s
restriction media contact on the relaxation time,
Brailsford accused a cyclingnews.com article writer,
Barry Ryan, regarding “creating shit regarding [him]” next explained to him he / she was alive excluded via hearing to help Froome for the reason that contest innovator conversed to be able to telly instruments.
Of which reached from equivalent event with all the website’s editor Daniel Benson earlier in the line.

- Mylekis.wip.lt
Odpovědět | Odpovědět citací | Citovat
 
 
www.thefullyield.com
0 # www.thefullyield.com 2017-09-04 15:30
Here, what reporter attemptedto glean a little from Workforce Sky’s limited media admittance
about the break day, Brailsford accused a cyclingnews.com article
author, Craig Ryan, involving “contact shit on [him]” with recounted him he or she existed rejected by
listen closely to Froome as the battle head chatted for you to
box holes. Of which turned up from a related event while using website’s publisher Daniel Benson past inside the
event. - www.thefullyield.com
Odpovědět | Odpovědět citací | Citovat
 
 
86Orval
0 # 86Orval 2017-09-05 09:08
I have noticed you don't monetize your website, don't waste your traffic, you can earn extra cash every month because you've got high quality content.
If you want to know how to make extra $$$, search for: best adsense alternative Wrastain's tools
Odpovědět | Odpovědět citací | Citovat
 
 
trove buy flux
0 # trove buy flux 2017-09-09 17:14
I know thіs web site рresents quality depending articfles
ɑnd extra data, iѕ there ɑny other weeb site which givges thesе
information in quality?
Odpovědět | Odpovědět citací | Citovat
 
 
broderie
0 # broderie 2017-09-18 00:51
I think what you posted was very logical. However, what about this?
what if you wrote a catchier post title? I ain't suggesting your content is not good., however suppose you added something to possibly
grab people's attention? I mean HTML podpis e-mailu s grafickým obrázkem v Mozilla Thunderbird is a
little boring. You should peek at Yahoo's home page and see how they write
article headlines to get people to open the links.
You might add a video or a related pic or two to grab people
interested about what you've got to say. In my opinion, it might bring your posts a little bit more interesting.
Odpovědět | Odpovědět citací | Citovat
 
 
Pastor OSAS Ben.
0 # Pastor OSAS Ben. 2017-09-28 18:35
Naléhavě potřebujete peníze? Můžeme vám pomoci!
Jste v současné situaci v potížích nebo vás hrozí v potížích?
Tímto způsobem vám dáváme možnost vyvíjet nový vývoj.
Jako bohatá osoba cítím povinnost pomáhat lidem, kteří se snaží, aby jim poskytli šanci. Každý si zaslouží druhou šanci a od té doby, co vláda selže, bude muset pocházet od ostatních.
Žádná částka není pro nás příliš šílená a splatnost, kterou určíme vzájemnou dohodou.
Žádné překvapení, žádné další náklady, ale jen dohodnuté částky a nic jiného.
Už nečekejte a komentujte tento příspěvek. Uveďte částku, kterou chcete požádat, a my vás budeme kontaktovat se všemi možnostmi. kontaktujte nás dnes na

Naléhavě potřebujete peníze? Můžeme vám pomoci!
Odpovědět | Odpovědět citací | Citovat
 
 
FirstGeoffrey
0 # FirstGeoffrey 2017-09-30 06:44
I have noticed you don't monetize your website, don't waste your traffic, you can earn extra cash every month because you've got hi quality
content. If you want to know how to make extra bucks, search for: Mrdalekjd
methods for $$$
Odpovědět | Odpovědět citací | Citovat
 
 
cheap car insurance
0 # cheap car insurance 2017-10-08 09:27
auto insurance quotes
cheap auto insurance
the general car insurance
auto insurance
Odpovědět | Odpovědět citací | Citovat
 
 
zithromax z-pak
0 # zithromax z-pak 2017-10-10 07:25
buy zithromax 500mg online
buy zithromax
buy zithromax 500mg online
generic zithromax
Odpovědět | Odpovědět citací | Citovat
 
 
zithromax antibiotic
0 # zithromax antibiotic 2017-10-11 04:01
buy zithromax 500mg online
generic zithromax
zithromax z pak
zithromax 500 mg
Odpovědět | Odpovědět citací | Citovat
 
 
FirstVenus
0 # FirstVenus 2017-10-14 01:44
I have noticed you don't monetize your site, don't waste your traffic, you can earn additional cash every month because
you've got hi quality content. If you want to know how to make extra bucks, search for: Mrdalekjd methods
for $$$
Odpovědět | Odpovědět citací | Citovat
 
 
homescapes mod apk
0 # homescapes mod apk 2017-10-16 19:19
Above: Playrix's Homescapes is a brand new game.
Odpovědět | Odpovědět citací | Citovat
 

Přidat komentář

Bezpečnostní kód Obnovit