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

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

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

Как сохранить документ в качестве шаблона

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

Когда у Вас есть документ, который Вам нужен, пришло время сохранить его в качестве шаблона. Откройте меню «Файл», а затем нажмите «Сохранить как».

После ввода имени для своего шаблона откройте раскрывающееся меню полем полем имени, а затем выберите параметр «Word Template (* .dotx)».

Вы сохранили свой собственный шаблон Word.

Как создать новый документ на основе шаблона

После того как Вы сохранили свой собственный шаблон, Вы можете создать на его основе новые документы. Самый простой способ сделать это — просто запустить Word.

Его всплывающий экран показывает кучу шаблонов, которые являются встроенными или загружаемыми. В верхней части окна нажмите ссылку «ЛИЧНЫЕ», чтобы отобразить Ваши собственные шаблоны. Затем все, что Вам нужно сделать, это щелкнуть по нужному шаблону, и Word создает на его основе новый документ.

По умолчанию Word любит сохранять шаблоны в Documents\Custom Office Templates, где они будут отображаться вместе с шаблонами, которые Вы создаете в любом другом приложении Office.

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

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

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

В меню «Файл» выберите команду «Параметры». В окне «Параметры Word» выберите категорию «Сохранение» слева. Справа введите путь, в котором Вы хотите сохранить шаблоны в поле «Расположение личных шаблонов по умолчанию». Нажмите «ОК», когда закончите.

В конце концов, шаблоны Word функционально похожи на обычные документы Word. Большая разница заключается в том, как Word обрабатывает эти файлы, что упрощает создание на их основе новых документов.

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

Сохранение шаблона

Совет: Чтобы изменить расположение для автоматического сохранения шаблонов, на вкладке Файл выберите пункт Параметры , щелкните категорию Сохранение и укажите путь к нужной папке в поле Расположение личных шаблонов по умолчанию . Все новые шаблоны будут сохраняться в указанном расположении, а если на вкладке Файл выбрать команду Создать и перейти в категорию Личные , будут показаны шаблоны из этой папки.

Редактирование шаблона

Чтобы обновить свой шаблон, откройте файл, внесите необходимые изменения и сохраните шаблон.

    Щелкните Файл > Открыть .

    Дважды щелкните пункт Компьютер (или Этот компьютер ).

    Перейдите в папку Пользовательские шаблоны Office , которая находится в папке Документы .

    Щелкните шаблон и нажмите кнопку Открыть .

    Внесите необходимые изменения, а затем сохраните и закройте шаблон.

Создание нового документа с помощью шаблона

Чтобы создать новый файл на основе шаблона, нажмите кнопку файл > создать > Настраиваемый и выберите нужный шаблон.

Примечание: Если вы используете Office 2013, эта кнопка может называться " персональный ", а не " Пользовательская ".

Использование шаблонов из предыдущих версий Office

Если вы создали шаблоны в более ранней версии Office, то можете использовать их в Office 2013 или 2016. Для этого сначала переместите соответствующие файлы в папку "Настраиваемые шаблоны Office", чтобы они стали доступны в приложении. Для быстрого перемещения шаблонов используйте инструмент Fix it .

Word

Сохранение документа как шаблона

    Откройте документ.

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

    Во всплывающем меню Формат выберите пункт Шаблон Word (.dotx) .

    имя_пользователя

    В меню Файл выберите команду Закрыть .

    имя_пользователя

    Примечание: Перейти

Создание документа на основе шаблона

    В Finder откройте/пользователи/имя_пользователя /Library/Application Support support/Microsoft/Office/пользовательские шаблоны и Мои шаблоны.

    Примечание: Перейти

PowerPoint

