Здесь попытаюсь собрать понравившиеся мне элементы форматирования.
Таблицы.
Чтобы таблица отображалась правильно, в html коде нужно убрать все элементы форматирования (переводы строк и пробелы)
| HDD | WD Caviar 3.1Gb | 85$ |
|---|
| Quantum FB ST 6.4Gb | 110$ |
Текст кода приведенной выше таблицы:
<table border="1">
<tbody>
<tr>
<th rowspan="2">HDD</th>
<td>WD Caviar 3.1Gb</td>
<td align="right">85$</td>
</tr>
<tr>
<td bgcolor="#ccffff">Quantum FB ST 6.4Gb</td>
<td align="right">110$</td>
</tr></tbody>
</table>
<table border="1">
<tbody>
<tr>
<td valign="top">r1c1</td>
<td valign="top">r1c2</td>
</tr>
<tr><td valign="top">r2c1</td>
<td valign="top">r2c2</td>
</tr>
</tbody></table>
| Title | Format |
|---|
| r1c1 | r1c2 |
| r2c1 | r2c2 |
| r3c1 | r3c2 |
| r4c1 | r4c2 |
| Итого | 50 000.00 |
<table class="table">
<thead><tr><th>Title</th><th>Format</th></tr></thead>
<tbody>
<tr class="odd"><td valign="top">r1c1</td><td valign="top">r1c2</td></tr>
<tr class="even"><td valign="top">r2c1</td><td valign="top">r2c2</td></tr>
<tr class="odd"><td valign="top">r3c1</td><td valign="top">r3c2</td></tr>
<tr class="even"><td valign="top">r4c1</td><td valign="top">r4c2</td></tr>
</tbody>
<tfoot><tr><td>Итого</td><td>50 000.00</td></tr></tfoot>
</table>
Выделение блока кода
<pre class="brush: cpp; toolbar: true;" >
#include <stdio.h>
int main()
{
printf ("Hello Popcorn!\nThis cool!\n");
return 0;
}
</pre>
Оформление ссылок:
<table border="0">
<tbody>
<tr>
<td valign="top"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh1vWbwZ84iH5fS9nfWMqtNqk4_FAVsiG4wb2yJPOt2K0G5ahg1yFxVC1uxaffJxJyaPSjxNhw1imlDz5jXYzED_UcTwNyZat0x1GgRYjGWMmkugBGcyY4SGygtp7ULEAv_Uescf7Bfaoaw/s320/notification-network-wireless.png" style="float: left; height: 32px; margin: 0pt 10px 10px 0pt; width: 32px;" /></td>
<td valign="top">
<ul><h4>Подзаголовок</h4>
<li><a href="http://www.ru">ссылка1</a></li>
<li><a href="http://www.ru">ссылка2</a></li>
</ul>
</td>
</tr>
</tbody>
</table>
Разделитель в виде тонкой горизонтально черты:
<hr size="1" width="90%" align="center" color="gray">
Иконки
<img style="float:left; margin:0 10px 10px 0;width: 32px; height: 32px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEheJltH1YdV0DN7317oK46GUFwb6v7l2fV5KbjTgk2sytiwhu2kHiaEfZhQNtxLG2V7X3YK9fmao04en5exbeUAds02yWo4z8Lz9hp8Ca5PK7JhVEy_Syhw1zBDX3bLgadbQfD28VLXoZeh/s320/stock_contact.png" border="0" />
<img style="float:left; margin:0 10px 10px 0;width: 32px; height: 32px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiVO6PRjSQyMolZNNIsFRnZgcUQxNElgCx-sfMLBqLphBRPmMCKb9JVowXSPQInAbfWbOnEV4QhjkoH5mZm9YDXcgnxkEToKnl7ZI8_McvU2bLMQbu9W_SQIg8RXJK-Wbxj9VhGYs73dyRq/s320/mail-attachment.png" border="0" />
<img style="float:left; margin:0 10px 10px 0;width: 32px; height: 32px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiSSIsGVapOakKfONkPhjp32r8gXQlE_o-PIzWh7kjIrZ_7cqXq9OXQ39pLM86GzH7zVT9zrYuoek4aBqU561K6VuUr0aUTrMzXJSae83n4owNWMaBanRrN0ai0TadLCTpoGCV24eRDQnuc/s320/error.png" border="0" />
<img style="float:left; margin:0 10px 10px 0;width: 32px; height: 32px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiuu7Uqr37Lw2YJgA24qOxn80N8zrBrw9K833Gz9cCpcUZoseyZZilTXmj-xPxmYZGvNcOYR_Ngt-iA8JXOEiY8NK8eQNq0ODR5YkRcVCekP_AX3F67ybvrSDTuKpdVn12qwWI5zTB1Gayj/s320/dialog-warning.png" border="0" />
<img style="float:left; margin:0 10px 10px 0;width: 32px; height: 32px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg0MavLHAbupNHrvuTQgX7wbonPU-U7BM2yv7VYgIl_12V54DAQuztYNjs2e5dOJ0jlkc3KVX2F0ZYdDJUQ3xuCOKUZ7a4ZQpdO4aQPsFN5dlEnhZKQLo3PIKfSHCOsa4aYNLoJ_mL8fQ67/s320/dialog-question.png" border="0" />
<img style="float:left; margin:0 10px 10px 0;width: 32px; height: 32px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh1vWbwZ84iH5fS9nfWMqtNqk4_FAVsiG4wb2yJPOt2K0G5ahg1yFxVC1uxaffJxJyaPSjxNhw1imlDz5jXYzED_UcTwNyZat0x1GgRYjGWMmkugBGcyY4SGygtp7ULEAv_Uescf7Bfaoaw/s320/notification-network-wireless.png" border="0" />
<img style="float:left; margin:0 10px 10px 0;width: 32px; height: 32px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj3UdGPAAg-HouJGZneq41hHhuo5tLNj-P6fxO7OPm0gKG6QUfpfdaa_kdFs_OdiLBcMtSjum608QfgTNC3T1lZ6swg07_rrbv57TP58TUQkUl2pd-pIZf7HFGL_420CnBzmPIXm7uWl3Oq/" border="0" />
Изображение
<img style="float:center; width: 210px; height: 210px;" src="http://www.via.com.tw/en/images/products/mainboards/mini_itx/epia_m2/epia_m2.jpg" />
Облако тегов
http://www.bloggerbuster.com/2008/08/blogumus-flash-animated-label-cloud-for.html
Автоперевод
http://blogger-toolkit.blogspot.com/2007/11/add-translate-buttons-to-your-blog.html
Изображение клавиши в тексте: Fn
Изменить шаблон. После описания
body {.........}
добавить
kbd {color: #940f04;background:#EEEEEE none repeat scroll 0 0;border-color:#CCCCCC #AAAAAA #888888 #BBBBBB;border-style:solid;border-width:1px 2px 3px 2px;color:#000000;padding: 1px 2px;white-space:nowrap;margin: -7px 2px;}
В заметке для изображения клавиши вставить теги
<kbd>Fn</kbd>
Ссылка на форум
<div class="separator" style="clear: both; text-align: center;"><a href="http://antisclerosis.forumup.com/" imageanchor="1" target="_blank" style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEizarhlu9d4D1UIX6Hya1wRd8PeZyVDtxoaMlmo4BBtaw79nIfnMXBFdJD2FQcYc5qsFNYwUX-OjEucdP4k2AvXj7wjQPrzUo5MZTnXnXBpa0d4Iy2743scdD6_ZAXQQUfsizMj4eNK5Dv5/" /></a></div><div class="separator" style="clear: both; text-align: left;"></div>
Всплывающие картинки
Перед <b:skin><![CDATA[/* вставить следующий код:
<script src='http://oryctolagus89.fileave.com/highslide-full.js' type='text/javascript'/><link href='http://oryctolagus89.fileave.com/highslide.css' rel='stylesheet' type='text/css'/><!--[if lt IE 7]> <link rel="stylesheet" type="text/css" href="http://ezany99.fileave.com/highslide-ie6.css" /> <![endif]--><script type='text/javascript'>//<![CDATA[hs.graphicsDir = 'http://oryctolagus89.fileave.com/graphics/';hs.wrapperClassName = 'borderless';hs.allowSizeReduction = false;hs.showCredits = false;hs.registerOverlay({ html: '<div class="closebutton" onclick="return hs.close(this)" title="Close"></div>', position: 'top right', fade: 2 });hs.isUnobtrusiveAnchor = function(el) { if (el.href && /\.jpg$/.test(el.href)) { el.className = 'highslide'; return 'image'; }}//]]></script><script type='text/javascript'>//<![CDATA[function fixBloggerImages(searchFor, replaceWith) { var href; var anchors = document.getElementsByTagName("a"); for(var i = 0; i < anchors.length; i++) { href = anchors[i].href; if(href.indexOf(searchFor) != -1) { anchors[i].href = href.replace(searchFor, replaceWith); anchors[i].setAttribute("onclick", "return hs.expand(this)"); anchors[i].setAttribute("class", "highslide"); anchors[i].setAttribute("title", "Click to enlarge"); } } }//]]></script>
В посте картинка отображается так:
<a href="http://img.jpg" class="highslide" onclick="return hs.expand(this)"><img src="http://img.jpg" title="Кликни на картинку и она увеличится" width="75" border="0" height="100" /></a>
Вот что получается:
Плеер музыки:
<div class="powerpress_player" id="powerpress_player_6111"><object type="application/x-shockwave-flash" data="http://www.howdyland.com/wp-content/plugins/powerpress/audio-player.swf" id="6111" height="24" width="290"> <param name="movie" value="http://www.howdyland.com/wp-content/plugins/powerpress/audio-player.swf" /><param name="FlashVars" value="playerID=6111&soundFile=http://www.humyo.com/10042037/03-Porcelain.mp3?dl=1&bg=E5E5E5&width=290&rtl=no&loader=009900&text=333333&titles=Moby&animation=yes&track=FFFFFF&tracker=DDDDDD&border=CCCCCC&initialvolume=60&leftbg=CCCCCC&lefticon=333333&voltrack=F2F2F2&volslider=666666&rightbg=B4B4B4&rightbghover=999999&righticon=333333&righticonhover=FFFFFF&transparentpagebg=yes" /><param name="quality" value="high" /><param name="menu" value="false" /><param name="wmode" value="transparent" /></object></div>
Wide Editor (широкий редактор)
Достал, прямо скажу, редактор blogger в виде замочной скважины. Вот нашел:
http://userstyles.org/styles/3797
Для использования нужно установить в firefox plugin stylish
