Modify Blog Module layout in Child theme

Question

I need to adjust how the featured image is displayed in their blog module.

I need to change the display of the Featured Image from an IMG tag to a Background Image. So I can modify the frame (DIV) of the image without distorting the image itself.

I was able to do this for the default blog page (index.php) of my child theme. See any category page on my site.

I need to do the same to the Elegant Themes Blog Module.

I narrowed down to the function where this edit needs to go. But I’m unsure how to add it into my child theme’s functions.php file.

This is basically the code (cut out the unnecessary parts):

add_shortcode( 'et_pb_blog', 'et_pb_blog' );
function et_pb_blog( $atts ) {

    ob_start();

    query_posts( $args );

    if ( have_posts() ) {
        while ( have_posts() ) {
            the_post();

            $post_format = get_post_format();

            $thumb = '';

            $width = 'on' === $fullwidth ? 1080 : 400;
            $width = (int) apply_filters( 'et_pb_blog_image_width', $width );

            $height = 'on' === $fullwidth ? 675 : 250;
            $height = (int) apply_filters( 'et_pb_blog_image_height', $height );
            $classtext = 'on' === $fullwidth ? 'et_pb_post_main_image' : '';
            $titletext = get_the_title();
            $thumbnail = get_thumbnail( $width, $height, $classtext, $titletext, $titletext, false, 'Blogimage' );
            $thumb = $thumbnail["thumb"]; 

            $no_thumb_class = '' === $thumb || 'off' === $show_thumbnail ? ' et_pb_no_thumb' : '';

            if ( in_array( $post_format, array( 'video', 'gallery' ) ) ) {
                $no_thumb_class = '';
            } ?>

        <article id="post-<?php the_ID(); ?>" <?php post_class( 'et_pb_post' . $no_thumb_class ); ?>>

        <?php if ( 'off' === $fullwidth || ! in_array( $post_format, array( 'link', 'audio', 'quote', 'gallery' ) ) ) { ?>
            <?php if ( ! in_array( $post_format, array( 'link', 'audio' ) ) ) { ?>
                <h2><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h2>
            <?php } ?>

            <?php
                et_divi_post_format_content();

                if ( ! in_array( $post_format, array( 'link', 'audio', 'quote' ) ) ) {
                    if ( 'video' === $post_format && false !== ( $first_video = et_get_first_video() ) ) :
                        printf(
                            '<div class="et_main_video_container">
                                %1$s
                            </div>',
                            $first_video
                        );
                    elseif ( 'gallery' === $post_format ) :
                        et_gallery_images();
                    elseif ( '' !== $thumb && 'on' === $show_thumbnail ) :
                        if ( 'on' !== $fullwidth ) echo '<div class="et_pb_image_container">'; ?>
                            <a href="<?php the_permalink(); ?>">
                                <?php print_thumbnail( $thumb, $thumbnail["use_timthumb"], $titletext, $width, $height ); ?>
                            </a>
                    <?php
                        if ( 'on' !== $fullwidth ) echo '</div> <!-- .et_pb_image_container -->';
                    endif;
                }

}

Just beneath the line that contains $thumb = $thumbnail["thumb"]; I want to add this line of code:

$feat_image = wp_get_attachment_url( get_post_thumbnail_id(/* $post->ID */) );

Next I need to change

<?php print_thumbnail( $thumb, $thumbnail["use_timthumb"], $titletext, $width, $height ); ?> to

<div class="post-top-feat_img" title="blog-post-image" style="background: url(<?php echo $feat_image; ?>) no-repeat; background-size: cover;"></div>

Again I’m not sure how to appropriately add this to my child theme’s functions file. When I follow what Elegant Themes’ support staff says, I get this error.

Fatal error: Cannot redeclare et_pb_blog() (previously declared in /childTheme/functions.php:310) in /parentTheme/functions.php on line 4026

I’ve tried removing the shortcode a few different ways and re-adding it again with the new code in my child theme, but that either spits out the same error or just ignores it. Not sure where to go from here. I can make this work in the parent theme, but I’d rather not do that.

Any help is appreciated.

0
, , Jeff Sydor 6 years 2016-03-17T09:49:10-05:00 0 Answers 81 views 0

Leave an answer

Browse
Browse