{"id":21068914,"url":"https://github.com/brandcom/silverstripe-webp","last_synced_at":"2025-05-16T03:33:42.622Z","repository":{"id":43155279,"uuid":"401270933","full_name":"brandcom/silverstripe-webp","owner":"brandcom","description":null,"archived":false,"fork":false,"pushed_at":"2023-12-21T13:38:00.000Z","size":21,"stargazers_count":3,"open_issues_count":0,"forks_count":1,"subscribers_count":0,"default_branch":"ss5","last_synced_at":"2024-11-08T20:08:38.183Z","etag":null,"topics":["silverstripe","silverstripe-module","webp"],"latest_commit_sha":null,"homepage":"","language":"PHP","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/brandcom.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null}},"created_at":"2021-08-30T08:29:44.000Z","updated_at":"2023-12-21T13:38:36.000Z","dependencies_parsed_at":"2023-12-18T12:50:25.412Z","dependency_job_id":null,"html_url":"https://github.com/brandcom/silverstripe-webp","commit_stats":{"total_commits":26,"total_committers":2,"mean_commits":13.0,"dds":"0.038461538461538436","last_synced_commit":"20b64095b243dec13cc1daad34bbd7b362510ee3"},"previous_names":[],"tags_count":5,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/brandcom%2Fsilverstripe-webp","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/brandcom%2Fsilverstripe-webp/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/brandcom%2Fsilverstripe-webp/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/brandcom%2Fsilverstripe-webp/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/brandcom","download_url":"https://codeload.github.com/brandcom/silverstripe-webp/tar.gz/refs/heads/ss5","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":225405174,"owners_count":17469296,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["silverstripe","silverstripe-module","webp"],"created_at":"2024-11-19T18:29:16.233Z","updated_at":"2024-11-19T18:29:16.734Z","avatar_url":"https://github.com/brandcom.png","language":"PHP","funding_links":[],"categories":[],"sub_categories":[],"readme":"# silverstripe-webp\n\nThe Plugin provides a helper to create html `\u003cpicture\u003e` elements in Silverstripe templates. It supports WebP sources out of the box.\n\n## Requirements\n\n-   SilverStripe 5.x\n-   rosell-dk/webp-convert ^2.9\n-   PHP \u003e= 8.1\n\n## Install\n\nInstall via composer.\n\n`composer require jbennecker/silverstripe-webp`\n\nRegister the plugin as a data extension for the `Assets\\Image` class:\n\n```yaml\nSilverStripe\\Assets\\Image:\n    extensions:\n        - jbennecker\\Webp\\WebpExtension\n```\n\n## Usage\n\nThe `jbennecker\\Webp\\Picture` class provides a flexible Api to manipulate your picture in your template file.\n\nTo access the Api, call the `getPicture()` method from the `WebpExtension` like so:\n\n```\n$MyImage.Picture\n```\n\nThis will be enough to output a `\u003cpicture\u003e` with standard configuration.\n\n### Api methods\n\nThe class provides multiple methods that can be called in any order. You can chain the methods, as they return the instance of the Picture class.\n\n#### setWidths(int ...$widths)\n\nThe method will set the widths in the `srcset` attribute in each of the picture's `\u003csource\u003e` tags.\n\nExample:\n\n```\n$MyImage.Picture.setWidths(150, 230, 550)\n```\n\nDefaults to `350, 750, 1500`.\n\n#### setSizes(string $sizes)\n\nSet the `sizes` attribute on the `\u003csource\u003e` tags a media-query. Defaults to `100w`.\n\n```\n$MyImage.Picture.setWidths(370, 750, 1920).setSizes(\"(min-width: 280px) 100vw, (min-width: 640px) 50vw\")\n```\n\n#### setFormats(string ...$formats)\n\nControl what `\u003csource\u003e` tags / formats will be present. Defaults to webp and jpeg.\n\nAvailable options:\n* webp\n* jpg/jpeg\n\nTo e.g. disable webp and only get one `\u003csource\u003e` with a jpg `srcset`:\n\n```\n$MyImage.Picture.setFormats('jpg')\n```\n\n#### setAlt(string $value)\n\nSets the `alt` parameter on the `\u003cimg\u003e` tag. Defaults to the Image's title from the CMS.\n\n#### setCss(string $value)\n\nSets the `class` parameter on the `\u003cimg\u003e` tag.\n\n#### setWidth(int $width)\n\nSet the `width` attribute on the `\u003cimg\u003e` tag. Defaults to the Image's original width.\n\n#### setHeight(int $height)\n\nSet the `height` attribute on the `\u003cimg\u003e` tag. Defaults to the Image's original height.\n\n#### setParam(string $param, string $value)\n\nSets a parameter with the name `$param` on the `\u003cimg\u003e` tag.\n\n```\n$MyImage.Picture.setClass(\"w-full border shadow-lg\").setParam(\"title\", \"This is a title\")\n```\n\n#### setLazyLoading($lazy = true)\n\nControl the `loading` attribute. Sets it to `lazy` or `eager`. Defaults to lazy loading.\n\n### The Webp-Method\n\nIf you just want to quickly convert the image to .webp and use it in your template, you can use the Webp method:\n\n```ss\n\u003cimg src=\"$MyImage.Webp(900)\" alt=\"\"\u003e\n```\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fbrandcom%2Fsilverstripe-webp","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fbrandcom%2Fsilverstripe-webp","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fbrandcom%2Fsilverstripe-webp/lists"}