This project contains some helpers to make image processing and handling in asp.net core websites easier.
Caution: This is not finished jet!
This is a nuget package containing the middleware for resizing images on request.
The build environment for this project is on Visual Studio Team Services and can be found here kirkone.visualstudio.com
Name | Status |
---|---|
KK.AspNetCore.Images-CI | |
Alpha | |
Beta | |
Release |
The picture
ThagHelper will take the settings from the appsettings.json
and adds a source
for every configured size.
This contains the name of the image you want to be used without the extension.
You must provide this attribute otherwise the TagHelper will not be used.
Here you can provide a text for the alt
attribute of the image tag inside the picture
element.
This attribute is optional.
Here you can provide a text for the class
attribute of the image tag inside the picture
element.
This attribute is optional.
Here you can provide some additional style. This will be added to the image tag inside the picture
element.
This attribute is optional.
The following TagHelper:
<picture class="awesome_image" style="width: 100%;" src="DSC01766" alt="A simple text." />
will become:
<picture>
<source media="(max-width: 450px)" srcset="/images/generated/DSC01766/small.jpg, /images/generated/DSC01766/small2x.jpg 2x">
<source media="(max-width: 600px)" srcset="/images/generated/DSC01766/medium.jpg, /images/generated/DSC01766/medium2x.jpg 2x">
<source srcset="/images/generated/DSC01766/large.jpg">
<img class="awesome_image" style="width: 100%;" alt="A simple text." src="DSC01766">
</picture>
This web site uses the two helpers above and shows how to use each of them.
The ThagHelper is used on the Gallery page.
For the configuration have a look in the Startup.cs
and appsettings.json
.