Сохранение презентации как шаблона

    Откройте презентацию, на основе которой нужно создать шаблон.

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

    Во всплывающем меню Формат выберите пункт Шаблон PowerPoint (.potx) .

    Если вы не выбираете другое расположение, шаблон сохраняется в/пользователи/имя_пользователя /Library/Application Support support/Microsoft/Office/пользовательские шаблоны и Мои шаблоны.

    Чтобы упорядочить шаблоны, используйте средство поиска для создания новой папки в/пользователи/имя_пользователя /Library/Application Support support/Microsoft/Office/пользовательские шаблоны и Мои шаблоны, а затем сохраните шаблон в новой папке.

    Примечание: В Mac OS X 7 (Lion) папка Library по умолчанию скрыта. Чтобы отобразить папку библиотеки, в Finder откройте меню Перейти , а затем нажмите клавишу Option.

Создание шаблона на основе другого шаблона

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

Создание презентации на основе шаблона

Удаление шаблона из раздела "Мои шаблоны"

    В Finder откройте/пользователи/имя_пользователя /Library/Application Support support/Microsoft/Office/пользовательские шаблоны и Мои шаблоны.

    Примечание: В Mac OS X 7 (Lion) папка Library по умолчанию скрыта. Чтобы отобразить ее, в системе поиска щелкните меню Перейти , а затем нажмите и удерживайте клавишу OPTION.

    Перетащите в корзину шаблоны, которые нужно удалить.

Если вы часто работаете в MS Word, сохранение документа в качестве шаблона наверняка вас заинтересует. Так, наличие шаблонного файла, с установленным вами форматированием, полями и прочими параметрами, может во многом упростить и ускорить рабочий процесс.

Шаблон, создаваемый в ворде, сохраняется в форматах DOT, DOTX или DOTM. Последний разрешает работу с макросами.

Шаблон — это особый тип документа, при его открытии и последующем изменении создается копия файла. Исходный (шаблонный) документ при этом остается неизменным, как и его местоположение на диске.

В качестве примера того, каким может быть шаблон документа и зачем вообще он нужен, можно привести бизнес-план. Документы этого типа довольно часто создаются в Word, следовательно, используют их тоже довольно часто.

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

Документ, сохраненный в качестве шаблона, можно открыть и заполнить необходимыми данными, текстом. При этом, сохраняя его в стандартных для Word форматах DOC и DOCX, исходный документ (созданный шаблон), будет оставаться неизменным, как уже было сказано выше.

Большинство шаблонов, которые могут вам понадобиться для работы с документами в Ворде, можно найти на официальном сайте (). Кроме того, в программе можно создавать собственные шаблоны, а также изменять уже существующие.

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

Создание собственного шаблона

Проще всего будет начать создание шаблона с пустого документа, для открытия которого достаточно просто запустить Word.

Если вы используете одну из последних версий MS Word, при открытии программы вас будет встречать стартовая страница, на которой уже можно будет выбрать один из доступных шаблонов. Особенно радует то, что все они удобно рассортированы по тематическим категориям.

И все же, если вы сами хотите создать шаблон, выберите “Новый документ” . Будет открыт стандартный документ с установленными в нем параметрами по умолчанию. Эти параметры могут быть, как программными (заданными разработчиками), так и созданными вами (если ранее вы сохраняли те или иные значения в качестве используемых по умолчанию).

Используя наши уроки, внесите необходимые изменения в документ, который в дальнейшем будет использоваться в качестве шаблона.

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

Уроки по работе с Ворд:
Вставка рисунка
Добавление подложки
Изменение фона в документе
Создание блок-схем
Вставка знаков и специальных символов

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

1. Нажмите кнопку “Файл” (или “MS Office” , если используете старую версию Word).

3. В выпадающем меню “Тип файла” выберите подходящий тип шаблона:

  • Шаблон Word (*.dotx): обычный шаблон, совместимый со всеми версиями Ворда старше 2003 года;
  • Шаблон Word с поддержкой макросов (*.dotm): как понятно из названия, данный тип шаблонов поддерживает работу с макросами;
  • Шаблон Word 97 — 2003 (*.dot): совместим со старыми версиями Ворд 1997 — 2003.

4. Задайте имя файла, укажите путь для его сохранения и нажмите “Сохранить” .

5. Созданный и настроенный вами файл будет сохранен в качестве шаблона в заданном вами формате. Теперь его можно закрыть.

Создание шаблона на основе существующего документа или стандартного шаблона

