Navigation
This is archived content. Visit our new forum.

Tagged: 

  • Author
    Posts
  • #1095673
    sonofzell
    Participant

    I am desperately seeking solution to this issue, which has stopped me in my tracks for over a week now.

    I NEED to find a way to add content to my custom posts (blog pages and event pages) that appear ABOVE the actual post content. I could adapt any content into sliders if need be, but there is one mandatory need: The content needs to be page-specific. If I could simply add a slider “above masthead” as can be done on pages, it would be perfect. I understand that X does not support such a function out-of-box, and I have tried many user-submitted solutions with no success (I am able to add a single, static slider above masthead on ALL posts, but not individually without adding theme code every time I create a new post). Having a slider (or alternate customized content) above post content is not, in my case, a one-off need, but rather a requirement in order for me to keep the existing design of the site.

    I’ve approached solving this issue from many angles, but given my lack of coding expertise, there are two strategies left that I am hoping you can help me with:

    1. Adding content (ideally, a rev slider above masthead) on custom post types INDIVIDUALLY, or
    2. Tweaking rev slider CSS in order to position a slider at the top of the page, but scroll up with page contents

    As for option 1, I’ve exhausted every solution I could find (within my abilities) and have had no success whatsoever. 🙁

    With Option 2, I have gotten close (I’m already using a slider as my primary site navigation as can be seen at http://www.warminsterpioneers.org/wordpress/articles/cheer/u10-comp-cheer-national-champions/ ), but I’ve only been able to achieve it with fixed positioning. Doing so, of course, simply layers my slider on top of the page content, which is not visible as it scrolls behind the fixed slider. I’ve even used rev slider functions to fade the sliders to transparent on mouse scroll, but I couldn’t prevent the slider from re-appearing on reverse-scroll. <sigh>

    I understand a “perfect solution” would require custom development, but as a non-profit on a time crunch, I simply NEED to find a workaround ASAP (did I mention I’m desperate?).

    My absolute last-resort would be to eliminate the use of custom post types and use standard pages for blog posts and events. Obviously doing so would remove all functionality of indexed posts and event plugins, and essentially negate the purpose of my entire project (which is migrating an existing HTML5 site to wordpress).

    PLEASE PLEASE PLEASE… If there’s something… ANYTHING… that I’m missing here, I would be beyond grateful for your suggestions!

    Thanks in advance!

    #1095687
    Rahul
    Moderator

    Hi there,
    Would you mind providing us with login credentials so we can take a closer look? To do this, you can make a post with the following info:
    – Link to your site
    – WordPress Admin username / password
    Don’t forget to select Set as private reply. This ensures your information is only visible to our staff.
    Thanks.

    #1095762
    sonofzell
    Participant
    This reply has been marked as private.
    #1096239
    Rue Nel
    Moderator

    Hello There,

    Thanks for providing the login credentials!

    1] To add a content above the masthead in your custom post type, please insert this following code in your child theme’s functions.php file.

    function custom_content_above_masthead(){ ?>
      
      <?php if ( is_singular( 'the-custom-post-type-name' )   )  : ?>
    
        <?php echo do_shortcode( '[rev_slider alias="your-slider"]' ); ?>
      
      <?php endif; ?>
      
    <?php }
    add_action('x_before_view_global__slider-above', 'custom_content_above_masthead');

    Please make sure to supply the correct custom post type name and the correct slider shortcode.

    2] You do not need to tweak the css once the slider is positioned above the masthead.

    Hope this helps.

    #1096931
    sonofzell
    Participant

    Thank you for your reply!

    I have used the above code previously. It achieves the exact design I need, however as mentioned, I need the inserted content to be page-specific. My primary application will be for event detail pages, and for each event I will have a specific slider.

    I imagine similar code could be used with arguments for post-id instead of post-type, however I would be concerned that, with dozens of instances, the site’s performance would suffer as a result (that’s merely my assumption – I’m open to your thoughts on that).

    I wonder, is there CSS that I could apply, either via class to the element in cornerstone or within the slider itself, that would place it above the masthead? Alternately, PHP similar to what you provided above in which I could reference a specific post AND a specific slider for that post?

    Thanks again for your time!

    -Kirk

    #1097088
    Christian
    Moderator

    In that case, you will need to use ACF Pro which comes bundled with X. See https://community.theme.co/kb/integrated-plugins-acf-pro/ for details and usage instructions.

    Thanks.

    #1097285
    sonofzell
    Participant

    So much joy…

    I had never considered using ACF to insert content! Using a custom field, I can easily place content above the main post, which was 90% of my challenge. The only problem is that I could not find a way to have ACF output an existing revolution slider as it’s content.

    Fortunately, I stumbled upon “acf-sliders” (https://github.com/WPPress/acf-sliders), which provides this functionality. Sadly, the plugin appears to be out-of-development, but it’s working splendidly at the moment. Technically, the custom field placement is not “above masthead”, but adding

    .x-main {
      margin-top: -35px;
    }

    to the page’s CSS puts it right where I need it.

    Thanks again for your help!!!

    #1097366
    Rupok
    Member

    You are welcome!

    Feel free to let us know if you face any other issue. We’ll be happy to assist you.

    Cheers!

  • <script> jQuery(function($){ $("#no-reply-1095673 .bbp-template-notice, .bbp-no-topic .bbp-template-notice").removeClass('bbp-template-notice'); }); </script>