Redisign. Переделал тему WordPress.
Поиск Блог о программировании [http://www.simplecoding.org/] « Разработка web приложений. Как сделать редактор списка в стиле Web 2.0 (удаление записей) Разработка web приложений. Как сделать редактор списка в стиле Web 2.0 (настройка и оформление) » Redisign. Переделал тему WordPress. 10 января, 2008 Наконец-то, доделал новую тему для этого блога! Главные изменения, коснулись сайдбара . Теперь он стал практически в два раза шире, что позволило добавить в него несколько новых блоков (например, «самое читаемое»). Кроме того, теперь можно создавать цепочки комментариев (похожий принцип используют службы вроде habrahabr.ru ). На мой взгляд, это гораздо удобнее стандартного способа добавления комментариев. В общем, надеюсь, новый дизайн сделает чтение блога приятнее. Все пожелания, замечания, советы и т.д. пишите в комментариях. Мне действительно будет очень интересно их почитать . P.S . На скриншоте показан предыдущий вариант дизайна (щелкните по картинке чтобы увеличить). P.P.S . Также хочется выразить благодарность Максиму за сборку и Slaff’у за руководство. А также отдельное спасибо Scratch’у за совет о доступности форм. Понравилась статья? Подпишитесь на продолжение ! ]]> Добавьте эту страницу в ]]> Опубликовано в WordPress , Разное ]]> Комментарии (26) Вы можете отслеживать обсуждение записи с помощью RSS 2.0 Вы также можете оставить комментарий , или трекбек с Вашего сайта. Scratch 10.01.2008 в 17:08 ( Ответить ) Хорошо, да. Нужно будет у себя тоже сделать нормальную форму Кстати, куда-то OneFace отвалился (говорит, movie not loaded). Но это, я так понимаю, на сервере проблемы… Насчет цепочки комментариев — их нужно смотреть на вложенности в 20 штук, когда начнут вылазить проблемы. Хотя да, "ветки обсуждения" — это классическая схема, и не только Хабр их использует (на самом деле, это применялось еще в тыща девятьсот надцатом году, в USENET конференциях (когда такие вот обсуждения вообще появились). Scratch 10.01.2008 в 18:43 ( Ответить ) Просто тест комментария. 2Владимир: Если все пройдет нормально (или даже пройдет ненормально), всю ветку вложенных комментариев можно удалить. Scratch 10.01.2008 в 18:48 ( Ответить ) Судя по всему, это не тот модуль, который я видел, например, у Татьяны Вукс Владимир 10.01.2008 в 22:46 ( Ответить ) Да плагин другой. Я использую Yet another threaded Comments plugin . А у нее - Brians Threaded Comments (судя по внешнему виду). Принципиальной разницы, конечно, нет. Но у YATCP в документации очень подробно описано как его подстроить под свою тему. Владимир 10.01.2008 в 22:41 ( Ответить ) 20 штук это, конечно, хорошо, только я ограничил уровень вложенности шестью. После этого выводится сообщение "достигнут максимальный уровень вложенности" и все дальнейшие комментарии добавляются ниже (на том же уровне). Кроме того, при двадцати отступ справа будет большим и комментарии сильно увеличатся по высоте. Да и, по-моему, для этого блога такой уровень потребуется очень не скоро. Scratch 10.01.2008 в 22:44 ( Ответить ) Да и, по-моему, для этого блога такой уровень потребуется очень не скоро. Уровни ответов имеют свойство плодиться и размножаться. Так как любое более-менее живое обсуждение не ограничивается 10 ответами с каждой стороны. Scratch 10.01.2008 в 22:46 ( Ответить ) К слову о "юзабельности форм" Я думаю, можно навесить маленький скриптик на форму отправки комментария, который бы не давал отправить форму, если поле "Сколько будет дважды два четыре" не заполнено. Потому что уже столько, как я подозреваю, хороших комментариев пропало из-за того, что по нажатию Back со страницы с ошибкой комментарий не восстанавливался… Владимир 10.01.2008 в 22:49 ( Ответить ) Спасибо, учту. Я просто использовал готовый плагин и не учел этот момент. Scratch 10.01.2008 в 22:53 ( Ответить ) Вот, опять. Только что хотел написать большой комментарий, почему мне Brians Threaded Comments нравится больше, забыл ввести "зеленая дудочка", и — все. Комментарий утерян. А там две текстарии набралось Владимир 11.01.2008 в 20:16 ( Ответить ) Доделал! Теперь должно выводится сообщение обо всех незаполненных полях (кроме названия сайта, это поле необязательное). Кстати, у меня при переходе со страницы с сообщением о незаполненном поле сохраняются все введенные значения (переход выполняется кнопкой "Назад", браузер - FF 2.0.0.11). Scratch 11.01.2008 в 20:27 ( Ответить ) (Comments won't nest below this level) Ну, я преимущественно смотрю через IE (6 версия), потому что, увы, FF c выходом 2 ветки начал притормаживать (по сравнению с 1.5). И иногда, при нажатии back, значение поля комментария просто не сохраняется. Ну, теперь-то будет уже нормально (хотя такая раскраска — это слегка чересчур). А именно: 1) При сабмите нужно подсвечивать _все_ неверные поля. А не по одному, в порядке незаполненности 2) Достаточно простой подсветки неправильного поля при помощи красной рамки. Делать кастомный бэкграунд — совершенно необязательно. Как пример подсветки полей могу посоветовать валидатор поля, встроенный в ExtJS. (если я соберусь прикрутить такой валидатор к своему блогу — то я обязательно поделюсь кодом) Владимир 11.01.2008 в 20:41 ( Ответить ) Да я, честно говоря, использовал готовый плагин ( Comment Fileds JavaScript Validation ). Только добавил проверку поля с суммой, т.к. в стандартном варианте он проверяет только имя, eMail и комментарий. А подсветка такая там по-умолчанию. Исправить ее не сложно, просто я еще не решил какой цвет для рамок выбрать. Бэкграунд уберу обязательно. По-поводу подсветки всех полей. В целом я согласен, что нужно выводить все ошибки. Но в общем-то это довольно редкая ситуация, когда посетитель пропускает два поля из четырех (комментарий вряд ли кто-то не заполнит). Поэтому еще подумаю . Scratch 11.01.2008 в 20:52 ( Ответить ) я, честно говоря, использовал готовый плагин Читер Но в общем-то это довольно редкая ситуация, когда посетитель пропускает два поля из четырех С одной стороны — редкая, с другой — мало ли что. Мы ведь тоже понимаем, что текстридерами будет пользоваться один подписчик из тысячи, но в то же время делаем разметку, рассчитанную на это… Владимир 11.01.2008 в 21:05 ( Ответить ) Тут есть один нюанс. Если не сделать разметку под текстридер, посетитель может не понять как заполнить форму. А сообщения об ошибках в форму будут выведены в любом случае . Разница только в том все вместе или по-отдельности. Кроме того, редко кто читает длинные сообщения об ошибках . Scratch 11.01.2008 в 22:00 ( Ответить ) Хм. Я просто вспоминаю, как ходил получать кредит. И сначала у меня взяли все документы, посмотрели, и сказали что нужно принести идентификационный код. Когда я принес код, мне сказали, что нужно принести справку с места работы. Когда я получил эту справку, мне сказали, что она "неправильно оформлена" (правда, я так и не добился от них, как _правильно_ это оформлять — мне только намекнули, что подписи директора недостаточно, а нужна еще и подпись главбуха)… Вот, показывать пользователю _по одной_ ошибке — равносильно этому А насчет "читать длинные сообщения" — если поле просто подсвечено красным, это не так уже и длинно И читать это не обязательно :)) Владимир 11.01.2008 в 22:27 ( Ответить ) Пример с кредитом хороший Посмотрим. Переделать в общем-то несложно. Скрипт и проверки довольно простые. Владимир 12.01.2008 в 20:00 ( Ответить ) Переделал. Не сказать, чтобы стало значительно удобнее, но что-то в этом есть . Scratch 12.01.2008 в 21:21 ( Ответить ) Да, так лучше. А сообщение об ошибке делать всплывающим окошком (алертом) как раз необязательно. Красная рамка уже сама по себе говорит о том, что поле заполнено неправильно. В общем, я в понедельник сделаю валидатор на своем блоге (для ввода комментариев) и покажу, что именно я имею ввиду. Владимир 13.01.2008 в 17:36 ( Ответить ) >> делать всплывающим окошком (алертом) как раз необязательно Тут есть одна проблема. eMail может быть не заполнен, а может иметь неправильный формат. И то, и другое ошибки, но сообщения разные. Scratch 14.01.2008 в 00:38 ( Ответить ) Ну, я не зря указывал именно на Ext-овский способ. Там это сделано вообще красиво — сообщени об ошибке показывается в виде всплывающего окошка (при наведении). И уже в нем показывается характер ошибки. В нашем случае — можно писать тип ошибки рядом с окошком. А лишний клик мышкой никого еще не радовал (в отличие от текста сбоку от поля, который никак не влияет на работоспособность остальных частей сайта) Yuriy 17.01.2008 в 16:20 ( Ответить ) Всю ветку комментариев прочитать не осилил Дизайн этот мне больше нравится, чем тот что был. У себя в блоге я поставил Brians Threaded Comments. Селект бокс нижний, по моему, лишний. Кстати ругается на мой имейл, пришлось точку из него убрать… Scratch 17.01.2008 в 17:24 ( Ответить ) Нижний селект бокс показывает к какому именно комментарию отправляется комментарий В отличие от BTC, в котором форма перемещается под комментируемый текст, тут — форма всегда внизу, и иногда полезно знать, куда же твой текст отправится… Ругаться на точку в мыле — это очень частая проблема со многими валидаторами. Они считают что мыло — это только (\w), хотя в некоторых случаях там может быть практически что угодно (хоть чучело). Вот, пример валидатора , в котором описываются некоторые особенности этих вот email адресов. Да и RFC 822 говорит, что local-part (это то, что перед собакой) может содержать что угодно, если оно заключено в кавычки. Scratch 17.01.2008 в 17:31 ( Ответить ) Да, кстати, горе мне горе. Ссылку на RFC 822 стоит заменить на сылку на RFC 2822, как замещающий документ. Это я прогнал, сознаюсь. Владимир 18.01.2008 в 16:14 ( Ответить ) Я пробовал использовать Brians Threaded Comments. Но оказалось, что он хорошо вписывается в стандартную тему (или похожую). Естественно, переделать его можно как угодно… Но нормального описания я не нашел, а копаться в исходниках было лень . Кроме того, Brians Threaded Comments не сможет вставить форму под комментарий, если отключен JavaScript. В моем случае, нужный комментарий можно выбрать в нижнем селект боксе. P.S. Скрипт проверки email я обязательно исправлю. Честно говоря, забыл его протестировать . Scratch 18.01.2008 в 17:03 ( Ответить ) Brians Threaded Comments не сможет вставить форму под комментарий, если отключен JavaScript. Да-да-да. Все тот же самый accessibility. Только в случае отключенного JS не работает бОльшая часть сайтов. Так что JavaScript уже прочно вошел в нашу жизнь. В случае же Brians Threaded Comments, да и здесь — может, стоит вставлять этот дропдаун только при отключенных скриптах? Тэг "noscript" вроде бы еще никто не отменял… Владимир 19.01.2008 в 22:53 ( Ответить ) Да, все время одна и таже проблема… выбора Несколько решений, несколько компромиссных вариантов. У каждого свои достоинства и недостатки… Но, думаю, со временем по экспериментирую и выберу. Хотя, я уже столько раз менял свои решения Оставить комментарий Введите ваш комментарий Имя * eMail (не отображается)* Сайт * - обязательные для заполнения поля Quicktags : Получать новые комментарии на e-mail Currently you have JavaScript disabled. In order to post comments, please make sure JavaScript and Cookies are enabled, and reload the page. Это комментарий к : статье комментарию 1 (Scratch at 10.01.2008 17:08) комментарию 1.1 (Scratch at 10.01.2008 18:43) комментарию 1.1.1 (Scratch at 10.01.2008 18:48) комментарию 1.1.1.1 (Владимир at 10.01.2008 22:46) комментарию 1.2 (Владимир at 10.01.2008 22:41) комментарию 1.2.1 (Scratch at 10.01.2008 22:44) комментарию 2 (Scratch at 10.01.2008 22:46) комментарию 2.1 (Владимир at 10.01.2008 22:49) комментарию 2.1.1 (Scratch at 10.01.2008 22:53) комментарию 2.1.1.1 (Владимир at 11.01.2008 20:16) комментарию 2.1.1.1.1 (Scratch at 11.01.2008 20:27) комментарию 2.1.1.1.1.1 (Владимир at 11.01.2008 20:41) комментарию 2.1.1.1.1.1.1 (Scratch at 11.01.2008 20:52) комментарию 2.1.1.1.1.1.1.1 (Владимир at 11.01.2008 21:05) комментарию 2.1.1.1.1.1.1.1.1 (Scratch at 11.01.2008 22:00) комментарию 2.1.1.1.1.1.1.1.1.1 (Владимир at 11.01.2008 22:27) комментарию 2.1.1.1.1.1.1.1.1.2 (Владимир at 12.01.2008 20:00) комментарию 2.1.1.1.1.1.1.1.1.2.1 (Scratch at 12.01.2008 21:21) комментарию 2.1.1.1.1.1.1.1.1.2.1.1 (Владимир at 13.01.2008 17:36) комментарию 2.1.1.1.1.1.1.1.1.2.1.1.1 (Scratch at 14.01.2008 00:38) комментарию 3 (Yuriy at 17.01.2008 16:20) комментарию 3.1 (Scratch at 17.01.2008 17:24) комментарию 3.1.1 (Scratch at 17.01.2008 17:31) комментарию 3.2 (Владимир at 18.01.2008 16:14) комментарию 3.2.1 (Scratch at 18.01.2008 17:03) комментарию 3.2.1.1 (Владимир at 19.01.2008 22:53) ]]> ]]> Подписаться RSS eMail ]]> Контакты Отправить письмо О блоге Реклама Самое читаемое Как самостоятельно и бесплатно зарегистрировать домен PHP framework CodeIgniter: контроллер и представления PHP mail под Windows. Отправка почты из PHP скриптов Анализ данных с помощью регулярных выражений или быстрый способ проверки введенных данных Как создать облако тегов для своего сайта на PHP Разное При поддержке Карта сайта RSS Events Генератор форм для CodeIgniter мерседес Нагреватели 6, 7 кВт Предлагаем делопроизводство обучение в Москве Разделы C++ (4) Ajax (15) CSS (23) Hosting (2) HTML (38) Java (10) JavaScript (43) PHP (75) SEO (7) Subversion (4) WordPress (40) Web дизайн (4) Разное (54) CodeIgniter (34) RSS events (2) Web разработка (80) Yahoo Pipes (3) Заработок (1) Безопасность (6) MySQL (3) Eclipse (10) Bazaar (1) Phing (4) Интересные блоги Путь веб-разработчика ]]> Русский WordPress Dmytro Shteflyuk’s Home Tigir.com :: Javascript, CSS, HTML Sribna parabola О PHP и о жизни… дневник простого web-программиста Scratch Blog хроники php разработчика RM Creative Блог простого программиста ]]> Топ комментаторов ]]> Big_Shark (26) Виктор (15) Евгений (13) Валерий (10) Alex (9) Металлист (8) Oleg (7) Polina (6) ]]> Счетчики ]]> ]]> ]]> Этот блог работает на WordPress © www.simplecoding.org, 2007-2008. Стаценко Владимир Valid XHTML , CSS ]]>