How to Crop image in Muffin Builder

tjkalinowski

I have landscape picture in Media. I want to crop it to portrate. How to do it without downloading it and photoshoping? I have BeTheme, and I use Muffin Builder. 

I have template Accountant and see that there is cropped pictures. I did remove picture and setup again the same picture. The cropping effect has gone. I cant find how to find settings for croping?

tjkalinowski

https://www.dropbox.com/s/rbsvtki8degsnx0/Screenshot 2018-07-24_5-21-14 PM.png?dl=1

Pablo

Hi,

You can use only CSS to make it happen.

Also, please check it out:

Thanks

Learn more: Video Tutorials | How To | FAQ Vote on what comes next

tjkalinowski

Hello Pablo,

1. Please login to Wordpress with BeTheme. 

2. Then install pre build website called "accountant 2".

3. Go to Media library. 

4. Find picture named : home_accountant2_services1-1.jpg. (calculator and hands)

5. Make notice of the picture and its size.

6. Then open new tab in browser. 

7. Point your browse to Pages and Home Page. 

8. Scroll down to Muffin Builder.

9. Find the same picture in first section.

10. Click Edit picture.

11. Please compare picture in point #10 and #5

You should see that picture is croped down. Original picture is not croped in Media Library, but is croped at #10. Browse down the #10 and see there is no other configuration or CSS. 

Can you explain me, how to do that croping? Your movie show how to crop picture and save it down cropped. This is diferent case.

Do you See difference?

The #10 picture

The #5 picture.

tjkalinowski

1. I did duplicate the picture box in Muffin Builder

2. Go to Media library.

3. Save home_accountant2_services1-1.jpg to local disk drive.

4. I did rename home_accountant2_services1-1.jpg to test.jpg

5. I uploaded test.jpg to Media Library.

6. I edit duplicated box in Muffin Builder.

7. In editor remove home_accountant2_services1-1.jpg and point to test.jpg

8. Save it.

Now I see on web page two the same pictures, upper is cropped, down is not cropped. So, cropping effect is related to file name of jpg file. But I do not know how to reconfigure it.

Pablo

1) To change the size of the default WordPress gallery images, please go to settings>media

Notice!
Remember to use thumbnail regeneration after you make your changes. Otherwise, the images will not change their size.

2) If you want to crop it by yourself, you have to go to Media > Select image > Edit Image

http://prntscr.com/kb7ekd

By this option you can change this image as your wish

There is no other option in BeTheme and Wordpress.

Thanks

Learn more: Video Tutorials | How To | FAQ Vote on what comes next

tjkalinowski

Hello Pablo,

You are right!. Thank you.

On website https://themes.muffingroup.com/be/accountant2/ look at the man in the suite. He is cropped down from much larger picture. And there is two version of this man. Croped and uncroped. That why I have beed lost. And missunderstand. I think that uncropped verison is magically cropped on load time.

The cropped version here: 

<img class="scale-with-grid" src="https://themes.muffingroup.com/be/accountant2/wp-content/uploads/2018/03/home_accountant2_pic1.jpg" alt="home_accountant2_pic1" width="780" height="1370">

This picture is cropped:

and uncropped

<img width="960" height="720" src="https://themes.muffingroup.com/be/accountant2/wp-content/uploads/2018/03/home_accountant2_blog4-960x720.jpg" class="scale-with-grid wp-post-image" alt="">

Bryan

This is basically not a theme feature. We just get different size images from the designers.

You have to crop it first on your pc and then use it.

You are showing us 2 totally different images, they are not the same cropped image.

thanks

Learn more: Video Tutorials | How To | FAQ Vote on what comes next