верстка

Аватар пользователя Натали

Начинающему верстальщику - как выбрать в чем писать код

Раздел: 

Люди, которые начинают заниматься верстко, часто даже не подозревают о тех проблемах, которые могут возникнуть при верстке и как уменьшить количество этих проблем.
Одна из самых частых ошибок верстальщика - это использование программных средств, которые не предназначены для написания кода. Если Вы пользуетесь обычным блокнотом или же каким-то других редактором, который не умеет подстраиваться под код верстальщика, Вы делаете огромную ошибку.
Для теммизатора самый простой способ допускать меньше случайных ошибок - это использовать специальные программы, предназначенные для разработки сайтов, для теммизации сайтов и для других дел, связанных с созданием веб-проектов. Тем более Друпал сайты обычно подразумевают не просто сайты-визитки, а что-то более крупное.
А когда перед Вами не 500-1000 строк, а больше 5000 или 10000 строк кода, тогда достаточно сложно найти ошибку, особенно если ее существование выявилось намного позже, чем она была ддопущена.
На помощь разработчикам и верстальщикам сайтов приходят такие программы, как Notepad++, IDE, Dreamviewer и другие.
Эти программы помогают верстальщикам в первую очередь тем, что подсвечивают код, который пришется при верстке. Если Вы сделали ошибку, например забыли закрыть скобку или не поставили запятую или точку, программа сразу же отреагирует цветом и вы при определенном опыте сразу же среагируете, что что-то не так. Ошибка будет исправлена тут же.
Задача верстальщика - из всех програм выбрать ту, которая допускаем как можно меньше ошибок с подсветкой, которая меньше глючит при работе и так далее.
Из моего опыта в полтора года и постоянной верстки сайтов, самый простой, быстрый и менее глюмный - это Notepad++
Я знаю, что есть люди, готовые со мной поспорить. 
Да, каждая программа по своему хороша и по своему плоха. К каждой программе надо привыкнуть и научиться понимать все, что делает эта программа, изучить ее особенности, возможные ошибки и т. д. Поэтому выбирать должен каждый сам для себя. Я сделала свой выбор при разработке сайтов. И желаю всем удачи в таком достаточно серьезном деле ,как теммизация вебпроектов. smiley

Аватар пользователя Натали

Круглые углы border-radius для всех браузеров

Раздел: 

Для скругления углов в разных браузерах используются такие команды:

border-radius: 10px; - css3 стандарт

-webkit-border-radius: 10px; - для браузеров на движке webkit, например Chrome

-moz-border-radius: 10px; - для браузеров на движке Mozilla, например Mozilla Firefox

 

ПРИМЕР:

#block-menu-menu-top-menu ul.menu{

    border-radius: 10px;

    -webkit-border-radius: 10px;

    -moz-border-radius: 10px;

}

 

Но для експлорера необходимо добавить свои фичи для того, чтобы подобные скругления углов отображались как следует.

Итак, необходимы следующие действия:

1. В корень темы необходимо положить файлик с именем "border-radius.htc" - это файл прикреплен к данной статье.

2. Затем прописать рядом с командой border-radius еще одну команду, специально для браузера Explorer: #block-menu-menu-top-menu ul.menu{ border-radius: 10px; -webkit-border-radius: 10px; -moz-border-radius: 10px; behavior:url(/border-radius.htc); } Это дело вытягивает настройки из цсса и круглит при помощи скрипта.

 

 

Картинка-пример приведена с проекта, который теммизировала наша команда: http://samaya.ru/

Временная тестовая площадка: natal.samaya.ru.ct101.ruswebs.ru

Аватар пользователя Натали

Прицепить img (кнопку-картинку) к input

Раздел: 

При верстке сайта на Drupal для того, чтобы сделать кнопку-картинку вместо стандартной кнопки или ссылки, когда в коде вы видем <input>, а не просто <a>, необходимо зайти в template.php и прописать там следующее:

 

/*--------poll-button---------*/
 
function THEME-NAME_form_inner_poll_dk_form_alter(&$form, &$form_state, $form_id) {
 $form['submit']['#type'] = 'image_button';
 $form['submit']['#src'] = base_path().drupal_get_path('theme', 'THEME-NAME').'/images/button_opros.png'; /*-------------Здесь вписываете адрес к вашей кнопке-------------*/
 
/*dsm ($form);*/ /*---------------Это команда Вам пригодится для того, чтобы вывести дебагер для необходимой формы, только необходимо раскомментировать ее.--------------*/
}
 
/*-------end-poll-button---------*/
 
THEME-NAME - вместо этих слов необходимо записать название вашей темы.
 
inner_poll_dk_form - это в данной задаче название формы, его можно увидеть в коде инспектора в брайзере.
 
---------------------------------------------------------------------------------------------------
Так же формы могут цепляться не просто к сабмитам, а к екшенам, что правильнее делать в Д7, тогда форма будет выглядеть в темплейте вот таким образом:
 
function THEME-NAME_form_comment_node_forum_form_alter(&$form, &$form_state, $form_id) {
 $form['actions']['submit']['#type'] = 'image_button';
 $form['actions']['submit']['#src'] = base_path().drupal_get_path('theme', 'samaya').'/images/send-blue.png';
}
 
Если Вы все сделали верно, то вуаля и кнопка уже вся из себя красивая!