Purpose theme – image size- CSS

  • Unknown's avatar
    fjosephmayer · Member ·

    In the Purpose theme our Professionals page will click through to individual pages when either “Read more…” or the image is clicked; when the individual page comes up the image on those individual pages is oversized; can we use CSS to manipulate those image sizes?

    The blog I need help with is: (visible only to logged in users)

  • Unknown's avatar
    thesacredpath · Member ·

    Hi, due to the relatively square photo that is created for the featured image in Purpose, if we made it smaller on the individual pages, it would end up not going full width and wouldn’t look good.

    Let’s try something and see how you like it. First off, edit George’s page and keep the featured image, but also insert that image into the body of that page, either left or right aligned as desired and then add the following CSS, which hides the featured image on the individual pages. 

    .postid-97 .feature-img {
    display: none;
}
.post-97 .row .content {
    margin-top: 40px;
}

    If the above works, let me know and we can add the additional code to take care of the others in the same way.

  • Unknown's avatar
    fjosephmayer · Member ·

    SacredPath: works great for the George page; thought I could do the others myself but – if the postid is the key – not sure where to find that for the others

  • Unknown's avatar
    thesacredpath · Member ·

    No worries, here are the numbers for the additional pages on your Professionals page.

    Melissa: 103
    Paul: 99
    Kevin: 106
    Kelly: 124
    Elizabeth: 128

    I used the web inspector built into my browser to find the id numbers. If you are not familiar with the web inspector in your browser, take a look at our support page on How to Find Your Theme’s CSS where you will find some brief screencasts to get you started with it. I find it an invaluable tool when working with CSS.

  • The topic ‘Purpose theme – image size- CSS’ is closed to new replies.