Использование BoltCMS для создания веб-сайта для малого бизнеса

Если мы перейдем к нашей панели администратора, вы заметите, что в разделе «Содержимое» мы можем ввести три различных типа контента:

• страницы
• Записи
• Витрины

На самом деле это типы содержимого, и все они определены в нашем файле contenttypes.yml . Болт облегчает нам Configuration > Contenttypes , и мы можем получить доступ к этому файлу напрямую через администратора ( Configuration > Contenttypes ). Изучив текущее содержимое этого файла, давайте продолжим и удалим все, кроме типа содержимого pages . Наш файл должен теперь выглядеть так:

 # Pages - used for the static pages like about, contact, etc. pages: name: Pages singular_name: Page fields: title: type: text class: large group: content slug: type: slug uses: title image: type: image teaser: type: html height: 150px body: type: html height: 300px template: type: templateselect filter: '*.twig' taxonomy: [ chapters ] recordsperpage: 100 

Когда вы сохраните это, вы должны заметить, что у вас больше нет доступа к entries и типам контента. Давайте попробуем создать свой собственный отзыв, прежде чем добавлять какой-либо контент. Перейдите к разделу «Определение типов контента» в документации, и давайте немного прочтем. Нам определенно потребуются name и name singular_name , и наши поля будут такими, как мы упоминали выше. Давайте добавим наш тип контента:

 # Testimonials testimonials: name: Testimonials singular_name: Testimonial fields: name: type: text class: large position: type: text body: type: textarea height: 150px 

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

Получение содержимого из записей базы данных

Мы собираемся вернуться немного назад, потому что мы проигнорировали несколько важных функций. По умолчанию Bolt ищет record.twig шаблона record.twig для вывода «записи» или записи типа контента. Если мы выполним предварительный просмотр только что созданного record.twig , мы получим сообщение об ошибке, сообщающее, что Болт пытался использовать record.twig , а его не существует. Давайте создадим это и добавим какой-нибудь фиктивный контент:

 {% include '_header.twig' %} <main> <div class="container"> <div class="page-header"> <h1>Record!</h1> <p>This is a generic record.</p> </div> <div class="page-content"> <h2>Record Stuff Here</h2> <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Sint eum tempore optio corporis aspernatur tempora temporibus vero maxime consectetur dolorum dolore vel numquam aut iure, esse, repudiandae nemo animi, vitae.</p> </div> </div> </main> {% include '_footer.twig' %} 

Теперь, если мы нажмем кнопку «Обновить» в нашем предварительном просмотре, мы увидим, что мы создали общую страницу записи с фиктивными данными. Это подводит нас ко второму пункту. Маловероятно, что шаблон для отзыва будет таким же, как шаблон для статической страницы, поэтому давайте исправим это. Вернувшись к документам определения типов контента , мы увидим еще несколько интересных вещей:

• record_template — шаблон для отображения одной записи типа контента
• listing_template — шаблон для отображения коллекции записей типа контента

Как мы уже знаем, по умолчанию, record_template будет использовать record.twig шаблона record.twig по умолчанию. Для listing_template он будет искать файл listing.twig по умолчанию. Однако мы можем переопределить их в нашей конфигурации нашего типа контента. Давайте обновим это так:

 # Testimonials testimonials: name: Testimonials singular_name: Testimonial fields: name: type: text class: large position: type: text body: type: textarea height: 150px listing_template: testimonials.twig record_template: testimonial.twig 

Теперь давайте создадим соответствующие файлы testimonials.twig и testimonial.twig . Вот два файла, которые я создал:

testimonials.twig

 {% include '_header.twig' %} <main> <div class="container"> <div class="page-header"> <h1>Testimonials!</h1> <p>All the testimonials be here.</p> </div> <div class="page-content"> <p>All testimonials...</p> </div> </div> </main> {% include '_footer.twig' %} 

testimonial.twig

 {% include '_header.twig' %} <main> <div class="container"> <div class="page-header"> <h1>Testimonial!</h1> <p>This is a testimonial.</p> </div> <div class="page-content"> <p>Testimonial content...</p> </div> </div> </main> {% include '_footer.twig' %} 

