Docs

[jl386]

I want a video above the navigation menu and it looks like there are a couple ways I can do it. adding a video above the masthead or as a background in revolution slider. I want to have some text over the video that is animated coming in but then remains on screen. Also can the video have sound? I am not a web guy at all so assume I know nothing. Thanks On a different matter, why does my slider revolution show as not activated see attached screen shot yet installed and activated in add ons

[Christopher]

Hi there,

If you want to display video sound you should add Youtube, Vimeo or HTML5 as main background. Add text as slider layer, see revolution slider documentation here https://www.themepunch.com/revslider-doc/text-html-icons/

Slider revolution come bundled with X and it doesn’t need activation code. You can use it as long as X is active.

Hope that helps.

[jl386]

do you mean as a background in revolution or on page as a background. I have another question as well. I am trying to figure out recent posts element. I have added one to a column and wrote a few test posts but all it shows is the post title and then a box filled with a solid color. How do I get it to show some of the post contents and a photo if one is included in a post.

[Rupok]

Hi there,

Thanks for updating. Let’s check the options for Recent Post element – http://prntscr.com/b29q27

it sounds you disabled the featured image or you didn’t set featured image for posts.

Cheers!

[jl386]

Thanks. The other half of my question above was is it possible especially when there is no image to show some of the content as well to encourage the visitor to read more. I would like to have it show the first paragraph or the first couple sentences and then a link that says “read more” or something similar.

[jl386]

I just noticed that when I select featured image it adds it to the top of the post and makes it massive. The featured image I selected for a test post is already in the post and is an appropriate size. The featured image fills the page and requiring the reader to scroll down to even see the title. I want to select and image that is used in the post already but not have it show up again at the top of the post.

[Lely]

Hi There,

Because adding excerpt to recent post requires a template change, I’d advise that you setup a child theme. This allows you to make code changes that won’t be overwritten when an X update is released. After your child theme is setup, please review how we recommend making template changes in Customization Best Practices.

Then add the following code on your child theme’s functions.php file:

// Recent Posts Customize
// =============================================================================

function x_shortcode_recent_posts_with_excerpt( $atts ) {
  extract( shortcode_atts( array(
    'id'           => '',
    'class'        => '',
    'style'        => '',
    'type'         => 'post',
    'count'        => '',
    'category'     => '',
    'offset'       => '',
    'orientation'  => '',
    'show_excerpt' => 'true',
    'no_sticky'    => '',
    'no_image'     => '',
    'fade'         => ''
  ), $atts, 'x_recent_posts' ) );

  $allowed_post_types = apply_filters( 'cs_recent_posts_post_types', array( 'post' => 'post' ) );
  $type = ( isset( $allowed_post_types[$type] ) ) ? $allowed_post_types[$type] : 'post';

  $id            = ( $id           != ''     ) ? 'id="' . esc_attr( $id ) . '"' : '';
  $class         = ( $class        != ''     ) ? 'x-recent-posts cf ' . esc_attr( $class ) : 'x-recent-posts cf';
  $style         = ( $style        != ''     ) ? 'style="' . $style . '"' : '';
  $count         = ( $count        != ''     ) ? $count : 3;
  $category      = ( $category     != ''     ) ? $category : '';
  $category_type = ( $type         == 'post' ) ? 'category_name' : 'portfolio-category';
  $offset        = ( $offset       != ''     ) ? $offset : 0;
  $orientation   = ( $orientation  != ''     ) ? ' ' . $orientation : ' horizontal';
  $show_excerpt  = ( $show_excerpt == 'true' );
  $no_sticky     = ( $no_sticky    == 'true' );
  $no_image      = ( $no_image     == 'true' ) ? $no_image : '';
  $fade          = ( $fade         == 'true' ) ? $fade : 'false';

  $js_params = array(
    'fade' => ( $fade == 'true' )
  );

  $data = cs_generate_data_attributes( 'recent_posts', $js_params );

  $output = "<div {$id} class=\"{$class}{$orientation}\" {$style} {$data} data-fade=\"{$fade}\" >";

    $q = new WP_Query( array(
      'orderby'             => 'date',
      'post_type'           => "{$type}",
      'posts_per_page'      => "{$count}",
      'offset'              => "{$offset}",
      "{$category_type}"    => "{$category}",
      'ignore_sticky_posts' => $no_sticky
    ) );

    if ( $q->have_posts() ) : while ( $q->have_posts() ) : $q->the_post();

      if ( $no_image == 'true' ) {
        $image_output       = '';
        $image_output_class = 'no-image';
      } else {
        $image              = wp_get_attachment_image_src( get_post_thumbnail_id(), 'entry-cropped' );
        $bg_image           = ( $image[0] != '' ) ? ' style="background-image: url(' . $image[0] . ');"' : '';
        $image_output       = '<div class="x-recent-posts-img"' . $bg_image . '></div>';
        $image_output_class = 'with-image';
      }

       $excerpt = ( $show_excerpt ) ? '<div class="x-recent-posts-excerpt"><p>' . preg_replace('/<a.*?more-link.*?<\/a>/', '', cs_get_raw_excerpt() ) . '<span>...[Read more]</span></p></div>' : '';

      $output .= '<a class="x-recent-post' . $count . ' ' . $image_output_class . '" href="' . get_permalink( get_the_ID() ) . '" title="' . esc_attr( sprintf( __( 'Permalink to: "%s"', 'cornerstone' ), the_title_attribute( 'echo=0' ) ) ) . '">'
                 . '<article id="post-' . get_the_ID() . '" class="' . implode( ' ', get_post_class() ) . '">'
                   . '<div class="entry-wrap">'
                     . $image_output
                     . '<div class="x-recent-posts-content">'
                       . '<h3 class="h-recent-posts">' . get_the_title() . '</h3>'
                       . '<span class="x-recent-posts-date">' . get_the_date() . '</span>'
                        . $excerpt
                     . '</div>'
                   . '</div>'
                 . '</article>'
               . '</a>';

    endwhile; endif; wp_reset_postdata();

  $output .= '</div>';

  return $output;
}

