Недавно узнал об jQuery библиотеке, которая является очень простым и легковесным аналагом jQuery UI (функционал правда слабее). Библиотека называется JQuery Tools, а подробно я хотел бы остановиться на создании с помощью нее табов. JS-движок табов занимает всего 3.3 Kb.

Делаются табы с помощью спрайта, в котором создаются шаблоны разной длины, чтобы покрыть как короткий так и длинный текст в заголовке таба. Делаются в 3-х экземплярах:

1. Активный таб
2. При наведении
3. Таб в пассивном состоянии

Процесс создания табов

1. Создание спрайта. Спрайт создал в фотошопе. GIMP что-то для меня остается пока загадкой (Да и разбираться нет желания).

2. Создается CSS файл. Здесь тоже сложного ничего нет, единственные хлопоты – вычислить координаты каждого шаблона. Пример CSS файла возьмите в тестовых примерах – http://flowplayer.org/css/tabs.css

3. html код. Выглядит он так:

<!-- the tabs -->
<ul class="tabs" id="my_tabs">
<li><a href="#">Tab 1</a></li>
<li><a href="#">Tab 2</a></li>
<li><a class="w4" href="#">Длинный заголовок в табе</a></li>
</ul>

<!-- tab "panes" -->
<div class="panes" id="my_panes">
<div>First tab content. Tab contents are called "panes"</div>
<div>Second tab content</div>
<div>Third tab content</div>
</div>

Обратите внимание. Если текст в заголовке большой, то применяйте соответствующий класс (w1,w2,w3,w4 и т.д.) Читать далее »

По неоднократным просьбам, которых я уже получил наверное штук 7, я решил сделать версию моего плагина к Вордпресс «AD|LABS.индикатор», которая не зависит ни от одной CMS.

Да, получился автономный скрипт, который можно установить к себе на денвер, или залить в «секретную папку» на вашем хостинге.

Буду краток, вот видюха, как работает скрипт в автономном режиме:

Демка тут:

http://www.samborsky.com/adlabs_indicator_script/

Качаем сорцы отсюда:

http://www.samborsky.com/wordpress/747/
Читать далее »

«AD|LABS.индикатор» – Это отдельный скрипт а также плагин/виджет для WordPress.

Он по домену/ссылке определяет основные сео-параметры сайта. Полный список того, что он определяет, смотрите тут.

1. Скачать
2. Установка
3. Использование
4. Список сервисов
5. История версий
6. Системные требования
7. Скриншоты

Скачать

В качестве отдельного скрипта (нужен только PHP версии 5.2.0 и выше)

В качастве плагина/виджета для WordPress

Прежде всего хочу поблагодарить Димокса за то, что он подгоняет мне хороших клиентов, которые четко знают чего они хотят и платят сопоставимые моим трудам деньги. Буду стараться платить тебе, Димокс той же монетой.

В этот раз клиент уместил свое техническое задание в четыре пункта:

Нужно написать небольшой плагин Tell a Friend (отсылка ссылки на пост другу) для WordPress.

1. Линк на попап окно, который можно вставить к каждому посту.
2. В новом окне: форма с полями имя маил друга, имя маил отправителя, текстовое поле и сбоку  идет область где виден текст который вводится в текстовом поле как привью.
3. Также есть кнопка добавить еще маил, и имя друга. Когда нажимают на нее появляется 2 новых поля маил и имя друга максимум 5 таких.
4. После заполнения всех полей отправляется сообщение на маилы с данными человека который послал письмо его сообщение и ссылка на пост.

Вполне подойдет доработать плагин wp-email

Я не охотно берусь за доработку чужих плагинов, потому сперва думал как поступить: влезть в код wp-email, или создать отдельный плагин, который использует настройки плагина wp-email. Разумно было выбрать второе, учитывая, что на официальном сайте wp-email автор часто делает несовместимым свой плагин с старыми версиями вордпресса.

Я уже знаю, что лучше сделать универсальное, под все версии движка, чем заниматься переделками в будущем, пусть даже за деньги.

Итак на разработку у меня ушел один рабочий день, и незначительное время на исправления и доработку в следующие. Читать далее »

Написал этот скрипт уже давненько, но все никак не выложу. Точней я давно написал функцию проверки сайта в DMOZ каталоге, а обертку только сейчас сделал. Функция была частью проекта, который развалился так и не начавшись.

Что за проект? Кому интересно расскажу: заказали мне полный аналог i.pr-cy.ru, т.е. той панельки, которая многим не дает покоя (стабильно мне предлагают ее написать, но больше 300$ никто не дает), мне этот проект вполне по зубам (даже лучше могу сделать), все функции в отдельности написаны, осталось только собрать все в одном проекте, сделать аккаунты пользователей, поставить лимиты на проверки и т.д. Но неожиданно заказчик решил отказаться от моих услуг. В общем хозяин-барин, жаль что предоплату не взял сразу. Кстати кому нужна такая панелька, радующая множество веб-мастеров, пишите, с удовольствием доделаю тот проект, который оцениваю в 300-500$ (в зависимости от подробностей).

Как работает скрипт?

Он берет домен, подставляет его в качестве параметра для поиска в DMOZ, к примеру:

http://search.dmoz.org/cgi-bin/search?search=samborsky.com

После чего парсит результаты поиска, и возвращает количество совпадений. Для моего блога результат 1, для yandex.ru – 53, для сайта не в dmoz.org – 0. По моему так повеселей, чем показывают все чекеры в той же сапе или в j2j (Да/Нет).

Важное замечание

Как всегда сайты с www. и без него – это разные вещи. Потому если вашего сайта нет в DMOZ, в то время, как вы уверены что он там есть – проверьте, правильно ли задали имя домена. Читать далее »

