38 votes
Accepted

How can I automatically generate responsive images from a single hi-res asset?

You can do this using image transforms. There are a couple things you’re going to need to consider though: Not every image will necessarily be high-res (e.g. a computer screenshot taken on a non-...
37 votes
Accepted

Generating pending image transforms stuck in process

More of a "How do I debug stuck tasks" answer, but it should help you. Open up your craft_tasks table. You'll see one task in with a 'status' of 'running' and if you refresh the table several times, ...
  • 66.5k
12 votes

How do image focal points work in Craft 3?

While we’re piggybacking, here’s a snippet that goes one step further and generates the necessary CSS to position an untransformed image: {% set img = entry.headingImage.one %} {% if img %} {% ...
10 votes
Accepted

Prevent Asset Transforms from scaling Image past 100%

Yes. getWidth will give you an image's width: {% set originalWidth = image.getWidth(false) %}. You want to apply the transform if desiredWidth is less than originalWidth. I would write a twig macro: ...
10 votes

How can I automatically generate responsive images from a single hi-res asset?

Quick comment: If you are using generated transforms, you are likely not doing any "art direction" with your images. Basically all your images will be the same, their dimensions alone would be ...
9 votes
Accepted

apply transform to image uploaded into Redactor?

Sure, from the Redactor "Insert Image" modal:
  • 66.5k
8 votes
Accepted

Is it possible to clear caches and re-index assets programattically?

I guess it depends. So, behind the scenes, Craft can have different cache drivers. You might use the db or file cache, or something like Redis or Memcache. Took a peek at ClearCachesTool, and it ...
  • 2,957
8 votes
Accepted

Can you prevent upscaling when using Craft's image transforms?

As found here, this actually seems to be a requested feature that is not yet implemented. However, in the link given, Brandon also supplied a workaround for the time being: {% set transform = { width:...
7 votes

How can I automatically generate responsive images from a single hi-res asset?

There is a great article here which I thoroughly recommend reading. It goes into this in great detail. It even includes a twig macro that deals with both retina images as well as responsive images: ...
  • 769
7 votes
Accepted

Cache/ColdCache & checking for ungenerated image transforms

Set generateTransformsBeforePageLoad in your config/general.php file. 'generateTransformsBeforePageLoad' => true, Configures Craft to generate new image transforms right when getUrl() is called,...
7 votes
Accepted

Image transform is turning my jpegs dark

Setting 'preserveImageColorProfiles' => true, in craft/config/general.php solved the problem. https://craftcms.com/docs/config-settings#preserveImageColorProfiles Note that you need to be running at ...
6 votes
Accepted

Can I "circle crop" an image asset?

The short answer: No. However, as this answer states, it will be possible to do this in the future. Just as a tip, I know it doesn't answer your question: it's an effect you can easily achieve with ...
  • 6,308
6 votes
Accepted

Transforms not working

It's a very subtle difference, but what you have added there is a variable, when what you are looking for is a string. <img src="{{ asset.getUrl('squarePhoto') }}" alt="{{ asset.title }}"> ...
  • 2,957
6 votes
Accepted

Transform different image if specific id or order

You could do that like so: {% for asset in entry.portraits %} {% if loop.index == 2 or loop.index == 4 %} {% set transform = 'largeIndexHalf' %} {% else %} {% set transform = '...
6 votes
Accepted

What are the best practices for the development setup?

That's the setup we use here. It's ok, but local development runs slowly because the database is off-site - we'll be moving to an internal database server in the new year because of that. Image ...
  • 3,084
6 votes
Accepted

How do image focal points work in Craft 3?

Focal points are used mainly for when Asset transforms (i.e. cropping) are performed in Craft. They tell Craft where it should focus on the image when performing these actions.
  • 66.5k
5 votes
Accepted

Is 'real crop' a possibility?

Currently, no. It is on our list to open us the asset transformation pipeline so that plugins can add new transforms that go beyond what is available out of the box in Craft, though.
  • 66.5k
5 votes
Accepted

Using image transforms sometimes results in bloated file sizes.

Is Imagick installed on your server? If not, Craft uses GD as a "fallback". Chances are that transforms with GD lead to poorer image quality and longer calculation times. I'm not sure about ICC ...
  • 35.9k
5 votes
Accepted

Updated Image Transformation

I forgot we added a tool for this, too, under Settings->Tools->Clear Caches Tool->Asset Transform Index.
  • 66.5k
5 votes

Is there any way of setting / forcing a default image transform for images inserted via rich text blocks?

I don't think it's possible natively, yet (as of 2.3). However, the ImageSmith plugin addresses this need by providing a 'bulk transform' Twig filter which detects images in HTML, applies a specified ...
  • 3,400
5 votes
Accepted

Image transform with either width or height

A similar question has already been asked here: Is there a way to find out if images (assets) are landscape or portrait? You will need to create the two asset transforms you mentioned in your ...
  • 3,604
5 votes

Applying image transforms to remote images?

Imager plugin is capable of resizing remote images
5 votes
Accepted

Pass hardcoded path to getUrl()

I don't think that Craft can do this natively, and would guess that it needs an AssetModel in order to determine where to create the image transforms, etc. Your best bet would be to add the images to ...
5 votes
Accepted

Is it possible to get a transformed image's file size (bytes, not dimensions)?

I don't think it's possible to get the file size of an image after it's been transformed with Craft's out-of-the-box image transforms. It looks like the .size property only works on the original ...
  • 2,583
4 votes

Is it possible to compress image transforms?

All common image file formats are compressed, even lossless formats like RAW, TIFF or PNG use compression! To reduce file size of you images you should choose a lossy format (avoid TIFF Baseline or ...
  • 35.9k
4 votes
Accepted

Generate PDF preview images automatically?

There a plugin for that: https://github.com/carnesmedia/pthumb PThumb is a Craft plugin that generates thumbnail preview images for PDF documents. It's easy to drop into your templates, requires ...
4 votes
Accepted

How to check whether a named Asset Transform exists?

You can check for the existence of a transform within your controller (for example), as follows: if (craft()->assetTransforms->getTransformByHandle('jimbob')) { // Transform exists. } ...
4 votes
Accepted

Image transform that only crops if image is larger than set dimensions

You can easily do this in twig with a conditional that checks if the width of the image is larger than your target transforms width. Try something like this: {% if image.getWidth()>600 %} <...
  • 7,248
4 votes
Accepted

Set transformations image path

Craft doesn't have a setting for defining the transformations image path, they are automatically placed in a subfolder inside your created assets source' path. It could look something like this ...
  • 7,248
4 votes

Dynamically generating a JPG from SVG

No, Craft will not be able to generate JPGs from SVGs out of the box (I tested it), but it should be relatively easy to write a plugin handling it. As GD doesn't support SVG, ImageMagick support is a ...

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