- This topic has 12 replies, 2 voices, and was last updated 5 years, 5 months ago by
.
I love the theme, but I have a problem with blog post feature images in the grid layout on the front page of my site. The images are in 3:2 when I open the posts, but are shown in more of a widescreen edition in the grid. Is there any way to show them in the 3:2 ratio in the grid?
Thanks in advance!
Hi @martinolesen,
I hope you are well today and thank you for your question.
It seems you are using Jetpack plugin on your site so could you please try temporary deactivating its Photon module on your site as shown in the attached screenshot?
Best regards,
Shufflehound teamThat helped a little. The first two are now in the correct format, but the rest are still stretched. Images are also stretched when you open a post-page.
And two related questions:
- On the post-page the header says “Blog post” – can I change that to the title of the post?
- I used the code below to remove the margin at the top of the pages, but I want to 100px margin to be displayed at the post-page. Anyway to tweak the code to accomplish that?
#wrapper > .content-container.sh-page-layout-default {
padding-top: 0;
}Thanks for great support and an awesome theme!
That helped a little. The first two are now in the correct format, but the rest are still stretched. Images are also stretched when you open a post-page.
Please try regenerating thumbnails on your site using the below plugin.
https://wordpress.org/plugins/force-regenerate-thumbnails/
Also when I try to visit the posts on your shared site then I get redirected to another site.
Please advise.
On the post-page the header says “Blog post” – can I change that to the title of the post?
You can achieve it developing custom code in the Jevelin child theme as shared in the following topic.
https://support.shufflehound.com/forums/topic/blog-page-full-width/#post-6756
I used the code below to remove the margin at the top of the pages, but I want to 100px margin to be displayed at the post-page. Anyway to tweak the code to accomplish that?
#wrapper > .content-container.sh-page-layout-default {
padding-top: 0;
}Do you mean single post page?
If yes then also use below custom CSS code.
.single-post #wrapper > .content-container.sh-page-layout-default { padding-top: 100px; }Thanks… but still not there.
I forced regeneration of all images, but apparently with no effect.
Regarding the header on the blog-posts, I just installed the theme, and I’m using the child theme already. Will adding the child theme attached in the referenced post change anything? AND will it destroy the settings on my current site? Please help with an alternative solution.
Regarding the top margin, it works perfectly on the post pages. Is there a way to also have it on selected pages? I don’t want it on pages where I have a slider at the top, because the is already plenty of margin. See:
http://martinolesen.com/contact/ and the main page: http://martinolesen.com
I do want it on the blog-post pages (works now) and the blog-post overview page: http://martinolesen.com/blog/
I’m not going to publish a lot of pages, so a manual update of custom code for new pages is not a problem.
Thanks in advance.
I forced regeneration of all images, but apparently with no effect.
It seems to display fine for me as displayed in the below demo site.
https://jevelin.shufflehound.com/blog/blog-masonry-2-0/
Is the same displaying for you?
Also when I try to visit the posts on your shared site then I get redirected to another site.
Please advise.
Regarding the header on the blog-posts, I just installed the theme, and I’m using the child theme already. Will adding the child theme attached in the referenced post change anything? AND will it destroy the settings on my current site? Please help with an alternative solution.
No settings will be destroyed. You have to just delete your existing child theme and use the attached child theme.
Regarding the top margin, it works perfectly on the post pages. Is there a way to also have it on selected pages? I don’t want it on pages where I have a slider at the top, because the is already plenty of margin. See:
http://martinolesen.com/contact/ and the main page: http://martinolesen.com
I do want it on the blog-post pages (works now) and the blog-post overview page: http://martinolesen.com/blog/
You can achieve it using Yellow Pencil editor as described in the below page.
https://support.shufflehound.com/how-to-change-almost-any-element/
I reinstalled the new child theme without destroying the original, but nothing changed with the headers. It still displays “Blog” in the title of a single post.
Regarding the images, please see attached (image streched on front-page.jpg). The linked posts (first two with blue link icon) are shown in the correct format (3:2), but the rest are stretched. Also on the post page, the images are stretched, please see attached (Image stretched on post.jpg). The image in the foreground is the original image I uploaded to the post. As you can clearly see, the are parts of the top and bottom of the image, that are not displayed in the post. Regenerating the image does help either.
I reinstalled the new child theme without destroying the original, but nothing changed with the headers. It still displays “Blog” in the title of a single post.
Have you activated the child theme on your site?
Regarding the images, please see attached (image streched on front-page.jpg). The linked posts (first two with blue link icon) are shown in the correct format (3:2), but the rest are stretched. Also on the post page, the images are stretched, please see attached (Image stretched on post.jpg). The image in the foreground is the original image I uploaded to the post. As you can clearly see, the are parts of the top and bottom of the image, that are not displayed in the post. Regenerating the image does help either.
Please answer my below questions that I am asking you again & again.
It seems to display fine for me as displayed in the below demo site.
https://jevelin.shufflehound.com/blog/blog-masonry-2-0/
Is the same displaying for you?
Also when I try to visit the posts on your shared site then I get redirected to another site so could you please tell me why?
- Yes I activated the new child theme.
- Yes https://jevelin.shufflehound.com/blog/blog-masonry-2-0/ displays correct, but it’s not the GRID layout. And that is the one causing me the problems. Did you look at the attached screenshots? Should be pretty obvious what the problem is.
- The first two posts (middle and left) on the front-page are links (the once with the blue link icon in the corner. Please click the right (third) post – the one without the blue link. OR click the Blog link in the top-menu of the site.
- When I look at your example site, the images are also cut/stretched in the grid example compared to the Masonry 2.0. If you look at the “Creative Day Off” post, you can see more of the guys shirt and jacket in the Masonry compared to the Grid. AND in the single post view you also see a compressed view (less shirt and less whitespace above the notebook).
- IF I change to Masonry 2.0 on my site, then images are the same size. So there must error in the grid layout, since images are not the same size in that layout.
Yes you are right and this is what I want to tell you that images on the demo site also get cropped so that it will display in the appropriate size.
If you don’t want to crop the images or change the ratio of image cropping then you have to develop custom code.
I have developed custom plugin for you and attached it to this reply which contains custom code that you can edit to change various image sizes on your site.
Thanks!
Can you provide me with a bit of guidance on how to use it?
Thx.
Edit that plugin code in the plugin editor as described in the below page and change the size values in the set_post_thumbnail_size function argument to whatever you want to.
