Home Forums Weaver Xtreme Theme Trouble changing Font Color of Excerpt on Parallax Post

Topic Resolution: Answered
Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • #64827
    Answered
    arctexas
    Participant

    I have created a page that used parallax posts, so far so good. I am working with using the excerpt to display a mini title on the image.  When I enter a title in the excerpt box, things work, the text shows up as white, etc…that’s the issue, I need to change the font color because some of my images have light or white backgrounds.

    I input the following into the Plus Per Post tab .parallax-content {
    padding-top: 1.0em;
    font-size: 130%;
    color: rgba(193,66,66,0.8);
    text-shadow: 3px 3px 8px rgba(150, 150, 150, 0.5);
    }
    .parallax-content h2 {
    font-size: 180%;
    }

    When I preview the post, it shows as Red, (which I want) however, when I run it on the page it remains white.  https://arctx.org/new-front I’ve tried it on two different machines and browsers and it stays the same.  I’m missing something but don’t know what.

    Any help is appreciated.

    Thank you

    #64828
    Best Answer
    scrambler
    Moderator

    This reply has been accepted as the best answer.

    This is because of how the parallax post is built and how the per post style rules are applied and may be a bug.

    When you place a rule in the per post style box, it adds the rule differently in the single post page and a blog page.

    in the single post page, it adds the postid CLASS selector before it. Your rule .parallax-content {…} becomes .postid-xxx .parallax-content {…}
    In the single post page, the postid class is at the top of the page on the body tag, so the rule works.

    But in a blog page it adds the post ID selector before it and the rule becomes #post-xxx .parallax-content {…}

    The problem is that in a parallax post with excerpt to be used in parallax content, the post ID (#post-xxx) is on the post article tag, and unfortunately, the parallax content is before the post article tag, and has a different ID (#post-xxx-p) so the rule does not apply

    You can get around the following way.

    If the rules apply to all parallax post content, place the rule in the theme Global Custom CSS rule box

    If the rule needs to apply only to a specific post, you can add it the way shown below, once for the single post page, one for the blog page. You will need to replace xxx by the post ID#. The + prevents the theme from adding the selector, and we add the proper one manually

    .parallax-content {…}
    + #post-xxx-p .parallax-content {…}

     

    @weaver, may be the post id selector added for the blog page to a CSS rule placed in the per post style box should use 

    [class^=’#post-xxx’]

    So it would target both #post-xxx and #post-xxx-p

     

    #64829
    arctexas
    Participant

    Thank you, this is probably a silly question, but I don’t work a whole with CSS (it’s been years since I tried to…) but anyway, the line .parallax-content {…} is there anything that should go between the brackets?  I mean, do I bracket my entire existing lines with those brackets.

    Thank you

    #64830
    arctexas
    Participant

    Never mind, I got it to work….thank you very much for your help, I appreciate it.

Viewing 4 posts - 1 through 4 (of 4 total)
  • You must be logged in to reply to this topic.