В этой главе мы будем понимать связь изображений в Grav. Grav позволяет связывать изображения с одной страницы на другую и даже на удаленные страницы. Если вы связали файлы с помощью HTML, это будет очень легко понять, связывая изображения в Grav.
Используя эту структуру, мы увидим, как отображать мультимедийные файлы на странице, используя различные типы ссылок. Каждая папка в этой структуре содержит изображения, и в /02.green/img01 есть специальный каталог, который действует как страница, но содержит только медиа-файлы.
Давайте рассмотрим некоторые из общих элементов тега изображения Grav на основе уценки.
![Alt Text](../path/image.ext)
-
! — Он указывает тег изображения, когда вы размещаете его в начале тега ссылки уценки.
-
[] — Определяет необязательный alt-текст для изображения.
-
() — Он помещается непосредственно после квадратной скобки, которая содержит путь к файлу.
-
../ — Это указывает на перемещение вверх по каталогу.
! — Он указывает тег изображения, когда вы размещаете его в начале тега ссылки уценки.
[] — Определяет необязательный alt-текст для изображения.
() — Он помещается непосредственно после квадратной скобки, которая содержит путь к файлу.
../ — Это указывает на перемещение вверх по каталогу.
Grav использует пять типов ссылок на изображения, как указано ниже —
-
Относительный слизень
-
Справочник Относительный
-
абсолют
-
Дистанционный пульт
-
Действия СМИ над изображениями
Относительный слизень
Справочник Относительный
абсолют
Дистанционный пульт
Действия СМИ над изображениями
Относительный слизень
Он устанавливает относительные ссылки на изображения на текущей странице и связывает другой файл в том же каталоге. При использовании относительных ссылок местоположение исходного файла так же важно, как и место назначения. Если вы измените путь в файле во время перемещения, то ссылка может быть нарушена. Преимущество использования этой структуры связывания изображений заключается в том, что вы можете переключаться между локальным сервером разработки и действующим сервером с другим доменным именем, если структура файла остается постоянной.
пример
![link](../water/img01/img.jpg)
Здесь ../ указывает, что ваша ссылка перемещается вверх на одну папку, а затем вниз на одну папку, и img.jpg является местом назначения.
Когда вы используете вышеуказанный путь, вы получите следующий вывод —
Grav поддерживает слагов в заголовке основного файла разметки страницы, и этот слаг заменяет имя папки для данной страницы.
Если в папке 01.sky установлен slug через ее файл .md , т.е. /pages/01.blue/01.sky/text.md , тогда заголовок файла будет выглядеть так:
--- title: Sky slug: test-slug taxonomy: category: blog ---
В приведенном выше коде мы установили slug test-slug, который является необязательным. После того, как вы установите slug, вы можете сделать ссылку на медиа-файл, в котором для ссылки будет установлен Slug Relative или Absolute URL.
Справочник Относительный
В этом типе ссылки вы можете установить относительные ссылки на изображения на текущей странице. Вместо использования URL-слагов, вы можете ссылаться по полному пути с именами их папок в каталогах относительно ссылок на изображения.
пример
![My image](../../blue/img01/img.jpg)
Когда вы используете вышеуказанный путь, он будет отображать вывод, как показано ниже —
абсолют
Абсолютные ссылки такие же, как относительные ссылки, но единственное отличие состоит в том, что они относятся к корню сайта и присутствуют в каталоге / user / pages / .
Вы можете использовать абсолютные ссылки двумя разными способами —
-
Вы можете использовать относительный стиль слагов, который включает в себя имена слагов или каталогов в пути и обычно используется в абсолютных ссылках.
-
Вы можете использовать Absolute Link, которая открывает ссылку с / .
Вы можете использовать относительный стиль слагов, который включает в себя имена слагов или каталогов в пути и обычно используется в абсолютных ссылках.
Вы можете использовать Absolute Link, которая открывает ссылку с / .
![My image](/blue/img01/img.jpg)
Когда вы используете вышеуказанный путь, вы получите следующий вывод —
Дистанционный пульт
Удаленные ссылки на изображения позволяют отображать любой медиа-файл напрямую через его URL. Эти ссылки не включают контент вашего собственного сайта. В следующем примере показано, как отобразить изображение с помощью удаленного URL —
![Remote Image 1](http://www.freedomwallpaper.com/nature-wallpaper/spring_nature-wide.jpg)
Когда вы нажимаете на ссылку, как показано на рисунке ниже, она будет отображать изображение с данного URL.
Действия СМИ над изображениями
Изображения, связанные со страницами, позволяют нам использовать преимущества медиа-действий Grav . При создании контента в Grav вы можете отображать некоторые мультимедийные файлы, такие как изображения, видео и другие файлы.
пример
Вы можете загрузить изображение, используя формат, указанный ниже —
![Styling Example](../img01/img.jpg?cropResize = 400, 200)
Когда вы используете вышеуказанный путь, вы получите вывод, как показано ниже —