26

I can't see any issues to worry about here. A couple of approaches that could work, using the PictureFill technique: Using EE image manipulations: <div data-picture data-alt="My picture"> <div data-src="{my_image:small}"></div> <div data-src="{my_image:medium}" data-media="(min-width: 400px)"></div> <div data-...


19

I'm the author of CE Image and a long-time EE user. I'll try to be impartial in my response, as both methods definitely have pros and cons. Native Pros The manipulations happen 1 time, up front. You can regenerate the images anytime you need. You can set up multiple sizes. It's free (well, you get it with the EE license). Native Cons If the sizes ever ...


16

I use an add-on I developed which sets a screen width variable which you can use in conditionals and then I use an image sizing plugin to serve up different sized images based on that. A bit more detail here.


12

This has always worked for me: {exp:ce_img:single src="{url}" width="200" height="200" crop="yes|center,center" } You can obviously add any additional paramaters (offset, filter, etc), but give this simple example a shot and try adjusting from there.


7

Try my answer on this question - works for me on a single template: EE Code within channel entries {exp:stash:set name="shortcode_inside_field" type="snippet"} <p>Hi there! It's important to set type="snippet" so that {shortcode_inside_field} will get automatically replaced with this sentence by the stash:parse tag later on.</p> ... now ...


6

So it was an issue with CE-Image and the paths it uses to find images. Since we moved directories it was looking for some images in the old location and the rest in the current which is why the fact that some worked was somewhat perplexing. Added this config setting to our bootstrap and we are looking good. $config['ce_image_src_regex'] = array( $...


5

You need to fill in the array for all of your domains that are part of MSM. I copied this from config.php for a 9 site MSM install and reduced it to just 3 sites to demonstrate: // ce_img stuff here $config['ce_image_src_regex'] = array( '^http://maindomain.com/' => '/var/www/vhosts/maindomain.com/httpdocs/', '^http://domain1.com/' => '/var/www/...


5

I don't know of any gotchas specific to EE. And I've had good luck using the native EE file manager, as well as Assets and Channel Images, to create and serve up multiple sizes of images to different devices. I like the way Channel Images structures its directories; I think it makes it easier to use for responsive images than the other solutions. Also, this ...


5

PHP is letting you know that the maximum amount of memory that it is allowed to use has been exhausted. You need to either do less memory intensive things (work with smaller images, etc), or increase the maximum amount of memory PHP is allowed to use on your server. When working with really large images, or even doing processor intensive filters on ...


5

You have an extraneous single quote ' in each of your opening tag pairs. {stash:ee_img_original_width'}{width_orig}{/stash:ee_img_original_width} Should be: {stash:ee_img_original_width}{width_orig}{/stash:ee_img_original_width}


5

Assets does none of your four bullet points - these are all best done via CE Image as you're doing now (and it does all with aplomb). Why do you want to replace it? It's bar-none the best EE add-on for image manipulation (in the same way that Assets is the best file manager for EE). Re: S3 - Assets can store your files in an S3 bucket, but if you're going ...


5

There are a few different ways to go about this, but the most succinct is probably to use the url_only= parameter: {exp:ce_img:single src="{your_custom_field}" url_only="yes" width="200"} You could also customize the output using the output= parameter: {exp:ce_img:single src="{your_custom_field}" output="{made}" width="200"} Or use the made variable in a ...


4

I had this issue as well, but for me it turned out be a misconfigured server "base path" issue. Which is explained in the CE Image Common Solutions docs. Setting the config variable in my (NSM) config bootstrap file solved the issue for me: 'ce_image_document_root' => NSM_BASEPATH or as stated on the solutions page: $config['ce_image_document_root'] = '...


4

Brooks, The image may exist at the url, but, the base path may be the issue if it's not pointing to the public folder. The debug gives the base path as, /usr/local/apache/htdocs/ and then you have the route to the image as, /images/uploads/adidas-apparel1.jpg Which means that the image needs to be in, /usr/local/apache/htdocs/images/uploads/ Without ...


4