Рано или поздно в веб-программировании сталкиваешься с необходимостью вывести диалог выбора цвета (по забугорному colorpicker). Вещь в принципе распространенная, потому не удивительно что под наш любимый jQuery уже созданы готовые плагины. В этой статье я сделаю небольшой обзор существующих jquery-плагинов для выбора цвета и остановлюсь на некоторых из них.

Колорпикеры я бы разделил на два типа

1. Палитра
2. Каталог цветов

Читать далее »

Начну с того, что я не все выполненные заказы анонсирую на блоге. Этой «чести» удостаиваются только интересные, сложные, масштабные заказы. Данная работа пожалуй претендует только на интересную. Сложной назвать не могу.

Задача стояла такая:

Разработать для футбольного блога плагин для WordPress «Информер футбольной таблицы». Владелец блога должен иметь возможность редактировать таблицу ч-з админку.

Предусмотреть страницу, на которой читатели блога смогут самостоятельно выбрать цвет фона и шрифта для таблицы и получить информер в виде html кода.

Админка

Как я считаю удобна. При клике на любой <input type=»text» /> текст в нем пропадает. Так же можно в без перезагрузки страницы удалить лишние строки и добавить новые. Все это сделано с использованием jquery.

Читать далее »

Помню что это был 2002-й, когда я окончил школу с уклоном в физику, математику и информатику.  У нас в школе был очень популярен паскаль и особенно делфи. Естественно что мне тоже довелось узнать что это такое, и я сразу возненавидел это говно: делфи и паскаль. За их тормознуть, за то, что программы весят мегабайты, что компоненты не подходят под разные версии делфи и кучу всего другого, которое уже и не вспомню.

На тот момент мой одноклассник, показал мне что такое ассемблер, нас тогда привлекало то, что оконную windows-программу можно уместить в 1 кб. Со временем мы решили создать сайт посвященный ассемблеру. Но стал вопрос как создать сайт. Учитывая, что я умел на тот момент создавать html страницы, знал что такое CSS, то за создание сайта отвечал я. Но html-сайт нас сразу не устраивал, хотелось чего-то крутого, с голосованием, комментариями и т.п.

Как сейчас я вспоминаю тогда я и узнал что «крутые» сайты пишут либо на  PHP либо на Perl. Начал изучать и то и другое, Perl практически сразу забросил, потому что на тот момент его синтаксис мне, человеку привыкшему к паскалю был сложен. Получилось в итоге вот что: asm.fatal.ru. Сайт я делал, когда мне было около 17 лет, так что критика не принимается. Контакты на сайте не действительны, не пишите по ним.

Отмечу что все что там есть написано было с нуля, CMS там не используется, потому что я даже не знал что это такое в то время. Отмечу что ссылки вида /index.php?page=programs я так же придумал сам. Тогда мне казалось это просто гениальным изобретением, ведь можно написать один php файл и использовать его как шаблон. Голосование так же сделал я сам с нуля, чем гордился тогда. Все каменты, посты хранятся по сей день там в файлах, потому что mysql на фрихостинге не было, да и я не знал что это такое. Жаль одно.  Доступ к сайту я потерял очень давно. У fatal.ru были сбои, и они сменили пароли. А новых я не дождался. Читать далее »

Все мы любим большие красивые шапки на сайтах. Если шапка красиво отрисована, она привлекает новых посетителей. Встречают ведь, как говорится, по одежке…

Но насколько удобны сайты с большими шапками? Мне кажется что не очень удобно листать их страницы , потому что постоянно нужно крутить колесо мыши вниз, чтобы добраться до контентной части сайта.

Предлагаю свое решение данной проблемы

Автоскроллинг на JavaScript. Суть моего решения такова, что я просто прокручиваю шапку. Но только для внутренних страниц. Учитывая, что большинство новых посетителей приходят на сайт ч-з главную, то шапка на ней должна быть видна, дадим пользователю насладится ею.

Делается автоскроллинг с помощью очень простого jQuery скрипта. Просто вставьте его в любое место html кода (желательно в <head> или сразу после <body>), и задайте насколько пикселов прокрутить вниз. Читать далее »

Еще в процессе планирования я прекрасно понимал, что именно редактор фотоотчетов будет самым сложным этапом работы над проектом. Нужно было все сделать удобно и доступно. Так, чтобы даже начинающий смог интуитивно догадаться что и как.

Вот прошли 2,5 дня беспробудной работы над ним и что я имею на руках: практически ничем не уступающий ВКонтакте, редактор фотоальбомов, а по удобству использования превосходящий их разработку. Единственное в чем я им уступаю, это изменение порядка следования фоток и у меня нет массового загрузчика на флеше. Пока нет (еще не делал, но знаю как). Что касается сервиса Яндекс.фотки, то ему я уступаю по многим пунктам, но кто я такой чтобы конкурировать с Яндексом, да и задачи текущие мой редактор полностью решает.

Мой редактор фотоотчетов это:

• Кроссбраузерность.
• Множество проверок, не позволяющих, к примеру удалить чужое фото, или повернуть его на 90º по часовой стрелке.
• 100% Аякс. За все время работы с фотографиями ваша страница ни разу не перезагрузится. Далось это не легко, спасибо Антону Шевчуку за то, что проконсультировал меня по одному вопросу.
• Комплексная работа с фотографиями. Там и повороты и кроппинг и ресайзинг средствами CodeIgniter.

При проектировании ориентировался прежде всего на редакторы фотоальбомов из вконтакте, яндекс.фоток, потому что у них удобнее всего они реализованы. Хотя просмотрел множество сервисов и русских и буржуйских. Читать далее »