WordPress: создаем виджет для показа картинок с Flickr

Сегодня я расскажу о создании виджета для одной из самых популярных на сегодняшний день CMS – WordPress.
По большому счету, виджеты – это обычные плагины. Но они имеют несколько особенностей и предназначены в основном для отображения небольших блоков информации, чаще всего в сайдбаре.
С точки зрения пользователя, виджеты удобны тем, что их можно добавлять в сайдбар прямо из админки WP, не изменяя код темы.
Кроме того, для каждого виджета создается панель с настройками. Таким образом, все настройки сгруппированы в одном месте, что очень удобно.
Единственное условие – тема должна быть «widget ready», т.е. поддерживать виджеты. Но добавить эту поддержку несложно. Подробная инструкция находится здесь. Чтобы не усложнять пример, я буду считать, что используется дефолтная тема.
Сформулируем задачу.
Допустим, нам нужен виджет, который будет находить по заданным тегам на сервесе flickr картинки и показывать их. При этом администратор должен иметь возможность задать теги, количество картинок и их размер.
Читать дальше »
Опубликовано в HTML, PHP, Web разработка, WordPress | Комментарии (4) »
Управление jqGrid с помощью поля с автозавершением

Сегодня я продолжу рассказывать о плагине jqGrid и покажу еще один пример его использования.
Если не ошибаюсь, это уже 5-ый пост об этом плагине, поэтому я не буду останавливаться на его установке и настройке. Лучше приведу ссылки на предыдущие части:
1) Query Grid Plugin – "продвинутое" решение для создания таблиц
2) jqGrid: редактирование табличных данных с помощью inline редакторов
3) jqGrid – создание дополнительных кнопок
Но для тех, кто их не читал, кратко поясню, о чем вообще речь.
jqGrid – это плагин для библиотеки jQuery, предназначенный для работы с табличными данными. Он поддерживает кучу полезных возможностей вроде разбивки данных на страницы, поиска, добавления, удаления, редактирования записей и т.п.
Естественно, у плагина очень много настроек и вариантов использования, но это не означает, что их хватит на все случаи жизни
Например, раньше я рассказывал об использовании встроенной формы поиска jqGrid. Но иногда удобнее использовать отдельную форму, содержащую поля с автозавершением. Под ними по мере набора слова будут появляться варианты, а когда посетитель выберет один из них, то автоматически обновиться таблица с данными.
Как это работает, вы можете посмотреть на демо-страничке
либо скачать архив с примером и установить его на своем сервере
Реализовать такую систему не сложно.
Читать дальше »
Опубликовано в Ajax, HTML, JavaScript, MySQL, PHP, Web разработка | Комментарии (6) »
Создание слайдшоу на JavaScript и несколько особенностей анимации

Приветствую всех!
На днях я экспериментировал с плагином jQuery Panel Gallery и хочу поделиться впечатлениями, а заодно рассказать, как с ним работать. Кроме того, использование подобных плагинов имеет некоторые особенности, которые касаются не их самих, а JavaScript анимации вообще.
Итак, начнем с плагина.
Как несложно догадаться из названия, для его работы нужна библиотека jQuery. Сам плагин слайдшоу с плавными переходами между картинками.
Как это выглядит можно посмотреть на демонстрационной страничке.
И, конечно, вы можете скачать архив с примером.
Опубликовано в HTML, JavaScript, Web разработка | Комментарии (14) »
960 Grid System: зачем нужны CSS фреймворки

Что-то давно я ничего не писал о CSS, а ведь использовать эту технологию приходится практически постоянно.
Кроме того, последнее время я начинаю замечать, что все чаще использую CSS фреймворки. Поэтому сегодня речь пойдет именно о них. А точнее, об одном из них, под названием 960 Grid System.
Почему именно о нем? Тут все очень просто. Я более-менее плотно работал с двумя фреймворками: Blueprint и 960 grid. При этом, на мой взгляд, разработчикам 960 grid system удалось добиться очень хорошего отношения возможности/размер фреймворка.
Рассмотрим его подробнее.
Начнем с недостатков.
Если вы хоть немного интересовались темой, то, конечно, знаете, что есть много возражений против применении CSS фреймворков как таковых.
Основные возражения такие.
Читать дальше »
Опубликовано в CSS, HTML, Web разработка | Комментарии (25) »
Передача параметров в JavaScript файлы

Приветствую всех!
Сегодня я хочу обсудить два способа передачи параметров в JavaScript файлы.
Прежде всего, объясню, в чем заключается проблема. Обычно в конфигурационных файлах серверных (PHP) скриптов хранится множество настроек. И к некоторым из них нужно получить доступ из JavaScript. Если все эти параметры собраны в одном месте (конфигурационном файле или БД), то значительно упростится поддержку приложения.
Существует два широко распространенных решения этой задачи.
Читать дальше »
Опубликовано в HTML, JavaScript, PHP, Web разработка | Комментарии (6) »
Исправляем недостатки IE6

