Yong

Create an animated typing effect with <a href="https://github.com/mattboldt/typed.js" rel="nofollow ugc">Typed.js</a> easily.
Just install and activate, Animated Typed JS Shortcode plugin and you can start using <code>[typedjs][/typedjs]</code> shortcode to create your animated typing text.
No settings needed just plug and play.
<h4>How to use the shortcode?</h4>
You can use the shortcode just like this:
<code>[typedjs]My animated typing text[/typedjs]</code>
To show more than 1 string/text, separate the strings with a <code>double colons (::)</code> like this:
<code>[typedjs]My animated typing text::It's freaking awesome![/typedjs]</code>
If you want to customize your animated text behaviour, you can use shortcode attributes to do that like this:
<code>[typedjs loop=true]My animated typing text::It's freaking awesome!::It's now looping, OMG![/typedjs]</code>
Here are the list of all available attributes that you can use:
<ul>
<li><code>typespeed</code> : The text typing speed in milliseconds (default: 50)</li>
<li><code>startdelay</code> : Delay time before typing start in milliseconds (default: 500)</li>
<li><code>backspeed</code> : Backspacing speed in milliseconds (default: 50)</li>
<li><code>backdelay</code> : Time before backspacing in milliseconds (default: 500)</li>
<li><code>smartbackspace</code> : Only backspace what doesn’t match the previous string (default: true)</li>
<li><code>shuffle</code> : Shuffle the strings (default: false)</li>
<li><code>fadeout</code> : Fade out instead of backspace (default: false)</li>
<li><code>fadeoutdelay</code> : Time before fade out in milliseconds (default: 500)</li>
<li><code>loop</code> : Loop strings animation (default: false)</li>
<li><code>loopcount</code> : Amount of loops if enabled (default: Infinity)</li>
<li><code>showcursor</code> : Show/hide cursor (default: true)</li>
<li><code>cursorchar</code> : Character to be used as cursor (default: |)</li>
<li><code>class</code>: Custom class for the shortcode element (default: ”)</li>
</ul>
<h4>Optimize Javascript loading</h4>
The <code>typed.min.js</code> is only 12KB, in the previous version I tried to load the script only when the shortcode is used, but it’s not working properly because the script is loaded asynchronously. So, I decided to load the script in the footer of the page to make sure it’s loaded properly.
However, if you want to load the script only on specific pages, you can use this hook to enqueue the script only on specific pages:
<pre><code>`php
</code></pre>
add_action(‘wp_enqueue_scripts’, ‘my_custom_typedjs_script’); 
function my_custom_typedjs_script() { 
 if ( ! is_page( ‘my-page-slug’ ) ) { 
 wp_dequeue_script( ‘typedjsshortcode’ ); 
 } 
} 
 `
This will dequeue the script on all pages except the page with the slug <code>my-page-slug</code>.
<h4>CREDITS</h4>
Thanks to <a href="https://mattboldt.com/" rel="nofollow ugc">Matt Boldt</a> for creating this cool library <a href="https://github.com/mattboldt/typed.js" rel="nofollow ugc">Typed.js</a>!

Animated Typed JS Shortcode

This plugin add shortcode to create an animated typing effect with Typed JS. No settings needed, just plug and play.

Dnesscarkey

