Download the PHP package sushidev/fairu-statamic without Composer
On this page you can find all versions of the php package sushidev/fairu-statamic. It is possible to download/install these versions without Composer. Possible dependencies are resolved automatically.
FAQ
Example:
In general, it is recommended to use always a project to download your libraries. In an application normally there is more than one library needed.
- Some hosting areas are not accessible by a terminal or SSH. Then it is not possible to use Composer.
- To use Composer is sometimes complicated. Especially for beginners.
- Composer needs much resources. Sometimes they are not available on a simple webspace.
- If you are using private repositories you don't need to share your credentials. You can set up everything on our site and then you provide a simple download link to your team member.
- Simplify your Composer build process. Use our own command line tool to download the vendor folder as binary. This makes your build process faster and you don't need to expose your credentials for private repositories.
Informations about the package fairu-statamic
This is the official Fairu addon for Statamic.
Fairu is your new powerful image and file proxy with the goal in mind to deliver your files in an optimized way.
Features
This addon provides:
- Import all your assets into fairu.app using our commands
- Antlers tags making image handling smooth sailing.
- Fieldset to easily embed Fairu hosted files into your new or existing project
How to use
You can install this addon via Composer:
Add env variables
Find your tenant ID in the tenant settings and create an API key for your application.
Import
On an existing project, you can run the following command which will automatically import all the connected assets into your fairu account. Depending on on the amount of files it might take some time.
After the initial import, file paths will be transformed into the new Fairu-ID format dynamically.
Antlers tags
There are several tags available to generate different code.
Metadata
[!NOTE] The tags generally don't fetch metadata from the Fairu server and build the file path locally. Use the
fetchMetaparameter to fetch the asset information from Fairu.
You can fetch metadata by passing fetchMeta="true" to the tags, which makes the metadata accessible:
- alt
- caption
- description
- copyrights
- focal_point (
x-y-zoome.g.40-30-1) - focus_css (e.g.
40% 30%) - name
- size
- is_image | is_video | is_pdf | is_audio | mime | extension
- width | height
- ...
Available parameters
| Field | Description | fairu | :url | :image | :images |
|---|---|---|---|---|---|
| id | The file ID | ✓ | ✓ | ✓ | ✓ |
| name | Custom filename | ✓ | ✓ | ✓ | ✓ |
| alt | Custom alt | ✓ | ✓ | ✓ | |
| width | Resize image width | ✓ | ✓ | ✓ | |
| height | Resize image height | ✓ | ✓ | ✓ | |
| quality | Image quality (default: 90) | ✓ | ✓ | ✓ | |
| sources | Semicolon separated srcset entries | ✓ | ✓ | ✓ | |
| ratio | Aspect ratio for sources | ✓ | ✓ | ✓ | |
| format | Convert image format | ✓ | ✓ | ✓ | |
| fit | cover / contain the image | ✓ | ✓ | ✓ | |
| focal_point | Focal point for cropping | ✓ | ✓ | ✓ |
{{ fairu }}
Get the file and get access to image properties.
{{ fairu:url }}
Get the URL of a file.
{{ fairu:image }}
Generate a complete HTML image tag.
{{ fairu:images }}
Generate multiple HTML image tags (see [[#{{ fairu image }}]])
Responsive Images
With most of our tags you have easy access to implementing responsive images using the native srcset and sizes properties to define when which source (version of the image) should be used. See the mdn documentation for a great introduction into implementing responsive images.
Implementation
The sources attribute provides a way to easily pass an array of widths, breakpoints and optionally heights to generate a srcset property that includes all listed sources.
This allows you to pass the sources property and use the calculated srcset property along with a fitting sizes to define which sources should be used when:
Formats
Each pair consists of:
- A width value (in pixels) that defines the image width at that breakpoint
- A height value (in pixels) that defines the image height at that breakpoint (optional)
- A breakpoint value (with 'w' suffix) that corresponds to the viewport width
Ratio
If all sources should have the same aspect ratio, you can use the ratio attribute as a shortcut without height:
This calculates all heights accordingly.
The sizes attribute
The sizes attribute tells the browser how large the image will be displayed at different viewport widths. If not provided, it will be auto-generated based on the breakpoints in the sources parameter.
For a full-width responsive image, you can leave the sizes property empty or you can use:
For more complex layouts, add media queries and a default or fallback value as last value:
Details
For more information, visit the documentation at https://docs.fairu.app/docs/addons/00-statamic to find out what else you can do with Fairu.