1. Откройте пустой документ MS Word, перейдите во вкладку “Файл” и выберите пункт “Создать” .

Примечание: В последних версиях Ворда при открытии пустого документа пользователю сразу предлагается перечень шаблонных макетов, на основе которых можно создать будущий документ. Если вы хотите получить доступ ко всем шаблонам, при открытии выберите “Новый документ” , а затем уже выполните действия, описанные в пункте 1.

2. Выберите подходящий шаблон в разделе “Доступные шаблоны” .

Примечание: В последних версиях Word ничего выбирать не нужно, список доступных шаблонов появляется сразу после нажатия на кнопку “Создать” , непосредственно над шаблонами находится перечень доступных категорий.

3. Внесите в документ необходимые изменения, воспользовавшись нашими советами и инструкциями, представленными в предыдущем разделе статьи (Создание собственного шаблона).

Примечание: Для разных шаблонов стили оформления текста, которые доступны по умолчанию и представлены во вкладке “Главная” в группе “Стили” , могут быть разными и заметно отличаться от тех, что вы привыкли видеть в стандартном документе.

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

4. После того, как вы внесете необходимые изменения в документ, выполните все те настройки, которые посчитаете нужными, сохраните файл. Для этого нажмите на вкладку “Файл” и выберите “Сохранить как” .

5. В разделе “Тип файла” выберите подходящий тип шаблона.

6. Задайте имя для шаблона, укажите через “Проводник” (“Обзор” ) путь для его сохранения, нажмите кнопку “Сохранить” .

7. Шаблон, созданный вами на основе существующего, будет сохранен вместе со всеми внесенными вами изменениями. Теперь этот файл можно закрыть.

Добавление стандартных блоков к шаблону

Стандартными блоками называют многократно используемые элементы, содержащиеся в документе, а также те компоненты документа, которые хранятся в коллекции и доступны для использования в любое время. Хранить стандартные блоки и распространять их можно с помощью шаблонов.

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

1. Создайте, сохраните и закройте шаблон, созданный вами с учетом всех требований. Именно в этот файл будут добавляться стандартные блоки, которые в дальнейшем будут доступны другим пользователям созданного вами шаблона.

2. Откройте шаблонный документ, к которому необходимо добавить стандартные блоки.

3. Создайте необходимые стандартные блоки, которые в дальнейшем будут доступны для других пользователей.

Примечание: При введении сведений в диалоговое окно “Создание нового стандартного блока” введите в строке “Сохранить в” имя шаблона, к которому их необходимо добавить (это тот файл, который вы создали, сохранили и закрыли согласно первому пункту данного раздела статьи).

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

Добавление элементов управления содержимым к шаблону

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

Если в таком шаблоне будут присутствовать элементы управления содержимым, второй пользователь сможет подкорректировать список под себя, оставив его неизменным в самом шаблоне. Чтобы добавить в шаблон элементы управления содержимым, необходимо включить вкладку “Разработчик” в MS Word.

1. Откройте меню “Файл” (или “MS Office” в более ранних версиях программы).

2. Откройте раздел “Параметры” и выберите там пункт “Настройка ленты” .

3. В разделе “Основные вкладки” установите галочку напротив пункта “Разработчик” . Для закрытия окна нажмите “ОК” .

4. Вкладка “Разработчик” появится на панели управления Ворд.

Добавление элементов управления содержанием

1. Во вкладке “Разработчик” нажмите на кнопку “Режим конструктора” , расположенную в группе “Элементы управления ”.

Вставьте в документ необходимые элементы управления, выбрав их из представленных в одноименной группе:

  • Форматированный текст;
  • Обычный текст;
  • Рисунок;
  • Коллекция стандартных блоков;
  • Поле со списком;
  • Раскрывающийся список;
  • Выбор даты;
  • Флажок;
  • Повторяющийся раздел.

Добавление пояснительного текста к шаблону

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

1. Включите “Режим конструктора” (вкладка “Разработчик” , группа “Элементы управления” ).

2. Кликните по тому элементу управления содержимым, в котором необходимо добавить или изменить пояснительный текст.

