Okay
  Public Ticket #151055
post format and mobile header image
Closed

Comments

  • Christopher started the conversation
    Hi, I love working with Salient! It's amazing! I am just having two problems that I'm not sure how to fix. 1. I see in your includes that you include formats for status, aside, and image. But in the Salient functions.php they are missing from the add_theme_support ('post_formats') call. I am using a child theme that so far only has a couple of custom CSS rules in it. I tried adding a functions.php file to my child theme containing an add_theme_support call with a complete array of post formats. But this hasn't changed the list of options in my post editor. Any tips on how to add theme support for the 3 formats (aside, status, and image) that are missing in your existing functions.php? 2. I have added a custom header image to the about me page on my site. But at the smallest responsive break point, the face in my picture is always cut off so it's not visible. I've used a DOM inspector to check the code and I found that to handle the different presentation across screen sizes, the image is positioned "top center" and thus I could fix this by using a pic that has the face perfectly centered. But, I'd like to use the current picture. Using the dom inspector, I changed the position to "-475px 0px" in order to shift the picture to the left and show the face. This worked perfectly. Except that this also shifted the picture over when the page is on other responsive sizes, leaving an empty white box on the right side. I know how to use custom CSS to target only this one specific page by using the body page ID class. That way I can only impact this one specific graphic. But I can't figure out how to change the position ONLY for the smallest break point using custom CSS. So, essentially, the question boils down to wondering if you can help me come up with the custom CSS snippet, or JavaScript, or whatever is needed in order to target the custom page header image of a specific page and adjust the horizontal position for only one screen size zone, while leaving the horizontal position in tact (top center) on other screen sizes and other pages. Hopefully it's possible, even if not using the custom CSS box. If not, then I'll work it out another way. Thanks so much for your help, and for all your hard work on Salient! Things I'd like to see in future versions? "related posts" option, infinite scroll option for masonry pages, continued expansion of short codes and features. I love what you're doing, and can't wait to see what comes in the future! Best. Theme. Evar!
  •  1,069
    ThemeNectar replied

    Hey Christopher!

    1. I have a couple post formats in there that are not finished being developed yet so I haven't declared theme support for them. If you did add them in as options, you would most likely need to polish up the code in the files in order to successfully run them. If the list isn't changing with your addition to the child theme, I suspect something else is at play since there should be no issue defining your own list for them through a child theme.

    2. Of course! Just enter the rule you've created inside of this:

    @media only screen and (max-width : 690px) {
    
        /* css rule here */
    
    }

    and place that in the Custom CSS box located in your Salient Options panel.

    Cheers :)

  • Christopher replied

    Thanks so much for the quick response! Given that those styles aren't finished cooking yet, and the addition of my own add_theme_support call in my child theme didn't light them up anyway, I'll go ahead and leave them off until you finish working your magic! :) The new CSS for my page header worked fabulously in the custom CSS box, though not in my child theme style.css. Regardless, it's working! Thanks! :D