Image Component

Package Name:

fifthtry.github.io/images

images can be used as part of blog post, section OR chapter etc. To use images on your web package, add below into FPM.ftd file:

-- fpm.dependency: fifthtry.github.io/images as image
-- fpm.auto-import: image

-- fpm.dependency: fifthtry.github.io/images as image
-- fpm.auto-import: image

Once you add above lines into your web package, add image into your .ftd files:

1.1: -- left-hug with caption and body

Example code for -- left-hug

-- image.left-hug: Figure: 1.1 - an lorem ipsum dor se
image: $assets.files.image.png

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod
tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim
veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex
ea commodo cons

-- image.left-hug: Figure: 1.1 - an lorem ipsum dor se
image: $assets.files.image.png

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod
tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim
veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex
ea commodo cons

Output of above:

Figure: 1.1 - an lorem ipsum dor se

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo cons

1.2: -- right-hug with caption and body

Example code for -- right-hug

-- image.right-hug: Figure: 1.1 - an lorem ipsum dor se
image: $assets.files.image.png

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod
tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim
veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex
ea commodo cons

-- image.right-hug: Figure: 1.1 - an lorem ipsum dor se
image: $assets.files.image.png

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod
tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim
veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex
ea commodo cons

Output of above:

Figure: 1.1 - an lorem ipsum dor se