Рад видеть вас на wmbn.ru! Сегодня будет еще одна запись из рубрики Красивые шаблоны для WordPress, следовательно и рубрика пополнится. Хотелось бы поговорить и показать шаблоны, которые можно отнести минимализму. Нет, это не значит, что шаблон не имеет в себе даже стандартного функционала, просто его структура, страницы настолько просты, что могут вызвать как раз такие догадки. Ну а название «Белый» минимализм говорит сам за себя — речь пойдет о шаблонах, в которых преобладает белый цвет, нет каких либо вставок и прочего, что может нагромождать шаблон.

Шаблоны белого цвета в стиле минимализма

Мне самому нравится, когда на сайте устроен некий минимализм, конечно в разумных пределах. К примеру стандартные темы WordPress Twenty Ten и Twenty Eleven — да, в них есть дух минимализма, но вот картинки слегка портят картину, но только для тех, кто ценит простоту. А так, если их немного изменить, уменьшить разрешение, то они отлично дополнят шаблон. Речь конечно пойдет не только о них, так же посмотрим другие, не менее интересные шаблоны WordPress в стиле «Белого» минимализма.

Twenty Ten и Twenty Eleven — два стандартных белых шаблона WordPress в стиле минимализма

Две стандартные темы WordPress, Twenty Ten и Twenty Eleven, можно заметить, что сделаны так, чтобы они казались для посетителя намного проще, т.е. сайт был легким в восприятии и навигации. Мне вообще нравится их продуманный стиль, сделав задний фон темнее основного, но при этом разница в оттенках не значительная. Это не напрягает глаза, ведь нет резких скачков цвета — здесь лишь плавный переход от светлого серого, к белому, причем без использования градиента и прочего эффекта.

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

Twenty Eleven приятно удивил, пусть и стиль тот же — серый фон и на нем белая подложка основного контента. Однако он отличается от первого некоторой яркостью и насыщенностью белого цвета. Может показаться смешным, но действительно белый цвет у Twenty Eleven куда насыщеннее и ярче, чем у Twenty Ten. Скорее всего это вызвано тем, что фон темнее, или используется больше темного цвета на самой странице — точно сказать не могу, в дизайне цветов я не такой специалист, хотя в данном случае поверхностно определить причину может каждый.

Давайте подробнее рассмотрим первый шаблон Twenty Ten. Название шаблона определяет год его создания, если дословно перевести Twenty Ten, то получится 20 10, что вместе 2010 год. Тема настраиваемая, имеет возможность работы с виджетами, создании произвольного меню, выбора фона для сайта (здесь можно и проверить, как задний фон может изменить белую подложку) и изменение картинки над меню.

Стандартный шаблон для WordPress Twenty Ten

Фон для сайта можно подобрать любой — изображение или произвольный цвет, который выбирается прямо из палитры. С цветом можно поиграть, выбрав к примеру полностью черный, серый или белый — от этого и будет изменятся вид шаблона. Вот она простота минимализма с хорошим функционалом — можно изменить картинку над меню, выбрать готовую из галереи или загрузить свое изображение. Для виджетов предусмотрены две области — сайдбар и подвал сайта (футер). В подвале 4 места, куда можно установить виджет.

А теперь подробнее рассмотрим шаблон Twenty Eleven — тоже стандартный шаблон для WordPress, выполненный в стиле минимализма. Очень насыщенные цвета и яркие краски изображений над меню. Уже есть поисковая строка, которая компактно сворачивается при ее не использовании, изображения стали больше (мне это немного не понравилось), а вот меню сделали в градиенте, что выглядит очень красиво. Минимализм тут тоже проявился и нет выделений боковой колонки от основного документа. Зато изменили шрифт, немного добавили элементы, которых не было в Twenty Ten.

Стандартный шаблон для WordPress Twenty Elewen

Для виджетов так же предусмотрены места в боковой колонке и в подвале сайта для трех виджетов. И здесь опять проявление внешнего минимализма с довольно обширным внутренним функционалом — шаблон имеет свои настройки. Можно выбрать цветовую схему (белую или черную), указать цвет для ссылок и выбрать другую разметку (структуру) шаблона — сайдбар слева, сайдбар справа и без него. Так же можно задать произвольный фон — цвет или изображение. Изменить заголовок, выбрав другие картинки для показа и настроить их показ.

