[Support request] Can I recreate the look of this blog title+image in Generate Press Premium?

Home Forums Support Can I recreate the look of this blog title+image in Generate Press Premium?

This topic contains 10 replies, has 2 voices, and was last updated by  Tom 1 year, 1 month ago.

Viewing 11 posts - 1 through 11 (of 11 total)
  • Author
  • #416798


    When I went looking for a new blog template, my techy friend recommended generate press. I am not able to take the old template with me when I move from WordPress to siteground. I like the look of the long short featured images with the words and background superimposed on top of them. You can see what I mean in this blog post: http://graceunderpressure.blog/2017/11/05/adhd-comorbidities

    I would like to keep the blog looking similar if possible. So far, I have figured out how to make the featured images long and skinny: 300px tall x 1200px wide like on the original template. However, getting the white square and text with the title/categories on top of the image has proven challenging.

    You will also note that the blog post at the link has a space on the left side under the image that says the author of the post and the date. I cannot find a function to do this either.

    Any help you can offer would be appreciated. I am a novice, so I am in over my head.

    GeneratePress 1.4
    GP Premium 1.4.3

    Tom Lead Developer

    Hi there,

    It looks like you got the corner of the white content area on top of the image?

    As for the post meta, that’s definitely a bit more difficult. Can you add those items so they at least appear under the title for now, then let me know?




    Hi Tom, thanks for your reply! I appreciate it.

    Since I am editing the unpublished template it is hard for me to give you a link to see what I have done. So, I took a snapshot here: https://drive.google.com/file/d/1–iyTM_XiM0JqDjQKIeGfZWV_0QtH4_o/view?usp=sharing

    I removed the dates from the posts in the new template, but I put the author’s name is under the title as you suggested.

    As far as the header image, yes, you are right that part of the white area is on top of the image.

    If you say that some of this is difficult, then it makes sense that I was not figuring out how to do it easily.

    Let me know what do next. 🙂



    I don’t know if it matters but I edited settings to resize the images after measuring the old template’s images. Here is the updated image of the changes:



    Tom Lead Developer

    Ah, I thought the site you added in your website field was the site you were working on.

    Is there any way you can put something up on a live server so I can see your set up using your images etc.. That would be the easiest way for me to come up with a solution unique to you.



    I am not sure. Right now I am able to view it because I followed siteground’s instructions to edit my window host file. I am completely new to this. I am actually publishing it to the blog on sitegrounds servers, but I don’t know how to let you see it. (I went and looked at my emails from siteground.) Maybe this? At this link: https://hosts.cx/ Type in The IP is and the website is graceunderpressure.blog This is how the tech at siteground told me the blog can be viewed, but I do not know if it will work. Let me know if you cannot view it. Thank you for your patience with me as I truly am a beginner. I am grateful for your quick replies and helpful answers.



    Hi Tom, it took a while, but the blog is finally live. You can see it at http://www.graceunderpressure.blog

    I’m still interested in trying to recreate this look if possible.



    Tom Lead Developer

    Any chance you can make sure your featured images aren’t set to float left on the single posts? They should be set to center. That should help me come up with some code. I won’t be able to make it exact, but should be able to get you somewhat close.



    Yes. That should be doable.



    Done. 🙂


    Tom Lead Developer

    I lost the original example of what you’re looking for, but perhaps this is close?:

    .featured-image + .entry-header {
        background: #fff;
        position: relative;
        top: -100px;
        max-width: 80%;
        margin-left: 20px;
        padding-left: 20px;
Viewing 11 posts - 1 through 11 (of 11 total)

You must be logged in to reply to this topic.