Два способа показа плейлистов YouTube c TopUp

<a class="tu_iframe_658x514" href="http://www.youtube.com/p/8E2C31534A35768A&amp;hl=nl&amp;fs=1&amp;rel=0&amp;hd=1&amp;autoplay=0" style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em;" toptions="x=10"><img height="160" src="http://soft-portable.ru/wp-content/uploads/2010/08/youtube_2-300x241.jpg" width="200" /></a>

Настройки показа плейлистов YouTube для TopUp можно делать двумя способами. И через фреймы и через topoptions в теге ссылки. Все работает! Вот только с подбором размеров... окна, вроде бы, лучше использовать tu_iframe_658x514..., хотя..., не факт. Надо еще поэкспериментировать.

Вот, как это работает для варианта с toptions (код внизу)

<a href="http://www.youtube.com/p/8E2C31534A35768A&amp;hl=nl&amp;fs=1&amp;rel=0&amp;hd=1&amp;autoplay=1" style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em;" toptions="width = 670, height = 510,x=10,layout=flatlook, resizable=1, type = flash, title = Blogger - Настройки"><img alt="Youtube" height="160" src="http://soft-portable.ru/wp-content/uploads/2010/08/youtube_2-300x241.jpg" width="200" /></a>

Примеры показа Видео в TopUp (слегка устарели)

<div class="media">
<noindex><a class="tu_iframe_853x510"
href="http://www.youtube.com/embed/aQEpRyNkESE"
toptions="x=10"
</noindex></div>

Откуда я взял  примеры настройки всплывающих окон? Надо вспомнить, или погуглить... Ага, да это код самой страницы сайта Apycom. Код примера под катом.
А что устарело? Дело в том, что для вставки в блог видео с YouTube теперь исеользуется тег iframe, а не object, как раньше. Но оказалось, что можно просто воспользоваться настройками TopUp для фреймов.
Во-первых, нужно поменять размеры (tu_iframe_853x510).
Во вторых, надо задать toptions="x=10"  для левого верхнего угла окна...

Прячем Google navbar, заголовок и освобождаем место для TopUp

Берем за основу шаблон Корпорация "Чудеса" из нового (сервиса) дизайнера шаблонов Блоггера.
Во вкладке "Дополнительно" находим опцию "Добавить CSS" и сдвигаем весь блог вправо, прячем панель Google navbar и название блога.

.content-inner {float: right;}
#navbar {height: 0px; visibility: hidden; display: none;}
#header {height: 0px; visibility: hidden; display: none;}

Опции настройки TopUp окон_2

<a href="/images/photos/1.jpg" class="top_up">
<img src="/images/thumbnails/1.jpg"/>
</a>
Вместо class="top_up" можно вставить
 toptions="shaded = 1, overlayClose = 1"

Теперь надо понять, как настраивать TopUp окна, дабы всплывали они слева, а не в центре, как регулировать их размеры..., и, наконец разобраться с типами содержимого, которое они могут показывать... Читаем документацию на сайте

<script type="text/javascript">
TopUp.addPresets({
"#images a": {
group: "images",
layout: "quicklook",
modal: 0
},
".shaded": {
shaded: 1
}
});
</script>

Эта функция создает обертку сразу для трех изображений, дабы показать их, как слайдшоу... Помимо функции TopUp.addPresets, там есть еще  десятка два функций..., пока не до них, разберемся сначала с опциями..., для этого есть Демо-страничка..., оказывается, помимо картинок, фреймов и плееров, есть еще типы HTML, DOM, AJAX, script... Как они работают?
Чтобы

Как легко заметить, в "toptions", перечисляются опции, полный список и назначение которых можно увидеть на сайте разработчика..., а теперь представьте, что я вы захотели настроить с десяток опций? Каждый раз вносить их в код? Нет, можно использовать jscript и настроить все для любого CSS класса, поэтому и используется скрипт...

<div class="media"><a href="photos/2.jpg" class="tu_ql"><img src="thumbnails/2.jpg"/></a><noindex>
<a href="http://yaaho.com/" class="tu_iframe_800x600" target="_blank" rel="nofollow">
<img src="thumbnails/2.jpg"/></a>
</noindex>
</div><div class="text">text </div>
<div class="code">Текст перед ссылкой <noindex><a class="tu_iframe_800x600" href="http://www.cfin.ru/management/iso9000/newtqm/glava1/list1_2.shtml?printversion" rel="nofollow" target="_blank">ссылка</a></noindex>
</div><div class="text"><a href="http://www.youtube.com/v/pv8j1-IcnUE&amp;hl=nl&amp;fs=1&amp;rel=0&amp;hd=1&amp;autoplay=1" toptions="width = 853, height = 505, type = flash, title = Beastie Boys - Sabotage"><img alt="Youtube" src="/images/thumbnails/youtube.jpg?1285257116" /></a></div>