Wu Wei — белый шаблон WP в стиле минимализма

Очень интересная тема в стиле минимализма и преобладающем белым цветом — Wu Wei. Полностью белые цвета с оранжевыми ссылками очень красиво смотрятся. Нет никаких дополнительных вставок — один сплошной цвет. Меню у шаблона расположено сверху, причем созданы готовые ссылки на страницы, однако их нужно будет исправить. Опять же что плохо, ссылки эти придется редактировать вручную, ибо меню не изменяется (по крайней мере мне не удалось найти данную функцию). Есть так же кнопка вниз, которая ведет в конец страницы.

Белый шаблон для WordPress в стиле минимализма Wu Wei

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

Посты публикуются в очень интересном виде — слева расположена краткая информация о записи (Заголовок, Дата публикации и Количество комментариев). После перехода на запись, сверху добавится блок, в котором показаны следующие и предыдущие посты. Ниже указаны рубрики и метки, которые присвоены для записи.

Сайдбар расположен не стандартным образом — его убрали полностью в футер. Решив свести к минимуму использование ширины сайта навигацией, заменив ее чисто записями — странное проявление минимализма, но мне это даже нравится. Как его обратно поставить способ я так и не нашел — были конечно некоторые варианты, но тогда боковая колонка попросту наезжала на основной документ, портя при этом всю картину шаблона. Этакий минимализм для шаблона WordPress. Ну а внизу стоит кнопка наверх.

Настройки шаблона Wu Wei

Шаблон Wu Wei имеет два стиля — белый (light), который установлен по умолчанию и его мы рассмотрели, и черный (dark), который меняет цвет на более темный, приближенный к черному. Здесь же и меняются ссылки с оранжевого на голубой, цвет шрифта с черного на белый и т.д.

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

<ul id="menu">
<li><a href="<?php echo get_option('home'); ?>/" <?php if(is_home()) {echo 'class="selected"';} ?>><span>в начало</span><br />главная</a></li>
<li><a href="#"><span>описание здесь</span><br />ссылка 1</a></li>
<li><a href="#"><span>описание здесь</span><br />ссылка 2</a></li>
<li><a href="<?php bloginfo('rss2_url'); ?>"><span>rss</span><br />публикации</a></li>
<li><a href="<?php bloginfo('comments_rss2_url'); ?>"><span>rss</span><br />комментарии</a></li>
<li class="last"><a href="#sidebar"><span>к навигации</span><br />вниз</a></li>
</ul>
<div class="clearboth"><!-- --></div>

Здесь прописана функция только для главной страницы сайта. Посмотрите третью строку — за место ссылки указана решетка, далее описание. Вот за место решетки нужно просто вставить ссылку страницы, поменять описание и добавить название для пункта меню. Ненужные варианты просто удалить. Вручную изменять меню даже лучше — нет лишних запросов к базе, что может хоть немного снизить нагрузку на блог WordPress.

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

<div id="header">
<div class="blog-name"><a href="<?php echo get_option('home'); ?>/"><?php bloginfo('name'); ?></a></div>
<div class="description"><?php bloginfo('description'); ?> <a href="#тут должна быть ссылка">подробнее &#187;</a></div>

Обратите внимание на третью строку — специально для нас указали в каком месте должна быть ссылка. Туда и ставим адрес, а слово подробнее можно заменить на другое. Вот такой вот шаблон WordPress Wu Wei в стиле минимализма.

Hatch — шаблон для WordPress для организации портфолио и других сайтов, а так же фото блогов

Если вы любите фотографии или организовывать все посты с миниатюрами… в общем если вы ведете фото блог, то шаблон Hatch отлично подойдет для этих целей. И пусть не пугает его минимализм, этот шаблон отлично организовывает посты на главной странице.

Шаблон разделен на 6 частей — шапка сайта, ниже описание и главная фотография сайта, затем идут миниатюры постов, виджеты и подвал. Заголовок меняется на любое изображение, которое можно загрузить. Фон тоже меняется — от белого до черного, по этому можно подстроить фоновое изображение по тематику сайта.

Шаблон для организации портфолио Hatch

