- This topic has 14 replies, 2 voices, and was last updated 2 years, 11 months ago by David.
-
AuthorPosts
-
December 9, 2017 at 7:59 am #445644Thomas Connertz
Tom,
I’m using GPP since a long time and I’m really happy with the theme. Now I’m planning a redesign of my blog and ran into a question I can’t solve.I’m thinking of a kind of book-like layout for posts with a really large image on the left half of the screen and text including the post title on the right. Basically, I want the featured image to show besides the post title and content.
Here’s a little ascii art to illustrate what I mean:
.----------. Post Title . . Text . . Text . featured . Text . image . Text . . Text .__________. Text Text Text
Is there a way to acchive that with GPP?
Many thanks!
ThomasDecember 9, 2017 at 8:46 am #445679LeoStaffCustomer SupportHi there,
Setting it to below title and align left should work: https://docs.generatepress.com/article/adjusting-the-featured-images/
Make sure the images are small enough so it can float to the left.
December 9, 2017 at 12:29 pm #445804Thomas ConnertzLeo,
Thanks, we’re almost there.
Setting the featured image *above* title and aligned left looks like this:.__________. Post Title . featured . Text . image . Text .__________. Text Text Text
How can I get the text in one column?
ThomasDecember 9, 2017 at 4:23 pm #445918LeoStaffCustomer SupportBut wouldn’t that leave a long empty space underneath the featured image is the excerpt is long?
December 10, 2017 at 5:36 am #446132Thomas ConnertzI want this layout for posts. It’s for a food blog – usually my text (recipes) would take about as much space as the image. If text needs more vertical space than the image, that would be a few lines only.
December 10, 2017 at 6:13 am #446144Thomas ConnertzI made a dummy post to show how I want it to look like:
https://nischenseite.henrietteskitchen.com/testrezept/December 10, 2017 at 10:09 am #446295LeoStaffCustomer SupportOk so you are wanting that layout for single posts?
Then your dummy posts is actually what you have to do.
December 10, 2017 at 1:19 pm #446420Thomas ConnertzHmm. For the dummy I disabled post title and featured image. Instead I used columns, placed an inline image in the left column and some HTML in the right column. If I knew how to create this look with the featured image and post title I would not have asked.
December 10, 2017 at 3:57 pm #446468LeoStaffCustomer SupportI’m confused.
What’s the difference between what you’ve created and what you wanted?
December 11, 2017 at 12:36 am #446635Thomas ConnertzThanks for your patience.
Here is what I did to create the dummy. I used Tom’s Lightweight Columns Plugin to create two colums and placed image and text in the columns.[shortcode to start columns] [caption id="attachment_18032" align="alignnone" width="771"]<img src="https://nischenseite.henrietteskitchen.com/wp-content/uploads/Frankfurter-Gruene-Sauce.jpg" alt="Frankfurter Grüne Sauce" width="771" height="900" class="size-full wp-image-18032" /> I want this to be the featured image. Don't need the caption. [/caption] [shortcode to close first column] [shortcode to open second column] <h1>I want the post title to go here</h1> This is the recipe text. Sometimes it takes more space than the image. Then I don't want the text to float around the image but remain aligned. Empty space below the image is totally acceptable. Some more paragraphs. [shortcode to end columns]
Then I used GPP to disable post title and featured image.
Obviously this is very inconvenient. If there was a way to display the featured image besides post title and content I would just have to write a post without any workarounds.
December 11, 2017 at 2:46 pm #447275TomLead DeveloperLead DeveloperIf you set up your featured image to be below the title and aligned left, you can then add this CSS to make it so the text stays in one column:
.single .featured-image + .entry-content { overflow: hidden; }
December 12, 2017 at 11:35 am #448024Thomas ConnertzThanks a lot, Tom.
After some playing around with your solution here is what I finally did: Set the featured image above title and aligned left. Then I added this CSS:.single .entry-content { overflow: hidden; }
Now the image stays in the left column, all text including the post title in the right.
December 12, 2017 at 5:12 pm #448206TomLead DeveloperLead DeveloperAwesome 🙂
April 4, 2021 at 5:57 am #1720828KantaI am using GP Premium. Now I want to redesign blog post this type.
.———-. Post Title
. . Text
. featured . Text
. image . Text
. . Text
.———-. ButtonI add some css (.post-image: width:300px; height:auto; overflow: hidden;) in https://tvoptions.in/. But don’t show properly. Please give me a perfect solution with ccs.
Thanks
April 4, 2021 at 8:43 am #1721223DavidStaffCustomer SupportHi there,
can you raise a new topic where we can take a look at the problem, as this topic is resolved and over 3 years old.
-
AuthorPosts
- You must be logged in to reply to this topic.