[Theme: virtue]

  • Resolved scorpion3367

    (@scorpion3367)


    8 years, 8 months ago

    Working on a locally hosted WordPress website using the free virtue theme and MAMP.
    I’m trying to determine how I can customize generated blog posts (i.e. user clicks on a summarized post to read the entire entry which opens in a newly generated page).
    I’m wanting to customize the background color, title color, title font and date font of individual posts both on the summary page and the individual post pages themselves.

    After what seems like exhaustive research and testing, I finally managed to figure out how to customize the content background on the Posts Page by inserting the following CSS in the Theme Options>Advanced Settings>Custom CSS Box:
    body.page-id-475 .postcontent {
    background: #008e3d;
    background-color: rgba(0,142,61,0.8);
    (*Note: would also like to figure out how to add a border radius to this as well if possible).

    I was quite elated to have figured this out on my own but then upon clicking on one of the several ‘test’ posts I created, I realized that I had just opened another can of worms…

    The new page that is generated to display the single post reverts back to what I can only assume is the Theme’s default display settings which in my case is a transparent background in the main content area and an image as the body background.
    Needless to say, the majority of the text in the post (white font color) gets lost over the top of the background photo.

    I should point out that I have successfully incorporated a child theme as a backup in the event this customization requires the modification of page templates.
    While I’m a quick study, I’m still a relative newbie to WordPress and this theme in particular as it appears to have some underlying complexity in its overall structure. As a result, I am struggling to determine which template/s (if any) require the necessary modifications to reflect the visual changes I would like to implement.
    Hopefully this all makes sense and any assistance in the way of suggestions or recommendations would be greatly appreciated.
    Unfortunately, due to the site is currently being hosted locally, I am unable to provide links to specific pages/posts.

Viewing 2 replies - 1 through 2 (of 2 total)
  • Thread Starter scorpion3367

    (@scorpion3367)

    OK! So after 4 more hours of searching and experimentation, it seems I have stumbled on a resolution that addresses the bulk of what I’m trying to do.
    With the insertion of the following CSS:

    .post.category-(name of category inserted here)
    {
    background: #008e3d;
    }

    I was able to change the background color of the post on both the Post Summary Page as well as the generated Single Post Page (when a visitor clicks on the Title of the post).
    Thankfully this didn’t require any advanced template changes or php functions and was addressed with a simple CSS insertion.

    Still trying to figure out how to manipulate the Post’s Title Font, Font Color and Border Radius to have rounded edges on each corner of the content container so if anyone is able to advise as to how to best achieve this (also hopefully using a simple CSS fix), I would be ever so appreciative.
    Thanks in advance for your time and consideration in this regard.

    Thread Starter scorpion3367

    (@scorpion3367)

    Thanks anyway but after another hour of searching and testing, I was finally able to resolve this situation using CSS and Theme Options .

    1) Post Title Font and Font Color was resolved by making the necessary modifications in the Theme Options Typography H2 Headings section.

    2) Post Date was resolved using CSS in the Theme Options Advanced Settings Custom CSS Box by inserting:

    .postdate {font-family: Insert Name of Font Family Here;
    }

    3) Border Radius on both Post Summary and Single Post Pages was resolved using CSS in the Theme Options Advanced Settings Custom CSS Box by inserting:

    .post.category-Insert Name of Category Here{
    border-radius:15px;
    -moz-border-radius:15px;
    -khtml-border-radius:15px;
    -webkit-border-radius:15px;
    }

    Thanks to anyone who may have taken the time to try and assist with this but I guess we’ll consider this self-resolved and posted for future reference for anyone else who may encounter the same issues and now has the resources.

Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘[Theme: virtue]’ is closed to new replies.