Тема имеет свои настройки — можно загрузить фавиконку, задать произвольный логотип, указать автора, чье описание будет на главной странице (или описание сайта). Затем есть возможность выбора шрифта и цвета ссылки, а так же использование пользовательского Css. В блоке Footer Setting настраиваем вид подвала сайта и его текст или описание.

Настройки шаблона Hatch

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

Задание миниатюры для записи в теме Hatch

В общем если у вас блог культурной тематики, где преимущественно много фотографий, то шаблон Hatch вполне подойдет, пусть даже он выполнен немного в минимализме.

Многофункциональный шаблон WP — BlueBubble

Остался последний шаблон WordPress в стиле минимализма, который завершит данный пост — BlueBubble. К белому цвету его отнести можно, но помимо него можно выбрать другой фон — все зависит от задумки автора и подбора цвета под определенные критерии. BlueBubble так же можно организовать как портфолио, но уже более функциональное, немного отталкиваясь от минимализма. Что еще интересно, можно сделать стиль так, что сайт не будет похож на блог, а на что-то более расширенное, хотя такие понятия у каждого свои, да и задумки тоже.

Шаблон для WordPress BlueBubble

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

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

Приступим к просмотру настроек шаблона BlueBubble — всего 10 пунктов, среди которых как стандартные настройки, так и различные расширения. Начну с Общих (General) настроек — здесь можно выбрать:

  • Цветовую схему сайта (Color Scheme);
  • Подключить к сайту сервис Feedburner, указав адрес вашего фида;
  • Изменить надпись в футере блога, задав для него свою запись, при этом используя HTML теги для нужд (ссылки, выделение и прочее);
  • Вставить код системы Google Analytics, не меняя при этом исходный код шаблона в ручную;
  • Задать пользовательской Css для шаблона;

Стандартные настройки темы BlueBubble

Теперь разберем пункт Расположение элементов (Layout):

  • Horizontal Top Menu — включите, если хотите, чтобы меню было горизонтальным;
  • Legacy Menu Style — в данном случае меню будет выгладить как в старых версиях шаблона;
  • Sidebar Login — форма входа в панель администратора будет отображена в боковой колонке сайта;
  • Custom Login — пользовательский вход в систему, при котором стандартная страница входа WordPress должна поменяться;
  • Sidebar on right — боковая колонка сайта (сайдбар) будет отображаться на правой стороне, а не на левой, как задумано по умолчанию;

В пункте Logo and Icon меняется стандартная иконка, которая расположена сверху в шапке, а также здесь можно задать собственную фавиконку (то, что потом будет отображаться рядом с названием сайта на вкладке браузера). Вот теперь настала интересная часть настройки шаблона, если же судить шаблон по поверхностному стилю, то ему можно как раз придать тот минимализм, но если разобраться с функциями…

В общем, в настройках шаблона можно сделать так, что на сайте организуется портфолио автора. Это очень удобно — на данную страницу можно поставить не только работы, но и миниатюры других сайтов, которые вы читаете, или скриншоты любимых игр и прочее. В пункте Portfolio выбираете ту категорию сайта,которая будет служить в качестве портфолио автора. Для блога (Blog) тоже самое.

Контактная форма в шаблоне BlueBubble

В Twitter можно настроить трансляцию ваших твитов на страницу сайта — для этого укажите адрес вашего аккаунта или имя. Остались страницы Contact Form, в которой для обратной связи нужно указать лишь ваш e-mail адрес. Затем Social Icons — в тему встроены некоторые кнопки социальных сетей, таких как Facebook, Twitter и различных социальных закладок. И пункт SEO, где прописываются теги description и keywords.

На этом обзор шаблонов для WordPress, выполненных в стиле минимализма можно закончить. Постарался подобрать шаблоны с оригинальным содержанием (исключая стандартные темы WordPress) и где преобладает белый цвет. да и вышло так, что минимализм в шаблонах оказался видным только для посетителей, что в принципе и надо.

Комментариев: 1

  1. Руслан

    Добрый вечер! Слетела у меня из-за ошибки тема twenty elewen,пришлось заменить на twenty ten и при настройке цвета ссылок,оказалось,что в этой теме они цвет не меняют…! Только есть замена цвета фона…! Подскажите как поменять цвет ссылок без затрагивания html ?

Добавить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *

Можно использовать следующие HTML-теги и атрибуты: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>