понедельник, 25 апреля 2011 г.

Нашел описание нового шаблона Blogger в Google Groups

Наконец-то. At every level of the HTML template you will find a common construct of elements that, for lack of a snappy name, I will term the “outer / cap / fauxborder / inner” construct, or OCBI. This set of elements will allow you to consistently apply various styling techniques to particular pieces of the template.

Для чего нужны fauxcolumns
code
Youtube

воскресенье, 24 апреля 2011 г.

Справочник CSS и форумы Styling help for CMS

Помимо генератора (так себе), здесь интересен форум Styling help for CMS, blogs and social network sites such as Drupal, Wordpress, Joomla, Friendster, MySpace...
Кроме того, интересен дизайн кнопок меню и панель социальных сетей...
Есть и руководство для начинающих, причем внимание уделяется и описаниям философии построения CSS таблиц Basic steps to build a site from a design
#primary a {
-moz-border-radius: 0 0 7px 7px;
-webkit-border-radius: 0 0 7px 7px;
border-radius: 0 0 7px 7px;
text-shadow: 1px 1px 1px white;
}
#primary a {
color: #50A4AB;
font-weight: bold;
border: solid 1px #CCC;
background: url(/sites/all/themes/csscr_six/images/buttonslice.png) repeat-x;
margin: 0;
padding: .5em .5em .3em .5em;
line-height: 2em;
text-decoration: none;
}

среда, 20 апреля 2011 г.

Шпаргалки для блоггера на русском

В "Шпаргалке для блоггера" есть хорошие посты про форматирование, js скрипты, AJAX загрузка страниц, даже оптимизация. Здесь ссылка на код для скругления углов (клик по картинке)

Вот еще один хороший блог с переводами
"Data tags for layouts", "Widget Tags for Layouts",
 "Page Elements Tags for Layouts" от izhurnal

А вот генератор кода углов, теней,
градиентов, прозрачности CSS3

вторник, 19 апреля 2011 г.

Разные шаблоны для разных страниц Blogger (1)


Менять шаблон конечно нельзя. Но можно не показывать отдельные блоки на разных типах страниц. Согласно справочному руководству Blogger (клик по картинке) есть три типа страниц: index, item, arhive. Потом появились еще static_page статичные страницы (на сегодня их можно добавлять до 10 штук). И, наконец, вот оно - счастье, можно использовать условие по URL, оно подойдет и для конкретных статичных страниц, и для страниц по меткам... (надо, кстати, попробовать,  как работают страницы с URL, содержащими "? ")
Не следует забывать, что помимо условия "==" есть еще "=!"..., посмотреть примеры использования условий "b:if" можно в любом (собственном) штатном шаблоне Blogger. 
Вот пример c CSS...,  боковая панель загружается
 в броузер и не отображается. Не лучший вариант...
<b:if cond='data:blog.pageType == quot;static_page quot;'>
<style type="text/css">
#sidebar-wrapper{display:none;}
.post {width:680px;}
</style>
</b:if >
<b:if cond='data:blog.pageType ==quot;static_pagequot;>
Static Pages
</ b: if>
<b:if cond='data:blog.url == 'Specific_Post_Url>
This will appear on the page specific posts
</ b: if>
Осталось только выяснить, перед какими тегами "div" нужно всатвлять условия "b:if", но этот вопрос не кажется сложным..., потому пвернемся к нему позже. А вот вопрос о том, как задавать условие для страниц с ярлыками остается открытым, здесь не него пытались ответить, но не получилось. А вот здесь автор подал идею, как использовать URL адрес метки, вот фрагменты кода с не очень понятными тегами...

понедельник, 18 апреля 2011 г.

Условное форматирование изображений в Blogger


......
.h40 {
height: 40px;

]]></b:skin>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<style type='text/css'>
.h40 {
height: 150px;
} </style>
</b:if>

На главной странице картинка поста не должна быть большой, а вот на отдельной странице ее можно развернуть во всю ширь, вернее "высь". Для этого можно задать несколько новых классов, допустим h0 h40 h200 h400 и переприсвоить их в шаблоне Blogger в зависимости от вида страницы. Если присваивать изображению сразу два класса (клик по картинке), то можно менять не только размер, но и выравнивание, например... вот вставка в шаблон ("мой" одна колонка) дополнительного класса .h40 и условия b:if  
Поскольку оболочка b:skin может быть только одна, то приходится после нее вставлять тег таблицы стилей и переопределять класс. Название класса, кстати, должно начинаться с буквы..., и все надо бы включать в CDATA...
А вот (не очень удачный) пример использования условий в шаблоне блоггер.
Они интересуют нас только как шаблоны кода, поскольку
Blogger с тех пор внедрил сплиттер "Read more".
Как создавать расширяемые краткие описания сообщений?Условные CSS

SDKs & Tools › Tools from Facebook

Building an app on Facebook gives you the opportunity to deeply integrate into the core Facebook experience. Your app can integrate with many aspects of Facebook.com, including the News Feed and Notifications. All of the core Facebook Platform technologies, such as Social Plugins, the Graph API and Platform Dialogs are available to Apps on Facebook.com
Getting Started › Apps on Facebook

Getting stock information with YQL and open data tables

One question that the YQL and Pipes teams get asked is “how can I get stock quotes? There isn’t an API for it on developer.yahoo.com”. Interestingly, while there isn’t a more traditional web service API, Yahoo finance does provide a very nice way to get a lot of well structured information on a given company. For example, here’s Yahoo finance page on Yahoo

Yahoo! Query Language (YQL) platform

The Yahoo! Query Language (YQL) platform enables developers to query, filter, and combine data across the web.
The YQL Web Service enables applications to query, filter, and combine data from different sources across the Internet. Overview