Думаю, все кто когда-нибудь занимался версткой сайтов, знает о том насколько хорошо IE6 поддерживает разные полезные возможности
Призывы перейти на нормальные браузеры или хотя бы обновить IE6, можно встретить на каждом шагу. Тем не менее ситуация меняется очень медленно.
И на сегодняшний день игнорировать людей, которые используют устаревшую версию Internet Explorer нельзя.
К тому же для того чтобы обеспечить поддержку IE6 не обязательно отказываться от новых возможностей.
Сегодня я расскажу о двух проблемах, которые можно решить практически без усилий с вашей стороны. Это поддержка :hover селекторов и прозрачных png изображений.
Читать дальше »
Опубликовано в CSS, HTML, JavaScript, Web дизайн, Web разработка | Комментарии (31) »
jqGrid – поиск данных

Приветствую всех!
Я довольно давно обещал рассказать о функции поиска в плагине jqGrid и сегодня выполняю обещание.
Для тех, кто сразу хочет посмотреть, как это работает, я сделал демонстрационную страничку
и, конечно, можно скачать архив с примером
Напомню, что jqGrid – это плагин для библиотеки jQuery, который значительно упрощает работу с таблицами данных.
Сразу хочу отметить, что эта статья – продолжение предыдущих двух частей (jQuery Grid Plugin – "продвинутое" решение для создания таблиц и jqGrid: редактирование табличных данных с помощью inline редакторов). Поэтому если вы впервые слышите о jqGrid – очень советую почитать хотя бы первую часть.
Читать дальше »
Опубликовано в Ajax, HTML, JavaScript, PHP, Web разработка | Комментарии (110) »
PHP скрипт: ToDo с картинками

Уделяете ли вы внимание организации своей работы?
Много ли у вас "мелких" дел, о которых вы регулярно забываете?
Вроде бы простые вопросы, но для многих людей (и я не исключение) организация работы – это актуальная проблема.
Хуже всего, когда нужно сделать много «мелких» дел, которые не занимают много времени, но обязательно должны быть выполнены вовремя… и держать в голове их все просто невозможно.
Естественно, разработчики реагируют на потребности рынка, и на сегодняшний день создано множество программ-органайзеров, различных напоминалок и т.п.
Примеры создания ToDo списков часто приводят в учебниках по программированию.
Я решил не оставаться в стороне и сделал собственный вариант такого ToDo списка, естественно, с некоторыми дополнительными возможностями.
Кстати, скрипт называется SimpleTasks.
Главная особенность – возможность указывать состояние выполнения задач. При этом используется специальная система обозначений.
Читать дальше »
Опубликовано в Ajax, CSS, CodeIgniter, HTML, JavaScript, MySQL, PHP, Web разработка, htaccess | Комментарии (59) »
Калькулятор взвешенных оценок

Приветствую всех!
В этот раз речь пойдет о создании калькулятора для расчета взвешенных оценок. Такие оценки часто используют при проведении различных тестирований и сравнений.
Например, вы хотите сравнить несколько мобильных телефонов между собой. Выбираете параметры, которые для вас важны (пусть это будут: цена, размер дисплея и вес) и для каждого из них выставляете оценку.
Естественно некоторые параметры будут важнее чем другие. Например, цена важнее веса. И вы хотите это учесть.
Для этого используются так называемые взвешенные оценки. Каждому параметру присваивается свой вес, который отражает его важность (чем больше, тем важнее), а затем рассчитывается суммарная оценка.
В суммарную оценку входит сумма оценок всех параметров, умноженных на их вес.
При этом удобно, чтобы сумма весов всех параметров равнялась 1 (100%). Например, цена – 50%, размер дисплея – 40%, вес – 10%.
Теперь рассмотрим пример создания такого калькулятора для 3-х параметров.
Нам понадобятся 3 поля для ввода оценок каждого из параметров и 3 слайдера (slider) для задания их весов.
В данном случае слайдеры создадут очень наглядное представление весов параметров. К тому же мы сделаем их связанными между собой и пользователю не придется следить за тем, чтобы сумма их значений была равна 100%.
Чтобы показать как будет выглядеть окончательный результат, я сделал демонстрационную страничку.
Читать дальше »
Опубликовано в HTML, JavaScript, Web разработка | Комментарии (3) »
Строим редактируемые графики с помощью JavaScript

И снова я продолжаю тему графиков
Кстати, в том, что от twitter’а есть польза я недавно убедился на личном опыте
. В ленте b1shop проскочила ссылка на очень интересный плагин для jQuery, предназначенный для создания графиков.
О том как нарисовать график с помощью JavaScript я писал в статье JavaScript библиотеки для создания графиков и в ней же сделал некоторые выводы.
В одном из них было утверждение о том, что JS библиотеки серьезно уступают Flash аналогам в плане функциональности. По большому счету это правильно… но библиотека jqPlot имеет ряд возможностей, которые, как я считал раньше доступны только во flash.
Кроме того, jqPlot позволяет подключать дополнительные плагины, точнее большинство функций реализовано с помощью плагинов. Таким образом, подключая только необходимые JS-файлы вы можете уменьшить размер страницы.
Возможностей у jqPlot много, но мне сразу бросились в глаза редактируемые графики. На них вы можете перемещать точки с помощью мышки.
Пример создания такого графика я и хочу показать в этой статье.
Читать дальше »
Опубликовано в HTML, JavaScript, Web разработка | Комментарии (15) »







