создание сайта

Каждый тип контента это определённый набор полей. Можно самим создавать новые типы контента с нужным набором полей или изменять существующие, но об этом в другой раз, а пока вопрос: Зачем нужны поля? Заголовок мы можем набрать вместе с текстом выбрав шрифт покрупнее. Картинки также можем вставлять в основное содержимое, для этого есть специальная кнопка в редакторе. На первый взгляд вся эта канитель с полями кажется пустой тратой времени. Не торопитесь с выводами.

SVG это графический формат как jpg. Но только этот Graphic ещё и Scalabel, да к тому же Vector. SVG файл - это не картинка в том виде, как мы к ним привыкли. Он содержит XML разметку, которая определяет все линии, цвета, слои и прочее. Такой файл мы можем менять вручную в текстовом редакторе или с помощью JavaScript и CSS кода.

На WebOnLife, как и на многих других сайтах, в форме комментариев есть поле сайт. Редко кто оставляет это поле не заполненным и внешних ссылок накопилось достаточно много. Ссылки были закрыты в nofollow, но есть мнение что это не спасает от потери веса. Ещё меня не устраивало то что ссылки открывались в этом же окне, а не в новом.

Обе проблемы решаются одной строчкой кода на Javascript. Вместо старого доброго тега <a> нужно вставить

Реклама - самый распространённый способ монетизации сайта. Для любого сайта, даже с невысокой посещаемостью, можно что-нибудь найти и начать зарабатывать. В случае с контекстной рекламой не достаточно просто разместить рекламный блок. Нужно найти место где по нему будут кликать. Сайдбары, хедеры и футеры для этого не подходят. Самые кликабельные места в тексте. Дело за малым - научиться вставлять рекламный блок в контент.

Выпадающее меню раскрывающееся по клику не такая уж и редкость. Javascript позволяет делать более сложные вещи, а уж подобные фишки с меню делаются на раз. А что если сделать такое же меню но без применения JS. Зачем нам лишние скрипты если подобное можно сделать через CSS и HTML? Однозначно ответить на этот вопрос не получиться и вот почему. На WebOnLife есть статья как сделать выпадающее меню на CSS и HTML. Там описан способ как сделать меню раскрывающееся при наведении.

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

Не смотря на удобство конвейера иногда нужна ручная работа. Drupal изменяя размеры картинки действует по правилам которые вы ему задали. Как правило оставляется центральная часть картинки, а всё остальное обрезается. Такой вариант может не устраивать по двум причинам. Первая причина - фиксированная область. Не всегда нам нужна именно центральная часть картинки. Вторая причина - большие изображения уменьшенные для мобильных пользователей. Если на дэсктопе картинка будет выглядеть приемлемо,то на экране смартфона будет трудно разобрать что на ней.

Редирект 301 говорит о том что запрашиваемая страница навсегда переехала на новый адрес. При помощи 301 редиректа можно указать основное зеркало сайта с WWW или без. Также его используют при переводе сайта на https. Для этого достаточно дописать пару строк в файле .htaccess. Ситуации, когда может понадобиться 301 редирект, бывают разные. Можно их условно разделить на две группы.

Обычно установка текстового редактора в Drupal проходит в два этапа. Сначала ставим модуль wysiwyg и только после этого редактор. Если у вас нет предпочтений в выборе редактора и вы, так же как я, не любите лишние движения, то предлагают попробовать CKEditor. Этот редактор устанавливается как модуль вот ссылка на страницу drupal.org/project/ckeditor. Переходим, скачиваем, ставим как обычный модуль или делаем ещё проще

Адаптивные картинки для Drupal мы получим заменив старый добрый <img> на новый, пока ещё поддерживаемый не всеми браузерами, <picture>. Благодаря этому элементу мы можем загрузить несколько вариантов одной картинки, а браузер скачает ту которая больше подходит. Подробнее о <picture> можно почитать в статье про адаптивные изображения. Выполнив все инструкции из этой статьи вы получите адаптивные изображения на своём сайте, при этом процесс добавления изображений ни как не изменится.

Самый простой вариант "адаптировать" картинку - задать ширину 100% а высоту рассчитывать автоматически. Наше изображение никогда не будет шире родительского блока, при этом браузер будет ресайзить его с сохранением пропорций. Недостаток этого способа в том что и мобилке и дэсктопу отдаётся одна и таже, большая картинка. Будет лучше если на смартфон будет отправлена картинка меньшего размера. Таким образом мы экономим трафик посетителю и ускоряем загрузку страницы.