progress – XTRA Tutorials https://xtratheme.com/docs Documentation of XTRA WordPress Theme Sun, 23 Feb 2025 10:12:40 +0000 en-US hourly 1 https://wordpress.org/?v=6.8.2 How to Set Up a Preloader for Your Website? https://xtratheme.com/docs/how-to/how-to-set-up-a-preloader-for-your-website/ https://xtratheme.com/docs/how-to/how-to-set-up-a-preloader-for-your-website/#respond Tue, 18 Jun 2024 12:00:35 +0000 https://xtratheme.com/docs/?p=3027

Loading …

Step 1
How?

Set the loading

  1. Go to Theme Options (Theme Customize)
  2. Click on General
  3. Click on Loading panel
  4. Turn On the Loading option
Loading

You can upload custom image for loading (Gif, jpg or SVG)

You can customize the loading via these Stylkits, text color and overlay colors

Option

Loading Types

  • Image – GIF format recommended but you can also upload JPG, PNG or even SVG file
  • Percentage – Showing percentage of loaded content
  • Custom Code – You can set loading type to custom input and insert you own custom SVG animation loader codes
]]> https://xtratheme.com/docs/how-to/how-to-set-up-a-preloader-for-your-website/feed/ 0 Element: Progress Bar https://xtratheme.com/docs/page-builder/element-progress-bar/ https://xtratheme.com/docs/page-builder/element-progress-bar/#respond Mon, 17 Jun 2024 09:47:53 +0000 https://xtratheme.com/docs/?p=1583

Video Tutorial

Description and Screenshot

Step 1

Show skills progress bar from 0% to specific percentage up to 100%, Fully customizable and unlimited colors.

Progress_bar
  • Title – Title or text above progress bar
  • Number – Progress bar percentage e.g. 90%
  • Icon – Set icon before title of progress bar
  • Style – Select predefined style
  • Animated stripes? – CSS animation stripes on progressed bar
  • Styling – Styling of title, icon, number, bar, etc. such as background, color, size, etc.
  • Advanced tab – Responsive, Animation, Parallax, etc.
]]> https://xtratheme.com/docs/page-builder/element-progress-bar/feed/ 0