Article header images

1 Comments

  • Ifra Saqlain
    Community Moderator
    Most Engaged Community Member - 2022
    Most Engaged Community Member of The Year - 2021

    Hi @nick,

    I worked around your query:

    i). Go to the article_page.hbs file and remove the conditions from images.

    <div class="welcome__bg {{#if settings.welcome_mask_enable}}welcome__bg--with-mask{{/if}}">

    <img class="default_image welcome__bg-image is-hidden--ui-light" src="{{asset 'suitcasesatairport.jpg'}}" alt="{{article.title}}" data-plugin-load-image>

    <img class="image_one welcome__bg-image is-hidden--ui-dark" src="{{asset 'suitcasesatairport.jpg'}}" alt="{{article.title}}" data-plugin-load-image>
    <img class="image_one welcome__bg-image is-hidden--ui-light" src="{{asset 'suitcasesatairport.jpg'}}" alt="{{article.title}}" data-plugin-load-image>


    <img class="image_two welcome__bg-image is-hidden--ui-dark" src="{{asset 'cabin.jpg'}}" alt="{{article.title}}" data-plugin-load-image>
    <img class="image_two welcome__bg-image is-hidden--ui-light" src="{{asset 'cabin.jpg'}}" alt="{{article.title}}" data-plugin-load-image>

    </div>

     

    ii). Add the code to your script.js file at the bottom area.

    if(window.location.href.indexOf("6701953412509") > -1) {
    $(".default_image").css('display','none');
    $(".image_one").css('display','block')
    }else{
    $(".image_one").css('display','none')
    }

    if(window.location.href.indexOf("6699434047005") > -1) {
     $(".default_image").css('display','none');
    $(".image_two").css('display','block')
    }else{
    $(".image_two").css('display','none')
    }

     

    Try the above code and it will definitely work :) and if any error accurs, let me know.

    Thanks

     

    0

Please sign in to leave a comment.

Powered by Zendesk