Теперь мы можем получить доступ к странице обзора в браузере, например, через /testimonials , и к нашей первой записи через /testimonial/1 (которая является структурой по умолчанию для записей). Давайте сосредоточимся на одном отзыве пока и получим данные. Внутри одной страницы записи у нас есть доступ к значениям record . Чтобы улучшить читаемость кода, мы можем получить к нему доступ по имени записи, в нашем случае — по testimonial . Если мы пойдем дальше и введем {{ dump(testimonial) }} в нашем шаблоне записи, мы увидим всю запись, выведенную на экран.

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

 {{ testimonial.name }} 

Имея это в виду, давайте настроим наш шаблон для добавления содержимого:

 {% include '_header.twig' %} <main> <div class="container"> <div class="page-header"> <h1>{{ testimonial.name }} | <small>{{ testimonial.position }}</small></h1> <time>{{ testimonial.datecreated|date("jS F, Y") }}</time> </div> <div class="page-content"> {{ testimonial.body }} </div> </div> </main> {% include '_footer.twig' %} 

Теперь, создание большего количества отзывов и просмотр их должны быть легкими. Теперь давайте перейдем к нашему шаблону testimonials.twig и попытаемся получить все отзывы. Как и раньше, мы можем получить доступ к «записям» по имени. Мы можем обратиться к records или, в этом случае, к testimonials . Идите и выбросьте это на свою страницу, и вы увидите их все.

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

 {% include '_header.twig' %} <main> <div class="container"> <div class="page-header"> <h1>Testimonials</h1> <p>All the testimonials for this great company be here.</p> </div> <div class="page-content"> {% for testimonial in testimonials %} <div class="testimonial"> <h3>{{ testimonial.name }} | <small>{{ testimonial.position }}</small></h3> <p>{{ testimonial.body|excerpt(100) }}</p> </div> {% endfor %} </div> </div> </main> {% include '_footer.twig' %} 

И вот, пожалуйста! Перейдите к /testimonials , и вы увидите зацикленный форматированный вывод. Теперь идите вперед, заполните свою страницу about и страница контактов и попробуйте вывести записи в шаблонном файле generic record.twig . Если вы чувствуете, что вам нужен определенный шаблон для страниц, создайте файл page.twig и page.twig же, как описано выше. Теперь вы на правильном пути к созданию своего сайта именно так, как вы хотите.

Примечание к изображениям и медиа

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

В терминологии Bolt изображения хранятся «в стеке». Это просто означает, что есть стопка изображений, которые вы загрузили вручную. Если вы посмотрите на структуру каталогов, вы увидите каталог files . Здесь хранятся загрузки. Когда вы загружаете файл в администраторе, он сохраняет его в подкаталоге, ссылаясь на год и месяц загрузки. Теперь, если у вас есть обычное поле HTML в вашем типе контента, и вы пытаетесь вставить туда изображение, вы можете быть немного запутаны в этом вопросе. Там нет реальной кнопки для загрузки изображения! Почему это?

По умолчанию Bolt отключает кнопку изображения в редакторе WYSIWYG. К счастью для нас, это легко доступно из основного файла конфигурации. Внутри администратора зайдите в settings -> configuration -> main configuration и прокрутите вниз до раздела WYSIWYG. Там вы можете изменить настройку изображений на true. Вернувшись в редактор записей, вы теперь можете вставлять изображения так, как вы ожидаете.

Куда пойти отсюда

У Болта есть гораздо больше, чем то, что мы видели, и это то, с чем приятно работать. Это многофункциональный, но только когда вы хотите, чтобы это было. Он остается легким и быстрым на протяжении всего процесса разработки и производства, а также выглядит просто и естественно. С этого момента я рекомендую прочитать документацию. Это действительно хорошо написано и легко следовать, и это отвечает на многие ваши вопросы. Моими двумя главными разделами выбора в документах для повышения ваших знаний и рабочего процесса будут выборка контента и теги шаблонов . После этого вы смотрите на нумерацию страниц, поиск, расширение Bolt и работы.

Спасибо за чтение, и я надеюсь, что эта статья дала вам отличное представление о создании с помощью Bolt CMS. Если вы являетесь разработчиком WordPress или Drupal, я настоятельно рекомендую вам открыть свой разум для новых платформ, таких как Bolt. Вы не будете разочарованы вообще!