Shopify Question posted in
The Shopify help center can be found here.

Re-size image in html tag for copyright purposes – Shopify

Is it possible to resize a image to a lower resolution when it’s being used from a url in a a <img> tag?

for example <img src="http://someplace.com/img" width="100" height="100">

I want to use a personalized image that’s created with a Shopify app and is referenced in a line_item property, and use it in a confirmation email but I don’t want the customer to be able to right click and save it.

is it possible to lower the resolution of the image?

Tags:

2

Answers


  1. 0

    CSS Only changes the image size visually. it means the file size is still like the original file and if the viewer download/save the image, it is getting it in its original size.

    so just for visual purposes you can use something like this:

    img.resize {
    width:100px;
    height: auto;
}

    But if you want to hide the original file size you need to resize it with image editing software and upload the smaller one in the new URL and use it.

    Login or Signup to reply.
  2. 0

    You can use an image manipulation library to resize and/or blur the images or change their resolution. You can manipulate a single image or multiple images in a folder and store the manipulated images in a new folder.
    You can then add these new modified images to your page.
    One such library is gulp-gm

    gulp.src('test.png')
  .pipe(gm(function (gmfile) {
    return gmfile.blur(10);
  }))

    for resolution change

    var gulp = require('gulp');
var gm = require('gulp-gm');

gulp.task('default', function () {
  gulp.src('test.png')

    .pipe(gm(function (gmfile) {

      return gmfile.resize(100, 100);

    }))

    .pipe(gulp.dest('dist'));
});
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search