diff --git a/README.md b/README.md
index ea0db18..c56a17e 100644
--- a/README.md
+++ b/README.md
@@ -272,9 +272,31 @@ echo $image
-
+Options passed into `img()` are included as HTML attributes on the element. Some attributes are automatically generated (e.g. `src`, `width`, `height`, etc.). You can override them with a `!` prefix:
+
+```php
+echo $image
+ ->render()
+ ->img(['!width' => false, '!height' => false]);
+```
+
+
+See HTML Output
+
+```html
+
+```
+
+
-Options passed into `img()` are included as HTML attributes on the element.
+
+
+#### Render options
The `ImageRender` object can be configured to optimize the HTML output:
diff --git a/src/ImageRender.php b/src/ImageRender.php
index 12f01fd..d9b94b0 100644
--- a/src/ImageRender.php
+++ b/src/ImageRender.php
@@ -32,6 +32,8 @@ public function img(array $attributes = []): string
$attributes['width'] = $this->main()->width();
$attributes['height'] = $this->main()->height();
+ $attributes = $this->handleAttributeOverrides($attributes);
+
return $this->renderImg($attributes);
}
@@ -50,6 +52,8 @@ public function noScript(array $attributes = []): string
$attributes['width'] = $noScript->main()->width();
$attributes['height'] = $noScript->main()->height();
+ $attributes = $this->handleAttributeOverrides($attributes);
+
return $noScript->renderImg($attributes);
}
}
diff --git a/src/ImageSetRender.php b/src/ImageSetRender.php
index d59ccdf..1bbadef 100644
--- a/src/ImageSetRender.php
+++ b/src/ImageSetRender.php
@@ -40,6 +40,8 @@ public function picture(array $attributes = []): string
$attributes['width'] = $this->main()->width();
$attributes['height'] = $this->main()->height();
+ $attributes = $this->handleAttributeOverrides($attributes);
+
$output = [];
foreach ($this->data['sources'] as $source) {
@@ -84,6 +86,8 @@ public function img(array $attributes = []): string
$attributes['data-srcset'] = $this->getSrcset($this->data['sources'][0]);
$attributes['data-sizes'] = $this->getSizes($this->data['sources'][0]);
+ $attributes = $this->handleAttributeOverrides($attributes);
+
return $this->renderImg($attributes);
}
@@ -104,6 +108,8 @@ public function noScript(array $attributes = []): string
$attributes['srcset'] = $noScript->getSrcset($noScript->data['sources'][0]);
$attributes['sizes'] = $noScript->getSizes($noScript->data['sources'][0]);
+ $attributes = $this->handleAttributeOverrides($attributes);
+
return $noScript->renderImg($attributes);
}
diff --git a/src/ImgRenderable.php b/src/ImgRenderable.php
index 228becb..65404c4 100644
--- a/src/ImgRenderable.php
+++ b/src/ImgRenderable.php
@@ -167,6 +167,29 @@ protected function prepareAttributes(array $attributes = []): array
return $attributes;
}
+ protected function handleAttributeOverrides(array $attributes = []): array
+ {
+ // attribute overrides start with a '!' (e.g. `['!src' => false]`)
+ $attributeOverrides = array_filter(array_keys($attributes), fn ($key) => $key[0] === '!');
+
+ foreach ($attributeOverrides as $override) {
+ $name = substr($override, 1);
+ $value = $attributes[$override];
+
+ if ($value === false) {
+ unset($attributes[$name]);
+ } elseif ($value === true) {
+ $attributes[$name] = "";
+ } else {
+ $attributes[$name] = $value;
+ }
+
+ unset($attributes[$override]);
+ }
+
+ return $attributes;
+ }
+
protected function renderImg(array $attributes = []): string
{
$img = $this->htmlTag('img', $attributes);
diff --git a/tests/ImageRenderTest.php b/tests/ImageRenderTest.php
index 17cd521..662dac9 100644
--- a/tests/ImageRenderTest.php
+++ b/tests/ImageRenderTest.php
@@ -201,6 +201,41 @@ public function test_can_render_using_options_array()
);
}
+ public function test_can_override_img_attributes()
+ {
+ $prepared = $this->prepareImageRender();
+
+ $output = $prepared->imageRender->img([
+ 'alt' => 'test',
+ '!data-src' => '/test.jpg',
+ '!src' => true,
+ '!width' => false,
+ '!height' => false,
+ ]);
+
+ $this->assertEquals(
+ '',
+ $output
+ );
+ }
+
+ public function test_can_override_noscript_attributes()
+ {
+ $prepared = $this->prepareImageRender();
+
+ $output = $prepared->imageRender->noscript([
+ 'alt' => 'test',
+ '!src' => '/test.jpg',
+ '!width' => false,
+ '!height' => false,
+ ]);
+
+ $this->assertEquals(
+ '',
+ $output
+ );
+ }
+
protected function prepareImageRender($options = []): object
{
$prepared = $this->prepareImage();
diff --git a/tests/ImageSetRenderTest.php b/tests/ImageSetRenderTest.php
index 397774d..b8d0c39 100644
--- a/tests/ImageSetRenderTest.php
+++ b/tests/ImageSetRenderTest.php
@@ -264,6 +264,59 @@ public function test_can_render_picture_using_options_array()
);
}
+ public function test_can_override_picture_attributes()
+ {
+ $prepared = $this->prepareForImg();
+
+ $output = $prepared->imageSetRender->picture([
+ 'alt' => 'test',
+ '!data-src' => '/test.jpg',
+ '!src' => true,
+ '!width' => false,
+ '!height' => false,
+ ]);
+
+ $this->assertEquals(
+ '',
+ $output
+ );
+ }
+
+ public function test_can_override_img_attributes()
+ {
+ $prepared = $this->prepareForImg();
+
+ $output = $prepared->imageSetRender->img([
+ 'alt' => 'test',
+ '!data-src' => '/test.jpg',
+ '!src' => true,
+ '!width' => false,
+ '!height' => false,
+ ]);
+
+ $this->assertEquals(
+ '',
+ $output
+ );
+ }
+
+ public function test_can_override_noscript_attributes()
+ {
+ $prepared = $this->prepareForImg();
+
+ $output = $prepared->imageSetRender->noscript([
+ 'alt' => 'test',
+ '!src' => '/test.jpg',
+ '!width' => false,
+ '!height' => false,
+ ]);
+
+ $this->assertEquals(
+ '',
+ $output
+ );
+ }
+
protected function prepareAllImages(): array
{
$image1 = $this->prepareImage();