Просто скопипастил шаблон блога "Trader" и вставил его в блог "Forex". В результате все заработало, но Блоггер потребовал заголовок для виджета HTML/JavaScript... Задачка решилась при вставке пустого тега <span > </span>
Однако, можно (и нужно) подправить сам шаблон... Рецепты есть на форуме
Оставлю, пожалуй, здесь всё, как было... а вот в блоге я попробовал подобрать приличное горизонтальное меню. Пришлось сделать несколько вставок в файл menu.css Кроме того, в сам файл шаблона вставил вот это.
С этой навязчивой идеей я решил исследовать стили шаблона с одной колонкой (родной гугловский шаблон этого блога). Представьте, в частности, что горизонтальное меню (navbar) этого блога "прилепелно к верхнему краю страницы... (Посмотрите на картинке слева) Надо же сделать "просвет"... Итак, исследуем код страницы с помощью FireBug.
Вот блоки горизонтального меню:
<div id="HTML1" class="widget HTML">
<div class="widget-content">
<div id="menu">
<!-- id="menu" это уже блок не блоггера,
а плагина JQuery -->
А вот стили для них:
#main .widget {
padding-bottom:10px;
margin-bottom:20px;
border-bottom:dotted 1px $bordercolor;
clear: both;
}
Вопросы, возникшие у меня при изучении шаблона (вот он полность, кстати ):
1) в таблице CSS задан стиль для класса "widget", а в коде есть class= "widget HTML", но нет просто класса "widget"... Стоп..., припоминаю, кажется здесь присвоение сразу двух классов... в одних кавычках через пробел... ?
2) что такое clear: both; эта строчка встречается очень часто..., все лень посмотреть...
А мне нужно исправить следующие недостатки посредством CSS: Штрих линия - убрать вообще,
В процессе редактирования стилей шаблона, я обнаружил, что кнопка AddThis, которую я поместил в строку других иконок (почта, редактирование) под постом, выше на целых 5 пикселей, что выглядит гм...гм неэргономично...
Зраво поразмыслив, я решил, что надо бы родные блоггеровские иконки переместить наверх..., а под постом хорошо бы смотрелся ряд иконок-ссылок на социальные сервисы и закладки. Получил вот этот код на AddThis. Вставил под старым, просто окружил тегами "span", в результате блок div разворотил мне всю строку, но это не страшно (см. первый пост)...
Зато теперь можно добавить любое количесвто иконок в любом порядке, вот только где я могу найти их названия? Во-первых, на сайте есть хороший хелпер, а вот сюрприз sirprise
Посмотрим на шаблон этого блога. Вот весь п. Мои комментарии в тексте выделены красным шрифтом. Обратим внимание, что в-основном используются ID и классы, а для блока "outer-wrapper" есть два определания стиля, здесь странные идентификаторы вроде $endSide - это переменные, которые определяются в шаблоне (XML) Блоггера:
<Variable name="startSide" description="Start side in blog language"
type="automatic" default="left" value="left">
<Variable name="endSide" description="End side in blog language"
type="automatic" default="right" value="right">
Толковых описаний языка я так и не нашел, но из картинок понятно, что по умолчанию значения соответствуюе "left" "right", ...а вот как их можно менять, использовать? Может быть посмотрим код уже сформированной страницы блога. Прояснится что-нибудь...?
Посмотрел... Нет, скорее запутает... Оказалось, что блок "outer-wrapper" находится сразу внутри body, а элемента с ID="layout" вообще не видать в сформированном коде HTML. Ну ладно, пока не очень то и хотелось..., нам до завтра надо перечисленные баги исправить, а не шарады разгадывать.
Перекур. Вместе с сигаретными канцерогенами в башку заскакивает паскудная мыслишка.
Экспериментируя с форматированием, я решил вставлять стили в теги, используя style="...". Потом посмотрел раздел "Шрифты и цвета" и понял, что можно (точнее-нужно) подобрать цвет фона и блоков под цвета Navbar, это проще, чем возится с картинками и CSS горизонтального меню Apicon. Значит, нужно будет в каждом написанном посте заменять атрибуты style на class. Утомительное это дело... Так что надо скорее сочинить свои классы и прописать их в таблице стилей Блоггера... И этим я займусь сразу после ловли CSS-багов... Дураков работа любит...
Опять пост получился не о том, о чем соирался писать... Переделать заголовок
Это как же здорово получилось, две картинки - снимки верхней части и футера страницы этого блога встроенный редактор так здорово сжал, что они сцепились так, что и не определишь, что это два нестыкующихся кусочка одного поста, добавим было в код ссылки каждого кусочек кода (тип class="top_up"). Однако, в Picasa стоят скрипты, блокирующие всплывающие окна (см. код):
class="tu_iframe_800x600" открывается было окно, но быстро потом открывается в той же вкладке, даж при наличии в коде target="_blank"
class="top_up" - виснет намертво так, что все ссылки (со всеми классами) не работают
target="_blank" - без определения свойств класса работает, как положено
Код с теми же классами из Navbar работает, а ссылки на Пикасу подвешивают скрипты TopUp... Ничего не остается, как использовать target="_blank"... Стоп, стоп, стоп... А если я буду открывать этот (к примеру) пост во фрейме, то, при клике по превью-картинке, во фрейме откроется каринка, а как вернуться от нее назад к тексту? Кнопок то для возврата нет... Получается, что в эти посты лучше вставлять картинки такого размера, чтобы их не надо было увеличивать.... Либо найти другой сервис... картинок..., угу, можно же встаdлять картинки прямо из сети по URL..., к примеру, из Jino... Тогда можно и не сохранять их на винчестер... Интересная мысль, однако. Надо будет попробовать.
Вообще-то я начал этот пост, чтобы перечислить проблемы с настройками форматирования этого блога. Они перечислены на картинках. Так что кликните по превьюшкам обязательно. Откроются в новых вкладках (окнах). О том, как решать CSS рроблемы, вот в этом следующем посте.
На сайте можно выбрать и настроить вариант горизонтального меню. Вот инструкция под дальнейшей настройке. "
Весь код размещен в трех файлах (два скрипта и один css) для области head и ненумерованного списка ссылок в горизонтальном виджете
Я разместил скрипты сначала на сервисе dropbox, но поскольку там со внешними прямыми ссылками есть ограничения, то экспериментировать проще с
И провел я чудные 2 часа, загрузил все меню сначала к в компьютер, а потом в народ. Подставлял новые ссылки в шаблон и рассматривал разные меню. Надоеллллло.... Эксплорер не хочет закрывать ТопАп окна, по клику на кресте, но делает это клавишей "Escape"... "Escape from New York" was one of the first video, vhich I had seen... Past Indefinite or Past Perfect?... I forgot... forget-forgot-forgotten... hrrrrrrrrrrrrrr... what is the russian for "to be asleep"
<span class='post-icons'>
<!-- AddThis Button BEGIN --> <span class='item-action'><a class='addthis_button' expr:addthis:title='data:post.title' expr:addthis:url='data:post.url'><img alt='Bookmark and Share' class='icon-action' height='16' src='http://s7.addthis.com/static/btn/v2/lg-share-en.gif' style='border:0' width='125'/></a>
<script src='http://s7.addthis.com/js/250/addthis_widget.js#username=xa-4b9e29d7648d250b' type='text/javascript'/></span>
<!-- AddThis Button END --> <!-- email post links -->
При формировании кнопки сервис выдает код в блоке <div> Нашел в шаблоне место (выделено синим) и вставли туда код, скопированный со
Потом заменил div на span (как в шаблоне) и добавил классы для ссылки и картинки (выделено цветом).
Поскольку в дальнейшем надо будет попробовать сервис статистики, то вот пришлось всё это записать.
