Viewing 7 posts - 1 through 7 (of 7 total)
  • Author
    Posts
  • #26134

    I’ve looked through the support forum a dozen times but cannot find anything related to this subject.

    The “problem”:

    We want to use the Progress Bars element in the Layerslider on the homepage.

    An exact replica of a Progress Bar on another page.

    Is that at all possible?

    Thought of a shortcode something with all the info from the progress bar, but can’t seem to find out how you make the progress bar. There’s no code behind the bar, not that I’m aware of.

    Thanks in advance

    Valdimarsson

    #129413

    I’ve another question in the dying minutes :-)

    How do I remove a margin from a column on a single page?

    I know this much:

    In Firebug the page div tag is; .post-entry-9:

    <div class=”post-entry post-entry-type-page post-entry-9″>

    And the column name is; div .av_one_fourth:

    <div class=”flex_column av_one_fourth avia-builder-el-4 el_after_av_one_half “>

    I’ve tried just about everything to change the left-margin to 0% instead of 6%

    The last thing I really thought would work was this css:

    #post-entry-9 div .av_one_fourth {

    margin-left: 0% !important;

    }

    #129414

    Hi Valdimarsson,

    Edit: See Ismael’s post below.

    For the second issue it would help to see the page live so that the css doesn’t cause issues with other elements on the page.

    Regards,

    Devin

    #129415

    Hi Devin,

    Here’s the site: http://ftmedia.dk

    Too bad with the slideshow. Will try to through around with some images and see what’s cooking ;-)

    Thanks.

    #129416

    Hi,

    You can actually copy the actual html code of the progress bar then enclose it on a unique div. Something like this

    <div class="layerslider-progressbar"><div class="avia-progress-bar-container avia_animate_when_almost_visible avia-builder-el-0 avia-builder-el-no-sibling avia_start_animation"><div class="avia-progress-bar theme-color-bar icon-bar-no"><div class="progressbar-title-wrap"><div class="progressbar-icon avia-font-entypo-fontello"><span class="progressbar-char">⚒</span></div><div class="progressbar-title">Skill or Task</div></div><div class="progress avia_start_animation"><div class="bar-outer"><div class="bar" style="width: 100%" data-progress="100"></div></div></div></div></div></div></div>

    Then add this on your custom.css or Quick CSS.

    .layerslider-progressbar {
    width: 600px;
    height: 50px;
    }

    We specify the width of the layerslider-progressbar div because the progress bar needs to inherit the size the parent element.

    Regards,

    Ismael

    #129417

    Oh my god, you’re a lifesaver.

    Saw the post 5 mins ago and I’ve already implemented it. That’s what I call support.

    Thanks mate.

    #129418

    Hey,

    Glad it’s working now. ;)

    Cheers,

    Ismael

Viewing 7 posts - 1 through 7 (of 7 total)
  • The topic ‘Make Content Elements appear in the LayerSlider WP?’ is closed to new replies.