Примечание: Пояснительный текст по умолчанию находится в небольших блоках. Если “Режим конструктора” отключен, эти блоки не отображаются.

3. Измените, отформатируйте замещающий текст.

4. Отключите “Режим конструктора” повторным нажатием на эту кнопку на панели управления.

5. Пояснительный текст будет сохранен для текущего шаблона.

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

По многочисленным просьбам читателей, мы сегодня будем делать дизайн, вернее макет сайта в Photoshop. Конечно если с этим никогда не сталкивался, сделать его довольно не просто, возникает множество вопросов, на которые я сегодня постараюсь ответить. Как оказывается, что материала по этому поводу в интернете не так уж и много. Дизайнеров куча, а как сделать макет сайта никто не рассказывает. Может быть я просто плохо искал? :)

Продолжение

В общем давайте уже делать.

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

Как видите, что шаблон получился не сложный, естественно это блоговый шаблон, который позже мы будем верстать в HTML. Ну а пока что только будем рисовать. Ну а теперь поехали.

Программное обеспечение

Первое, что Вам нужно это Photoshop. Если у Вас его нет, покупайте:-)

Создание и размеры документа

Чтобы создать новый документ в Фотошопе нужно зайти в «Файл» и кликнуть «Создать», затем появится окно, в котором нужно задать соответствующие размеры.

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

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

В моём случае сайт будет иметь ширину в 1200рх. Таким образом я сделал документ шириной в 1300 рх и высотой в 4000 рх. Остальные настройки оставьте как есть.

Фон шаблона сайта

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

Ширина будущего сайта в 1200 рх

Теперь нам нужно выставить размер будущего сайта, чтобы он выглядел так же как будет смотреться в браузере. Делать мы будем это с помощью линейки. Если она у Вас не активна, нужно зайти в «Просмотр» и поставить галочку на против «Линейка». Затем она должна появиться у Вас в окне просмотра.

А вот как она выглядит:

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

А сейчас нужно поставить линейку по центру нашего документа, вернее найти центр. Для этого наводим курсор на линейку на ней же зажимаем левую кнопку мыши и вытягиваем линию на наш документ. Тянем примерно на середину, линейка сама найдёт центр.

После того как мы нашли центр, нужно поместить наш сайт шириной в 1200 рх в центр документа который имеет размер в 1300 рх. Для этого выбираем инструмент «Прямоугольная область», сверху устанавливаем Стиль на Заданный размер, куда пишем вот такие значения: ширина — 1200рх, высота 400рх. Далее просто кликаем по нашему белому фону и у нас появится выделенная область той ширины которая нам нужна.

Теперь нашу выделенную область помещаем с помощью мышки по центру, она найдёт центр сама. Затем нужно вытащить ещё 2 линейки и установить их по обе стороны выделенной области. Таким образом мы обозначаем границы нашего будущего сайта, который будет иметь ширину в 1200 рх. Так же по этим линейка будет проще подгонять элементы дизайна. Если Вам не понятно сделайте так же как на рисунке ниже.

Линейку мы будем использовать и в дальнейшем, так как без неё здесь не обойтись, она позволяет выставить всё ровно.

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

Создание дизайна или макета сайта

Важно!

Всегда создавайте группы для слоёв и давайте им названия. Потому что в дальнейшем точно запутаетесь!

Группы

Создаём группу, и называем её «Хидер» (Шапка) в ней же создаём под группу «Верхнее меню» так как будем начинать именно с него. В группе создаём новый слой и называем его «фон». Это будет фон нашего верхнего меню.

Вот что должно получиться:

Верхнее меню

Опять вытягиваем линейку и выставляем её как на рисунке:

Выбираем инструмент «Прямоугольная область» и выделяем вдоль горизонтальной линейки:

В палитре цветов вбиваем вот этот цвет #0dbfe5, выбираем инструмент «Заливка» и заливаем выделенную область, затем нужно отменить выделение во вкладке «Выделение» нажмите на «Отменить выделение»:

Кликаем на инструмент «Горизонтальный текст». Сверху в панели выбираем шрифт «Segoe UI». Теперь кликаем на голубом фоне меню и пишем название наших страниц. Потом Вы можете переместить текст куда Вам нужно.

Теперь создаём разделители между страницами. И сделаем им небольшой эффект вдавленности. Создаём новый слой, выбираем инструмент «Линия». Затем зажимаем Shift и рисуем вертикальную линию через весь голубой фон нашего меню.

По слою с фигурой нажимаем два раза мышкой, откроется окно со стилем слоя. Ставим галочки на против «Наложение цвета» И вбиваем туда вот этот цвет #0aaacc.

Переходим в пункт «Тень» и задаём следующие параметры:

Вот, что должно получиться:

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

Иконки социальных закладок

Здесь же в меню только с правой стороны мы добавим иконки закладок. В моём случае это , но можно поставить и обычные скачанные иконки. Скачать можете вот .

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

Потом создаём группу, называем её «Социальные закладки», создаём в ней новый слой. Теперь кликаем по инструменту «Произвольная фигура» выбираем нужную фигуру:

Наводим курсор в то место где будет иконка, зажимаем Shift, (для того чтобы иконка появилась ровная) и растягиваем до нужных размеров. И такой же процесс повторяем со следующими фигурами. В конечном итоге вот что должно получиться:

Переходим к логотипу. Опять же создаём отдельную группу для логотипа и в новый слой.

Логотип

Переходим на этот сайт и качаем шрифт. Выбираем инструмент «Горизонтальный текст». Ищем в поле со шрифтами название нашего шрифта Olivier. Кликаем на то место где будет располагаться лого и пишем название на Английском, потому что этот шрифт не поддерживает кириллицу. Вот что должно получиться:

Создаём группу «Нижнее меню» и новый слой.

Нижнее меню (Главное)

Выставляем линейки как на рисунке:

Выбираем инструмент «Прямоугольная область» и выделяем. Затем выделенную область заливаем вот этим цветом #303030. Вот что должно получиться:

Отменяем выделение во вкладке «Выделение». Теперь идём во вкладку Фильтры — Шум и выбираем Добавить шум. Потом выставляем такие значения:

Добавляем линии. Делаются они так же как и в верхнем меню только изменён сам цвет линии. Думаю, что вы справитесь, и должно получиться вот что:

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

Как обычно в группе «Хидер» создаём группу «Инфо панель» с новым слоем.

Панель с информацией

Для начала добавляем полосы с линейки как на рисунке ниже:

Выбираем инструмент «Прямоугольная область» и выделяем область прям под меню, и заливаем её чёрным цветом #000000

Отменяем выделение, берём «Горизонтальный текст» изменяем размер шрифта на 48 пт и цвет #a4a4a4. Пишем «Последние Записи». Вот, что у Вас должно получиться в итоге:

Контент

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

Сразу же нужно создать 2 отдельных группы:

  • Метки — в эту группу мы будем добавлять текст с размером наших колонок.
  • Контент — группа где будет находиться вся наша середина сайта.

В группе контент создаём под группу «Левый», в которой будут находиться наши блоки с записями.

Выбираем инструмент «прямоугольная область», задаём ей стиль «заданный размер» и выставляем ширину 800рх высоту 100рх. Вот итог:

Добавляем линии с линейки как на рисунке, и отменяем выделение:

В группе «Контент» делаем под группу с названием «Правый» (Сайтбар). Будем размечать место для правой колонки сайта.

Опять берём «прямоугольная область», а вот в стиле области задаём немного меньший размер в ширину 350рх высоту оставим ту же в 100рх. И далее делаем всё как на рисунке:

Вот теперь мы точно знаем где будут блоки с записями и сайтбар. И всё будет ровно.

Помните мы создали группу метки? Там просто создайте слой с надписями размеров блоков, вот как у меня:

Эти метки очень помогут при вёрстке. Не нужно будет вспоминать размеры.

Блоки с записями

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

В группе «Левый» создаём подгруппу «блок» и новый слой.

