Hi Lely,
Many thanks for your reply.
I understand how to activate the parallax effect on background images - that’s not the support question I’m seeking an answer to.
Please take a look at the blog posts on my staging site. They appear under the section entitled “Journal”, e.g. the example I posted earlier.
You’ll see that the title of the blog appears overlaid on the full width parallax image. This effect was created using Ben Ryan’s customisation method referred to in the previous thread.
What I’m trying to achieve on my pages is the same thing: to have the title of the page overlaid on the featured image for the page with the same CSS styling you see on the blog posts.
Ideally I’d like to use the same custom method used by @BenRyan.me The method uses a child theme with a customised wp-single.php and some custom CSS styling. The advantage of this method is that it allows you to use a featured image, and pull in the title text for the blog post for the overlay.
Ideally I’d like to customise the wp-page.php and add it to my child theme. Is there a way to adapt the code provided by Ben Ryan and use it for pages?
Please see the code Ben uses for his custom wp-single.php. Could the following code be adapted to create a customised wp-page.php?
<?php
// =============================================================================
// VIEWS/INTEGRITY/WP-SINGLE.PHP
// -----------------------------------------------------------------------------
// Single post output for Integrity.
// =============================================================================
$fullwidth = get_post_meta( get_the_ID(), '_x_post_layout', true );
?>
<?php get_header(); ?>
<?php global $post; ?>
<div class="benryan featured-image bg-image parallax" style="background-image:url(<?php
the_post_thumbnail_url(full); ?>) !important;" data-x-element="section" data-x-params="
{"type":"image","parallax":true}";">
<div class="x-container max width">
<div class="caption">
<h1 class="title h2"><?php the_title(); ?></h1>
<?php while ( have_posts() ) : the_post(); ?>
<?php x_integrity_entry_meta(); ?>
<?php endwhile; ?>
</div>
</div>
</div>
<div class="x-container max width offset">
<div class="<?php x_main_content_class(); ?>" role="main">
<?php while ( have_posts() ) : the_post(); ?>
<?php x_get_view( 'integrity', 'content', get_post_format() ); ?>
<?php x_get_view( 'global', '_comments-template' ); ?>
<?php endwhile; ?>
</div>
<?php if ( $fullwidth != 'on' ) : ?>
<?php get_sidebar(); ?>
<?php endif; ?>
</div>
<?php get_footer(); ?>
Thanks again.
