Skip to main content
8 votes
Accepted

Does Craft CMS support these features?

Preview function for different devices, screen sizes and screen configurations(portrait/landscape) Yes it has live preview. However this isn't per device. You can open the entry with a secret url ...
CreateSean's user avatar
  • 1,983
4 votes
Accepted

Responsive Images Srcset and Sizes based on Image Transform

Merge operates on arrays or array-like things, and you probably handed it the string "card", which is why you got that error. I think what you want to do here is use the transform in the control ...
Marion Newlevant's user avatar
3 votes
Accepted

loop through responsive images in matrix with imager plugin

You’re currently passing in the image model you queried for using first() into the craft.imager.transformImage function, but you actually need to pass in the models that you get when looping through ...
carlcs's user avatar
  • 36.3k
3 votes

Generating srcset in a similar way to WordPress

You can write a function, a utility template or a macro to make repetitive tasks like generating responsive images easier. I usually prefer templates, because they're easy to extend and they can take ...
MoritzLost's user avatar
  • 11.6k
3 votes
Accepted

Get all available asset transforms

Craft 4 PHP $transforms = Craft::$app->getImageTransforms()->getAllTransforms(); Craft 3 PHP $transforms = Craft::$app->getAssetTransforms()->getAllTransforms(); foreach($allTransforms as ...
Robin Schambach's user avatar
3 votes

Using ImageOptimize, how do you loop through photos?

So the OptimizedImages field in ImageOptimize is added to your asset as a field (just like Entries can have fields), because it's added to your Asset Volume layout. So you'd iterate through the ...
andrew.welch's user avatar
  • 11.6k
2 votes
Accepted

Setting Imager crop position dynamically

Your issue is that Craft (or rather, Imager) is not treating your entry.cropPosition Dropdown field as a string; you're essentially passing the actual DropdownFieldType model (an array like object). ...
Mats Mikkel Rummelhoff's user avatar
2 votes

Setting Imager crop position dynamically

If the value of imageCrop is a string in the correct format (ie 50% 50%, 0% 0%, or similar), this should do it: {% set entryImage = entry.pageHeader.first() %} {% set imageCrop = entryImage....
André Elvan's user avatar
  • 7,288
2 votes
Accepted

Responsive background images in carousel

It's not really a Craft CMS question, but... I don't remember Flickity supporting what you describe. You could try listening for screen size on pageload (and resize), assigning the correct image to ...
Clive Portman's user avatar
2 votes
Accepted

Changing Image transforms for different media queries

This is absolutely possible using plain old HTML, and media queries within a <picture> tag. Within the tag you set your base image <img> to the url of the smallest size, and a <source&...
dmatthams's user avatar
  • 2,492
1 vote

How can I use a transform on images in a body field that have been imported?

I believe this can be done using Retcon - more specifically: https://github.com/mmikkel/Retcon-Craft/wiki/Transform
James Smith's user avatar
  • 5,344
1 vote

Generating srcset in a similar way to WordPress

Craft has a newer asset method called getSrcset which should be close to what you need. Here's the code example from the docs: {% do asset.setTransform({ width: 300, height: 300 }) %} {{ tag('img', { ...
Dalton Rooney's user avatar
1 vote
Accepted

responsive image and srcset with Imager

It looks like the sizes attribute needs to be tweaked. Absolute image sizes need to be specified in px units, not w. <img src="{{ craft.imager.base64Pixel(16, 9) }}" sizes="(min-width:641px)...
Alex Roper's user avatar
  • 2,642
1 vote

Another gallery question

Rather than having separate entries, have you considered having one type of image but assigning categories or tags to them. That way you could output your images in a random order using .order('RAND()...
Steve Holland's user avatar
1 vote

Another gallery question

You can set an array and order them by random. {% set gallery = craft.entries.section(['galleryA','galleryB','galleryC']) %} Then you have to display them by random using .order('RAND()') So your ...
Justin Dekkers's user avatar

Only top scored, non community-wiki answers of a minimum length are eligible