Supress PLAY button on thumbnail - wave theme

Themes
1

I use the wave theme and it seems to automatically add a PLAY button to the thumbnail of certain posts (but not all of them…odd behavior, I’m sure its intentional but I can’t figure it out).

image
image1002×305 38.4 KB

The problem is, that play button doesn’t PLAY anything, it’s graphic only. So I get continual emails from users who say “the playback button doesn’t work”. How do I get rid of that? I’m sure it’s super simple but I can’t sort it out.

2

I’m going to guess you set the facebook description on the ones with the quirky behavior. Wave is meant for podcasts, and it takes over the facebook description to accomplish that.

Try leaving it blank - does the behavior go away?

1 Like
3

yes, you’re correct (as you usually are). I THOUGHT I had removed that bit of code from the theme but not I don’t remember how/where I did it.

4

I went back and re-read our previous conversation about how wave uses the facebook description to populate URLs for audio etc. But in looking at post.hbs, I’ve removed all that. So I’m not sure where that PLAY icon is coming from.

5

Take a look in loop.hbs?

6

Ok, making progress but hit a bit of a head-scratcher. Here’s the DEFAULT loop.hbs:

<article class="{{post_class}}"{{#if og_description}} data-url="{{og_description}}"{{/if}} data-id="{{comment_id}}">
    <div class="post-media">
        {{#if og_description}}
            <div class="post-play js-play">
                {{> "icons/play"}}
                {{> "icons/pause"}}
            </div>
        {{/if}}
        <div class="u-placeholder square">
            <a href="{{url}}">
                {{#if feature_image}}
                    <img class="post-image lazyload u-object-fit" src="{{img_url feature_image size="m"}}" alt="{{#if feature_image_alt}}{{feature_image_alt}}{{else}}{{title}}{{/if}}">
                {{else}}
                    <span class="letter">{{title}}</span>
                {{/if}}
            </a>
        </div>
    </div>
    <div class="post-wrapper">
        <header class="post-header">
            {{> "post-meta"}}
            <h2 class="post-title">
                <a class="post-title-link" href="{{url}}">{{title}}</a>
            </h2>
        </header>
        {{#if excerpt}}
            <div class="post-excerpt">
                {{excerpt words="25"}}
            </div>
        {{/if}}
    </div>
</article>

Looks like the obvious thing to remove would be the:

            <div class="post-play js-play">
                {{> "icons/play"}}
                {{> "icons/pause"}}
            </div>

And if I remove that and reupload the theme, it MOSTLY works but leaves the GREEN circle that the play button used to appear on. I can’t figure out where that green circle comes from. Is it obvious in this file and I’m just missing it?

image

7

You’ll want to chop that - it’s getting added when the facebook description is set, and some js or css is then triggering on it.

1 Like
8

thank you I’ll give it a try.

9

that did it (had to snip a bit more but you got me where I was heading). Thanks, as always, you’re a life-saver.