Are there any ways of preventing Facebook from automatically resizing open graph story images to the point where they are a small square? We want our images to be full width images. Thanks.
Related
Our developer has disappeared off the face of the planet and when our web server updated it's PHP version, formerly square images have cropped to landscape.
https://www.weareabsoluteuk.com/retail/
The section in question is the portfolio (screenshot attached) these were previously square but not display landscape despite the featured images still being a 1:1 ratio.
I'm familiar with Divi but this seems to be a custom built slider the developer has made and I'm just trying to figure out how I can make these images display as square again as we've sent countless requests to our developer to no avail
enter image description here
Would really appreciate a point in the right direction as I can get the containers to the size they should be but the image never fills them
Thanks
.et_pb_row
for this class max-width: 1080px is there, so it is restricting the images to look like rectangle instead of square, and your images are not square
your images are of resolution 400 x 284, so it wont look like square. You can try images as background images in order to appear them as square.
I would like to get all images, logos and text to always fit the screen. ie i view this on my pc and the site i see will be resized to fit my tv (screens a lot bigger)
There is a few things
1, No css code. Although i am sure it is possible with css but I know this will be possible using the tools provided just not sure how.
2, Be strait forward and not to complicated (if possible). I'm not that great with muse yet and come from just writing out the code.
First place a rectangular shape then fill it with the image you want to use... just resize the rectangular shape then...their will be a tooltip that would appear, the width and height of your image... just make the width 100%
to view the sample image just open the link below
https://fbcdn-sphotos-h-a.akamaihd.net/hphotos-ak-xpf1/v/t34.0-12/10378250_933301960022761_4004009316023420430_n.jpg?oh=32675100ced7bafcd60a175fda3c93e3&oe=54E39025&gda=1424210970_f0641f29deca2c42c99251330aeb33c2
I would like to publish my portfolio in my website. And my portfolio images sometimes horizontally wide and sometimes vertically wide. I did research a lil bit and i found this http://www.bootply.com/mohwImsUG4 solution it works great when i upload my vertical images. My question is how can i automatically fix width of grid layout to my images and of course if i have to see 2 images in one line its ok.
Screenshot (My Code)
Screenshot (Google [What i want])
I have a lot of images with a resolution around 500x1500 and I want to show all those images in a grid on my website. Each picture in the grid should be 200x200px.
If I scale down the images with CSS from 500x1500px to 200x200px and I show 10 200x200px images on my website, does this mean that the visitor first have to download the 500x1500px images and then their browser scales the pictures down?
If that is the case, then it's a bad solution to do it like this, right? Instead I should have two versions of each picture, one 500x1500px version and one 200x200px version. Am I right?
The question then is what's the easiest way to scale down hundreds of images?
Yes, I think it is the case that the browser will download the larger image and then scale it. You can check for yourself by opening the dev tools on the browser (press F12 if you're using Chrome) and monitoring the network traffic when you reload your site.
The easiest way to scale down hundreds of images is find or write a program to do it.
You are right. You can set height and width of the images but 1) the user will have to download a bigger image than necessary and 2) the height x width ratio will be trouble (the big one is 1x3 and the small one is 1x1). I would either use http://www.imagemagick.org/ , gimp or a similar tool to crop the images, but the problem is that the cropped area might not be very good. Only a human can select a good fit for the cropped area :-(
Edit1: Perhaps a well-trained neural network could select the most "interesting" part of every image programatically but that's kind of a lot of trouble to do that. Still it could be pretty interesting :-)
Rather than me going into crazy detail with my question: Home Page Here
As the demo shows, when you resize the window, the images try to stay perfectly in the center of the container, as well as fitting the container without displaying the background.
I have one minor bug, if you resize the window vertically, it does ruin the proportions of the images by squishing them. I was wondering if anyone has any tricks to help this situation, or will I need to detect the image size compared to the window height vs proportions?
I was just trying to avoid a javascript layout.