Опять выбираем инструмент «Прямоугольная область». В стиле задаём размеры 800 х 300. Подгоняем под линии. Потом заливаем вот этим цветом #d9d9d9. Это у нас получилась миниатюра.

В той же группе добавьте метку с помощью текста как у меня на рисунке выше.

Теперь давайте добавим заголовок к записи. Берём «Горизонтальный текст» ставим размер в 35 пт и цвет чёрный. Добавляем прям под миниатюрой:

Добавляем информацию к посту. Ставим размер шрифта в 14 пт и цвет ближе к серому:

И описание к посту:

Теперь добавляем текст и смотрим, что у нас получилось:

Чтобы записи хоть не много разделить, давайте создадим простой разделитель из кругов.

Создаём группу «Разделитель», выбираем «Овальная область» создаём слой. И под блоком записей зажимая Shift рисуем круг, затем заливаем его вот этим цветом #efefef.

Отменяем выделение и ищем середину круга с помощью линейки

Выбираем слой с нашим кружком на нём же нажимаем правую кнопку мыши и выбираем «Создать дубликат слоя». Перетащите его немного влево.

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

Вот что должно получиться:

Копируем слой этого маленького круга опять перемещаем его влево. Так же точно уменьшаем его размер как написано выше, чтобы получилось вот так:

Сейчас Вам нужно создать дубликат среднего круга и переместить его вправо, и тоже самое сделать с маленьким кругом. Чтобы было понятнее сделайте как на рисунке:

А вот что получилось только в нормальном размере:

Сейчас размещаем блок записей под блоком. Создаём дубликат нашей группы «Блок» На панели инструментов выбираем курсор (самый верхний). И перетаскиваем наш блок записей вниз. и так делаем раз 5.

Сайдбар (правая колонка)

Находим нашу группу «Сайдбар», и создаём в ней подгруппу «Поиск». С помощью линии делаем вот так:

Выбираем инструмент «Прямоугольная область» и выделяем поле для поиска, затем заливаем его вот этим цветом #eeeeee

Не забываем отменить выделение, кликаем на инструмент «Горизонтальный текст» и в сером поле пишем слово Поиск

Слева выбираем инструмент «Произвольная фигура» и сверху ищем фигуру лупы. Она есть в стандартных фигурах. Создаём слой в группе «Поиск» наводим на поле и рисуем нашу фигуру удерживая Shift.

Поле поиска готово. Теперь переходим к виджетам.

Создаём группу «виджет» и новый слой в ней. Затем добавляем линий как на рисунке. Это будет фон нашего заголовка, и заливаем его эти цветом #eeeeee

В наш заголовок теперь нужно добавить сам заголовок, делаем это с помощью текста. А ещё добавим иконку к заголовку. Для этого нужно выбрать любую фигуру которая по душе, и которая по смыслу подходит:) Не забываем зажимать Shift когда добавляем фигуру. И залейте её вот этим цветом #0dbfe5

И конечно же нужно добавить записи к нашим виджетам. Нужно выбрать инструмент «горизонтальный текст», затем установить размер в 16 пт. И сделать ка на рисунке ниже

Затем просто создаём дубликат группы и перетаскиваем виджет вниз. Делаем то же самое что и с постами.

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

Футер (Низ сайта)

Ну как же без него. В этом шаблоне он тоже не сильно сложный.

Всё как обычно создаём группу «Футер» и слой в ней. И размечаем его с помощью линейки, выбираем наш уже любимый инструмент «прямоугольная область» выделяем его и заливаем #0dbfe5

Отменяем выделение. Берём «Горизонтальный текст» находим тот шрифт, который мы скачали (Olivier), и вписываем наш логотип, только цвет текста делаем чуть темнее.

А с правой стороны нашего футера добавляем меню такое же как сверху только без линии. Его даже можно просто скопировать и переместить вниз.

Вот и всё, друзья, у нс готовый макет, который уже можно верстать:)

Ещё, вот Вам его PSD файл. Скачивайте, и смотрите если что то не поняли.

Друзья, если Вам что нибудь будет не понятно, обязательно спрашивайте в комментариях.

До скорых встреч.