Upload any custom fonts to give your site an elegant look. Easily change fonts without CSS knowledge or select from 23,871+ predefined fonts to add to your site, including Google fonts stored on your server.
Click <a href="https://dineshkarki.com.np/use-any-font/demo" rel="nofollow ugc">HERE</a> for a Use Any Font working demo.
Use Any Font lets you install custom fonts in your WordPress website. Unlike other font embed services, it doesn’t limit your font choices or store your custom fonts on a remote server. Upload any font format (ttf, otf, woff) and our font uploader auto converts it to woff2 for faster load times and compatibility across all browsers. With our easy-to-use font uploader, you can seamlessly add custom fonts and manage your site’s typography. The plugin supports self-hosted and GDPR-compliant solutions, ensuring your fonts are SEO-friendly and quickly embedded with @font-face.
Key Features
<ul>
<li>Easy Font Upload, Supports all browsers : 
Upload font in one format, all required format for browser compatibily is auto converted by our font convertor. Supports ttf, otf, woff, and woff2 font formats.
</li>
<li>Fastest Font Load ( 30% Faster ) : 
Automatically convert uploaded custom fonts to compressed woff2 format with Brotli, achieving 30% faster loading.
</li>
<li>Easy Font Assign : 
Quickly assign uploaded font with inbuilt font assign interface. You can select pre defined html tags or assign it to custom css.
</li>
<li>SEO Friendly & GDPR compliant : 
Fonts embedded with @font-face CSS for quick loading and SEO benefits. Custom Fonts are stored on Your Server for Faster Loading and full GDPR compliant 
</li>
<li>Large Font Upload upto 25 MB : 
Some fonts are larger in size. Our font uploader allows you to upload custom font upto 25 MB. 
</li>
<li>Font Variations : 
Upload custom fonts with their various styles and weights. 
</li>
<li>Editor and Visual Builder Support : 
Use uploaded custom fonts from WordPress Editor, Gutenberg Editor, 
<a href="http://www.elegantthemes.com/affiliates/idevaffiliate.php?id=39880" title="custom font in Divi builder" rel="nofollow ugc">Divi Builder</a>, 
<a href="https://wordpress.org/plugins/siteorigin-panels/" title="Custom font in Site Origin Page Buider" rel="ugc">Site Origin Page Buider</a>, 
<a href="https://wordpress.org/plugins/elementor/" title="Elementor Page Builder" rel="ugc">Elementor Page Builder</a>, 
<a href="https://www.wpbeaverbuilder.com/?fla=2054&campaign=use-any-font" title="custom font in Beaver Builder" rel="nofollow ugc">Beaver Builder</a>, 
<a href="https://themify.me/member/aff/go/dnesscarkey/?cr=aHR0cHM6Ly90aGVtaWZ5Lm1lL2J1aWxkZXI=" title="custom font in Themify Builder" rel="nofollow ugc">Themify Builder</a>, 
<a href="https://wordpress.org/themes/kadence/" title="custom font in Kadence Theme and Kadence Blocks" rel="ugc">Kadence Theme and Blocks</a>, 
<a href="https://oxygenbuilder.com/" title="custom font in Oxygen Builder" rel="nofollow ugc">Oxygen Builder</a>, 
<a href="https://wordpress.org/themes/generatepress/" title="custom font in Generate Press" rel="ugc">Generate Press</a>, 
<a href="https://wordpress.org/themes/astra/" title="custom font in Astra Theme" rel="ugc">Astra Theme</a>, 
<a href="https://wordpress.org/themes/oceanwp/" title="custom font in Revolution Slider" rel="ugc">Ocean WP Theme</a>, 
<a href="https://bricksbuilder.io/" title="custom font in Bricks Builder" rel="nofollow ugc">Bricks Builder</a>, 
<a href="https://themeisle.com/" title="custom font in themeisle neva theme" rel="nofollow ugc">Themeisle</a>, 
<a href="https://bit.ly/3auJKzt" title="custom font in Revolution Slider" rel="nofollow ugc">Revolution Slider</a>, 
<a href="https://wpbakery.com/" title="custom font in WPBakery Page Builder" rel="nofollow ugc">WPBakery Page Builder ( Js Composer )</a>, 
More… and any visual builder using the class. 
</li>
<li>Theme Compatibility : 
Custom fonts uploaded can be directly used from Theme options panel for major themeforest themes like <a href="https://bit.ly/3auJKzt" rel="nofollow ugc">Avada, X Theme, Flatsome, Salient, Porto, Shopkeeper, Oshine, WPLMS Learning Management System Theme, KLEO, WoodMart, ListingPro, SimpleMag, ROSA 1, 907, Voice, Grand Restaurant, LeadEngine, Service Finder, MagPlus, Hostiko, Adifier, Puca, GreenMart, Reco, VidoRev, Halena and many more known themes. (1000+). Check out full list here.</a>
</li>
<li>Language Support : 
Assign fonts based on language with WPML and Polylang plugins.
</li>
<li>Font Display Property : 
CSS property managing font loading behavior in @font-face.
</li>
</ul>
Support
<ul>
<li>Visit our <a href="https://wordpress.org/support/plugin/use-any-font/" rel="ugc">Support Forum</a> for quick issue resolution.</li>
<li>Utilize our Facebook Message widget on our website at <a href="https://dineshkarki.com.np" rel="nofollow ugc">https://dineshkarki.com.np</a>.</li>
<li>Reach out via email using the form found at <a href="https://dineshkarki.com.np/contact" rel="nofollow ugc">https://dineshkarki.com.np/contact</a>.</li>
</ul>
Font Conversion API Usage
<ul>
<li>You need API key to connect to our server for font conversion. Our server converts your font and sends it back. You can get key from <a href="https://dineshkarki.com.np/use-any-font/api-key" rel="nofollow ugc">here</a>. You can also generate Lite / Test API key from button at top of the plugin page. Note : Lite / Test API only allow single font conversion.</li>
<li>Use Any Font uses Font Conversion API developed by Dnesscarkey. Font conversion API helps the plugin to convert the font files in different format (woff, woff2 but not limited to) for faster loading, and multiple browser support. Plugins sends the request to Font conversion server with font files, font conversion server converts it and returns the converted files. Once the conversion is completed, font files are automatically deleted.</li>
<li>We don’t store your fonts in our server neither any of your information except the API key details. Our server deletes the temporary file after the font upload is complete. Your font files are served from your own server.</li>
<li>For font conversion, our plugin uses server2.dnesscarkey.org and server3.dnesscarkey.org and it is only dedicated to Use Any Font plugin.</li>
<li>For Font Conversion API terms and condition. Please visit <a href="https://dineshkarki.com.np/use-any-font/terms-conditions" rel="nofollow ugc">here</a>.</li>
</ul>
Installation Video 
<iframe loading="lazy" class="youtube-player" width="750" height="422" src="https://www.youtube.com/embed/QzGaWIPVwEk?version=3&rel=1&showsearch=0&showinfo=1&iv_load_policy=1&fs=1&hl=en-US&autohide=2&wmode=transparent" allowfullscreen="true" style="border:0;" sandbox="allow-scripts allow-same-origin allow-popups allow-presentation allow-popups-to-escape-sandbox"></iframe>
Integration for Themes / Plugin Developers
You can use uaf_get_font_families(); function to get the list of custom fonts uploaded with Use Any Font. You can add it in your font family select box or list.
if (function_exists(‘uaf_get_font_families’)){ 
 $uaf_font_families = uaf_get_font_families(); // Returns Array 
}
Please do write us after integration and we will add it in our supported list and create a discount code for your users.

Use Any Font | Custom Font Uploader

Upload custom fonts with custom font uploader. Auto converts to woff2 for better performance. Self-hosted, GDPR compliant, and easy custom font plugin

Animated Typed JS Shortcode vs Use Any Font | Custom Font Uploader