Tagged: ,

Viewing 25 posts - 1 through 25 (of 25 total)
  • Author
    Posts
  • February 8, 2018 at 2:35 pm #909780
    DigitalBerg

    Hi Team,

    Can we put tick instead of percentage?

    Please see link attached (private content)

    Regards
    Q

    February 8, 2018 at 10:06 pm #909981
    Basilis

    Hey DigitalBerg,

    Can you send us your web site and lets see if we can replace it with a content:””?
    We are not sure if it cna be done, but we can give it a test

    Best regards,
    Basilis

    February 9, 2018 at 2:20 pm #910265
    DigitalBerg

    Sure thanks Basilis.

    please see the link and other details.

    February 10, 2018 at 5:57 pm #910586
    Nikko

    Hi Q,

    Before doing this changes, I would suggest using a child theme first: https://kriesi.at/documentation/enfold/using-a-child-theme/
    After using a child theme and following the instructions in the link, go to (via ftp) enfold > config-templatebuilder > avia-shortcodes, then copy progressbar.php and paste it in the shortcodes folder of the child theme, next edit progressbar.php that you just pasted and modify line 348:

    $output .="<div class='progressbar-percent' data-timer='2200'><span class='av-bar-counter __av-single-number' data-number='".$bar['attr']['progress']."'>0</span>%</div>";

    replace % with an image of a tick. And that should be it. Hope it helps.

    Best regards,
    Nikko

    February 20, 2018 at 11:50 am #914795
    DigitalBerg

    Thanks Nikko,

    Can not find short-codes folder in the child theme. Any advice on this?
    Also how to remove 1 to 100 number from the progress bar?

    Thanks,
    Regards
    Q

    February 20, 2018 at 1:17 pm #914821
    Nikko

    Hi Q,

    I see, can you try to add a folder and name it shortcodes in your child theme, you can follow the instructions here: https://kriesi.at/documentation/enfold/add-new-or-replace-advanced-layout-builder-elements-from-child-theme/
    As for removing the 1-100 in progressbar you can add this css code in Quick CSS (located in Enfold > General Styling):

    span.av-bar-counter.__av-single-number {
    display: none !important;
}

    Hope this helps :)

    Best regards,
    Nikko

    February 20, 2018 at 5:32 pm #914909
    DigitalBerg

    Hi Nikko,

    Thanks again.

    trying to add the tick image in the code however image code does not work, Can you please have a look into the code and inform me the error?

    $output .=”<div class=’progressbar-percent’ data-timer=’2200′><span class=’av-bar-counter __av-single-number’ data-number='”.$bar[‘attr’][‘progress’].”‘>0</span>%</div>”;

    Removing % and adding this code:

    • This reply was modified 6 years, 9 months ago by DigitalBerg. Reason: Wrong code
    February 20, 2018 at 5:55 pm #914929
    Nikko

    Hi,

    Sorry can you try to replace this code:

    $output .="<div class='progressbar-percent' data-timer='2200'><span class='av-bar-counter __av-single-number' data-number='".$bar['attr']['progress']."'>0</span>%</div>";

    to:

    $output .="<div class='progressbar-percent' data-timer='2200'><img src="image_url" class="progressbar-image" /></div>";

    just replace image_url with the url of your tick image.

    Best regards,
    Nikko

    February 21, 2018 at 1:50 pm #915434
    DigitalBerg

    Thanks.

    After changing the code site is not loading :(.

    Please advice.

    Regards

    February 21, 2018 at 3:16 pm #915492
    Victoria

    Hi DigitalBerg,

    You can remove the code via FTP. Did you get the website back up?

    Best regards,
    Victoria

    February 21, 2018 at 3:57 pm #915532
    DigitalBerg

    Yes after removing the code site is back up but how to solve the code to work?

    Regards
    Q

    February 21, 2018 at 5:07 pm #915558
    Nikko

    Hi,

    Can you try to remove this css code that I gave:

    span.av-bar-counter.__av-single-number {
    display: none !important;
}

    then use this php code:
    $output .=”

    “;
    Let us know if this helps.

    Best regards,
    Nikko

    February 22, 2018 at 11:31 am #915972
    DigitalBerg

    Hi Nikko,

    Still the same issue after removing the code.

    However, the code you sent, its not showing.

    Regards
    Q

    • This reply was modified 6 years, 9 months ago by DigitalBerg.
    February 24, 2018 at 4:08 am #916951
    Ismael

    Hi,

    This is the modification.

    $output = "<div class="progressbar-percent" data-timer="2200"><span class="av-bar-counter __av-single-number" data-number="'.$bar[" attr']['progress'].'"><img src="image_url" class="progressbar-image"></span></div>";

    Just adjust the “image_url” value.

    Best regards,
    Ismael

    February 27, 2018 at 11:31 am #918369
    DigitalBerg

    HI Ismael,

    Still the same issue, after adding the code with tick URL website stop responding (white blank page).

    Please check and let me know. Highly appreciate on this matter.

    Regards
    Q

    • This reply was modified 6 years, 9 months ago by DigitalBerg.
    March 1, 2018 at 9:37 am #919492
    Ismael

    Hi,

    I’m sorry but I can’t connect via SFTP. Please check the login credentials above. The actual site is not loading either.

    Best regards,
    Ismael

    March 1, 2018 at 11:13 am #919538
    DigitalBerg

    Hi Ismael,

    Can you please connect with port 21 or leave blank the port option?

    Please let me know.

    Regards
    Q

    March 1, 2018 at 11:58 am #919571
    Ismael

    Hi,

    I already tried that but it’s not working. I tried 21 and 22.

    Best regards,
    Ismael

    March 6, 2018 at 1:34 pm #922263
    DigitalBerg

    Hi Ismael,

    Not sure however please check the screenshot below (private content box).

    Please let me know.

    Regards
    Q

    March 7, 2018 at 7:01 am #922759
    Ismael

    Hi,

    Thank you for the info. I have the same exact configuration but it’s not working. Is there any security option in your server? Maybe, some of the countries or ips are blocked. You can find our locations in the following page.

    // https://kriesi.at/about

    I’ll ask the rest of the support team to check the thread.

    Best regards,
    Ismael

    March 7, 2018 at 7:18 am #922767
    Vinay

    Hi,

    We have added the below code to the Quick CSS section.

    Please change the URL of the logo to a tick image.

    .progressbar-percent {
	color:transparent;
	background: url('http://stageholdings.co.uk/wp-content/uploads/2017/08/SC-logo-497x454_hight-1-257x300.png');
	background-size: 30px 40px, cover;
	background-position: top right;
       background-repeat: no-repeat;
       width:60px;
}
.progressbar-percent span {
	color: #000!important;
}

    As an optional choice, you can also use any Icon that comes with enfold by adding the below CSS. To use the icon I have commented the background rule in Quick CSS.

    .progressbar-percent span:after {
        content:"\e812";
        color:#000;
	font-family: 'entypo-fontello';	
	position: absolute;
	right: 5px;
}

    Let us know if you have any questions :)

    Best regards,
    Vinay

    • This reply was modified 6 years, 8 months ago by Vinay.
    March 7, 2018 at 5:51 pm #923159
    DigitalBerg

    Excellent work guys! thanks alot

    Now, im using the code to remove 1-100 numbers but below code removing numbers including tick icon too. is there any way or code to remove numbers only not a tick icon?

    Code:
    span.av-bar-counter.__av-single-number {
    display: none !important;
    }

    March 7, 2018 at 7:41 pm #923249
    Vinay

    Hi,

    Please try adding this code to the Quick CSS section under Enfold > General Styling or to your child theme’s style.css file:

    .progressbar-percent span {
        color:transparent;
}
.progressbar-percent span:after {
        color:#000!important;
}

    Best regards,
    Vinay

    March 8, 2018 at 11:27 am #923762
    DigitalBerg

    Hi Vinay,

    I have added the code but still numbers are showing! please check and let me know .

    Thanks alot.

    Regards
    Q

    March 9, 2018 at 9:44 am #924354
    Vinay

    Hi,

    I didn’t see the code in Quick CSS I have updated the previous code which was provided for the background image to add an icon.
    Please feel free to play with the color value in the below code to show hide the numbers :)

    .progressbar-percent {
	color:transparent;	
}
.progressbar-percent span {
	color: transparent!important;
}
.progressbar-percent span:after {
        content:"\e812";
        color:#000!important;
	font-family: 'entypo-fontello';	
	position: absolute;
	right: 5px;
}

    Best regards,
    Vinay

  • Author
    Posts
Viewing 25 posts - 1 through 25 (of 25 total)
  • You must be logged in to reply to this topic.