Archived topic
Blog style in mobile
5 replies · Started by Feber on April 27, 2022
Hi,
I love my current blog style in desktop view. Image on the left and then title on the right.
But I don't like it in mobile view. Because image on top and title below image.
My current mobile view : https://prnt.sc/-Cb7XSGmZ53o
How to design my blog mobile view looks similar like desktop/laptop view ?
My mobile view reference style : https://prnt.sc/l9rwHcqcfjuY
Thanks
Hi Feber,
To achieve as such, can you kindly go to you Block Element - Content Template, and then modify the widths of the Container Blocks with the Grid Block on mobile view as such: https://share.getcloudapp.com/eDu5b4Kx
Check how it looks on Tablet view as well and set the appropriate Container Width.
Hope this clarifies! Kindly let us know how it goes. :)
Hi there,
It works in desktop.
If you see my mobile reference style, there is no post excerpt there. Post excerpt only appears in desktop view.
There are 2 ways to approach this.
For one, you may add a CSS code like this in Appearance > Customize > Additional CSS:
@media (max-width: 768px) {
.dynamic-entry-excerpt {
display:none;
}
}
The other approach would be to place the Dynamic Content Block within a Container Block and utilize the hide-on-* classes. Specifically, hide-on-mobile: https://docs.generatepress.com/article/responsive-display/
Either should work.
Hope this helps! :)
It works. I choose the 2nd approach.
Thank you very much.
You’re welcome Feber! Glad to be of assistance! Feel free to reach out anytime you’ll need assistance with anything else. :)