Я экспериментирую с созданием сайта, используя Jekyll для друга.
Я пытаюсь преобразовать материал из файлов, таких как /_events/2020-02-25-an-event.md
и /_events/2020-02-26-another-event.md
, во что-то, что можно легко встроить в совокупность различных строительных блоков контента и результатов на этих страницах, которые просматривает посетитель, включая <script type="application/ld+json">...</script>
теги, соответствующие schema.org, событию стандартам.
Файл, подобный /_events/2020-02-25-an-event.md
выглядит следующим образом:
---
layout: event
title: An event
published: true
startdatetime: 2020-02-28
venue: Best Club Ever
---
Члены коллекции events
предназначены для отображения в виде отдельных просматриваемых URL-адресов и должны иметь фрагмент JavaScript, скрывающий в отображаемом выводе, например:
<script type="application/ld+json">
[
{
"@context" : "http://schema.org",
"@type" : "Event",
"name" : "An event",
"startDate" : "2020-02-28",
"location" : "Best Club Ever blah blah ... have address stuff to work out, still"
}
]
</script>
Я получил эту работу, написав /_plugins/event_schema.rb
следующим образом:
require 'liquid'
module EventSchemaFilters
def do_not_use_me_directly_single_json_curly(input_object)
%Q(
{
"@context" : "http://schema.org",
"@type" : "Event",
"name" : "#{input_object['title']}",
"startDate" : "#{input_object['startdatetime']}",
"location" : "#{input_object['venue']}"
}
)
end
def event_single_schema_script(input_object)
%Q(
<script type="application/ld+json">
[
#{do_not_use_me_directly_single_json_curly(input_object)}
]
</script>
)
end
def event_multiple_schema_script(input_object_array)
%Q(
<script type="application/ld+json">
[
#{input_object_array.map(&method(:do_not_use_me_directly_single_json_curly)).join(',')}
]
</script>
)
end
def event_multiple_schema_script(input_object_array)
%Q(
<script type="application/ld+json">
[
#{input_object_array.map(&method(:do_not_use_me_directly_single_json_curly)).join(',')}
]
</script>
)
end
end
Liquid::Template.register_filter(EventSchemaFilters)
И затем, написав /_layouts/event.html
(который просматривает макет «страницы», который выглядит как « «макет по умолчанию» как:
---
layout: page
---
{{ page | event_single_schema_script }}
К сожалению, если я напишу /index.md
, как это, в то время как я получаю небольшой набор предстоящих событий, он отображается в окружении <code>
...
теги и отображаются в теле т Домашняя страница:
---
title: Home Page
layout: default
---
# {{ page.title }}
{{ site.events | event_multiple_schema_script }}
Желание, чтобы этот скрипт был частью DOM JavaScript ..., а не частью текста на странице:
<script type="application/ld+json">
[
{
"@context" : "http://schema.org",
"@type" : "Event",
"name" : "An event",
"startDate" : "2020-02-28",
"location" : "Best Club Ever blah blah ... have address stuff to work out, still"
}
,
{
"@context" : "http://schema.org",
"@type" : "Event",
"name" : "Another event",
"startDate" : "2020-02-27",
"location" : "Less Good Club blah blah ... have address stuff to work out, still"
}
]
</script>
Перемещение {{ site.events | event_multiple_schema_script }}
быть содержимым /_includes/event_all_schema_script.html
, и попытка {% include event_all_schema_script.html %}
вообще не помогла - та же проблема.
Удаление вызова на {% include event_all_schema_script.html %}
из /index.md
и помещение его в /_layouts/default.html
вместо выводит так, как я хочу. Но теперь он есть на каждой странице, включая такие, как https://example.com/events/2020-02-25-an-event/
, а это не то, что я хочу. Но это показывает, что моя проблема в том, что я написал что-то, что я не могу просто «вставить» в уценку ... вещи ... которая станет веб-страницей.
Вещи, которые также работают в /index.md
, но это не то, что я хочу сделать:
- Почерк
<script>...</script>
код прямо в него - Ввод
{% include event_all_schema_script_hardcode.html %}
в него, где /_includes/event_all_schema_script_hardcode.html
буквально просто <script>...</script>
текст, скопированный из вывода, который я показал всем вам. - Если бы материал "генераторы для чайников" не было так сложно найти (документация Jekyll не очень обширна; Google бесполезен, потому что фраза "генератор сайтов * stati c" является распространенной ) , может быть, я мог бы написать код, который сделал бы возможным создание такого файла во время сборки? Это похоже на довольно высокую планку, чтобы преодолеть, хотя., С моими текущими знаниями Джекила / Ruby.
Я открыт, чтобы перестроить это, путь. Не привязан к идее «фильтрации» таких вещей, как site.events
, et c. Это так же далеко, как я получил в своем «привет мире».
Единственные принципы, к которым я действительно привязан в окончательном проекте:
- Все данные вводятся в календарь «событий» должно быть сделано через передний план элементов в коллекции
events
(поэтому я могу получить CMS, например Forestry.io или Netlify CMS, чтобы с ним было приятно играть) . - Вычисление содержимого блока
<script>...</script>
должно происходить в «независимом, вставляемом компоненте». - Я не хочу делать большую жидкость l oop внутри
/_layouts/homepage.html
, которую я должен напомнить веб-дизайнеру, чтобы скопировать / вставить в /_layouts/better_homepage.html
. - Вместо этого я просто хочу быть в состоянии сказать веб-дизайнеру: «Эй, если вы хотите, чтобы метаданные страницы включали в себя ленту событий, просто вставьте
{% include event_all_schema_script.html %}
куда-нибудь в нее или в ее макет». - Я хочу
{% include event_all_schema_script.html %}
, или кто-то другой, кто поможет мне в этом, работать над телом страниц / записей / коллекций и разметкой.
- Я собираюсь взять Из того, что я узнал из этого, можно также написать «простые старые DIV для веб-дизайнеров, стилизировать их по своему усмотрению», такие как
/_includes/event_all_div.html
и /_includes/event_single_div.html
, и разрешить их использовать везде, где веб-дизайнер сочтет нужным - в уценке или в макете. - Опять же, я не веб-дизайнер. Я просто человек преобразования структуры данных. Моя единственная цель - создать красивые, «скучные» фрагменты HTML, которые готовы для правильного веб-дизайнера использовать и стилизовать по своему усмотрению.
Есть какие-нибудь мысли о том, как я могу улучшить эту попытку рендеринга HTML, чтобы она была удобна как для макета, так и для уценки?
Большое спасибо.