add_action('wp_head', 'update_x_recent_posts_to_v2');
function update_x_recent_posts_to_v2(){
  remove_shortcode( 'x_recent_posts' );
  add_shortcode( 'x_recent_posts', 'x_shortcode_recent_posts_with_excerpt' );
}

By default, it will show an excerpt. You can use the following if you want excerpt to be hidden:
[x_recent_posts show_excerpt="false"]
Please set no_image to true if you don’t want to display the featured image. It will display on top of the recent post by default.

Hope this helps.

[jl386]

Ok I will hold off on the code until I learn how to set up a child theme. That code is related to the recent posts element. What about not showing the featured photo in the actual post? See the attachment showing a test post. I had to scroll down a bit for you to see what I am talking about. You can see here I used a photo in a post just below the post title. I then chose that same photo to be the featured photo and it added it as a very large photo above the title. I want to not have the featured photo show up on a post above everything and over sized.

[Lely]

Hi There,

We can hide the featured image on the single post page using custom CSS. Please add the following on Appearance > Customize > Custom > CSS:

.single-post .entry-featured {
    display: none;
}

Hope this helps.

[jl386]

I have finally had time to get to this and I cant get the video to play sound. it does not matter whether I put it as a background video on the page above the masthead or as a background to the slider. What am I missing/

[Rue Nel]

Hello There,

Thanks for the updates! Regretfully background videos will not play a sound because there is no way you can interact with the video. This is how video background works. If ever you want to control the video like adjust the volume, play or pause the video, you should use a video layer in your slider instead.

Please see this documentation: https://www.themepunch.com/revslider-doc/video-layers/?tab=html5video

Hope this helps.

[jl386]

when I add a video to a slide layer I get a pause button in the middle of the video. I do not want to see this how do I hide that. I also would however like to have a button in the bottom of the video so the visitor can mute the video.

[Rue Nel]

Hello There,

When you add the video as a layer, you can always disable the controls. Please click on the video and edit it and go to Settings.

Hope this helps.

[jl386]

you missed part of my question. while I do not want the site visitor to have ability to pause the video I do want there to be a mute button at the bottom of the video

Also your response does not apply. I already have that turned on. the controls are hidden but the pause button remains. actually the pause button will disappear as long as the curser is not on the video but since the video is full screen above the masthead the curser is on the video unless the visitor scrolls down a bit and then moves the curser off the video. I just do not want to see it at all assuming I can give the visitor a mute button

[Rue Nel]

Hello There,

Could please give us the url where you can see the pause button? Maybe we can remove it by using a custom css.

Kindly let us know.

[Author]

Posts