You'd be better off just 'stashing' the image urls and using the CE Image tag from within the layout. Article {f-archive-images} {exp:stash:set_list name="images"} {stash:url}{f-archive-images-image}{/stash:url} {/exp:stash:set_list} {/f-archive-images} Layout First image: {exp:stash:get_list name="images" limit="1"} {exp:ce_img:single src="{...


3

If you're using Structure 3.3.8, it already includes the Structure Entries functionality (Official Documentation). Maybe give the native version a try and see if that parses the Assets tag correctly? {exp:structure:entries parent_id="{embed:my_parent_id}"} ... {/exp:structure:entries}


3

I also just just noticed that you are using {page_image}...{/page_image} as a variable pair, and also using a single variable {page_image} inside that loop (that you are passing into the CE Image src= parameter). I think that's probably a typo, right? Shouldn't the single variable be {url}?


3

Would something like this Image Editor add-on work for what you need? http://devot-ee.com/add-ons/image-editor Another solution might be add select fields to allow the client control the crop position parameters for CE Image. For instance, if you had a select dropdown field called {horizontal_crop} with the values "left, center, right" and another ...


3

is there any way to prevent the storage of, and/or automatically purge the files in ce_image_remote_dir? There is not a way to accomplish this with the default extension, but you could accomplish this with a custom one to meet your needs. PHP has to have a local copy of the image in order to manipulate it. Additionally, it's much faster to check whether ...


3

Thank you all for the help. After a lot of digging around, once again the culprit was everyone's friend htaccess. There was a rogue rule that included /images/ which seems to occasionally interfere, removing the rule, clearing the /made folder, clearing the EE tag cache and we are back in business. Phew... Lesson learnt, if in doubt it's always blooming ....


3

I believe I came accross something similar and using pair tags instead of single tag worked. I never did get a chance to figure out why but refer to the docs for pair usage. Also try adding parse="inward" to your matrix tag, a plugin within a plugin may be in play.


3

So it turns out to be a server issue where GD support hadn't been enabled in PHP. Enabled that, kept the same code and we're golden :-)


3

Well that was simple! just added the orderby="image_order" parameter to the matrix tag pair. I had tried that originally, but it was using the already cached images. Once they were deleted out, it regenerated the right ones. :)


3

Welp, after even more testing an hair pulling I sorted it out. I forgot to set parse_tags="yes" on the exp:stash:set... d'oh! Model {!-- SINGLE VARIBLES --} {exp:stash:set parse_tags="yes" trim="yes" } {stash:share_image_url} {exp:ce_img:pair src="{cf_featured_image:url}" width="800" height="450" crop="yes" ...


3

You didn't say which version of EECMS you're using. Some versions have parsing issues on conditionals with single quotation marks. Or, maybe, your version of Matrix have one of this issues. So, first of all, try to replace them. {if "{placement}" == "sidebar"} {exp:mx_jumper:put name="standard_image_width"}226{/exp:mx_jumper:put} {exp:mx_jumper:put ...


3

Okay, first, turn off early parsing for the myassetsimage variable. Then try and use Asset's {url} variable (see docs) in CI Img's src-parameter instead of the Low Variables name. That means that your code would look like this: {exp:low_variables:pair var="myassetsimage"} {exp:ce_img:pair src="{url}" width="640" height="400" class="img-polaroid" alt=""} ...


3

Use :pair tag {exp:ce_img:pair src="{your_custom_field}"} <img src="{made}" alt="" width="{width}" height="{height}" /> {/exp:ce_img:pair}


3

Yes, take a look at the text= parameter. :)


3

I haven't used CE Image, but looking at the documentation it seems you need a parameter "allow_scale_larger" http://www.causingeffect.com/software/expressionengine/ce-image/user-guide/parameters#allow_scale_larger And here's how you can achieve the cropping effect with CSS: http://jsfiddle.net/s552453s/ Unfortunately you are limited to cropping from the top ...


2

Don't bother! Read this blog post, it might be of interest to you? http://boagworld.com/dev/how-should-we-handle-responsive-images/


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