Yong

<p>Create an animated typing effect with <a href="https://github.com/mattboldt/typed.js" rel="nofollow ugc">Typed.js</a> easily.</p>
<p>Just install and activate, <strong>Animated Typed JS Shortcode</strong> plugin and you can start using <code>[typedjs][/typedjs]</code> shortcode to create your animated typing text.</p>
<p>No settings needed just plug and play.</p>
<h4>How to use the shortcode?</h4>
<p>You can use the shortcode just like this:</p>
<p><strong><code>[typedjs]My animated typing text[/typedjs]</code></strong></p>
<p>To show more than 1 string/text, separate the strings with a <code>double colons (::)</code> like this:</p>
<p><strong><code>[typedjs]My animated typing text::It's freaking awesome![/typedjs]</code></strong></p>
<p>If you want to customize your animated text behaviour, you can use shortcode attributes to do that like this:</p>
<p><strong><code>[typedjs loop=true]My animated typing text::It's freaking awesome!::It's now looping, OMG![/typedjs]</code></strong></p>
<p>Here are the list of all available attributes that you can use:</p>
<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>
<p>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.</p>
<p>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:</p>
<pre><code>`php
</code></pre>
<p>add_action(‘wp_enqueue_scripts’, ‘my_custom_typedjs_script’);<br />
function my_custom_typedjs_script() {<br />
    if ( ! is_page( ‘my-page-slug’ ) ) {<br />
        wp_dequeue_script( ‘typedjsshortcode’ );<br />
    }<br />
}<br />
    `</p>
<p>This will dequeue the script on all pages except the page with the slug <code>my-page-slug</code>.</p>
<h4>CREDITS</h4>
<p>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>!</p>


Animated Typed JS Shortcode

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

Brainstorm Force

<p><strong>HOST FONTS, IMPROVE WEBSITE SPEED, AND ELIMINATE PRIVACY CONCERNS</strong></p>
<p>★★★★★</p>
<h3>IMPROVED SPEED AND PERFORMANCE 🚀</h3>
<p>Custom Fonts enables you to upload your own custom fonts or choose from a vast collection of Google Fonts, all hosted directly on your own web server.</p>
<p>By hosting fonts locally, you can significantly improve your website’s performance. As the fonts load directly from your server, it reduces external requests, significantly reducing page load times.</p>
<p><a href="https://bsf.io/custom-fonts-demo" rel="nofollow ugc">Try it out on a free dummy site</a></p>
<h3>UPLOAD YOUR CUSTOM FONTS OR CHOOSE FROM GOOGLE FONTS 🎨</h3>
<p>With Custom Fonts, you have the freedom to customize your website typography to match your unique brand identity!</p>
<p>You can easily upload your own custom font files, such as .ttf or .otf, and use them throughout your website. Or, you can choose from a rich library of Google Fonts and host them locally on your server, ensuring full control over their use.</p>
<h3>UPLOAD MULTIPLE FONT VARIANTS 🆒</h3>
<p>You have the flexibility to upload any number of font variants to suit your design needs. Whether it’s different weights, styles, or character sets, easily manage and customize the necessary font variants. Personalize your typography to perfection and create a unique visual identity for your website.</p>
<h3>ENHANCED PRIVACY AND GDPR COMPLIANCE 🛡️</h3>
<p>Privacy is a top priority, especially in light of data protection regulations like GDPR. By using Custom Fonts, you can self-host your fonts, eliminating any privacy concerns associated with external font services. Take full control over the fonts you use on your website and ensure compliance with privacy regulations.</p>
<h3>FULL SITE EDITING THEME SUPPORT AND EASY INTEGRATION 🎉</h3>
<p>Custom Fonts seamlessly integrates with WordPress full site editing themes, allowing you to effortlessly choose and customize fonts across your entire website. Say goodbye to limitations and enjoy the freedom to create a consistent and visually appealing typography experience for visitors.</p>
<h3>BEAUTIFUL AND USER-FRIENDLY INTERFACE MADE WITH REACT JS 💻</h3>
<p>We take pride in providing an elegant and intuitive user interface for Custom Fonts. Built with React JS, our interface offers a seamless experience, making it easy to upload and manage custom fonts, select from Google Fonts, and customize typography settings to suit your needs.</p>
<h3>COMPLETELY FREE, NO UPSELLS OR HIDDEN COSTS 🆓</h3>
<p>Custom Fonts is completely free, with no upsells or hidden costs. We believe in empowering website owners with essential tools without nickel-and-diming. Enjoy full access to all the features and functionality of Custom Fonts.</p>
<h3>WHO CAN BENEFIT FROM CUSTOM FONTS?</h3>
<ol>
<li>
<p><strong>Web designers and developers:</strong> You can easily enhance the typography and overall design of your projects, making them stand out from the crowd.</p>
</li>
<li>
<p><strong>eCommerce store owners:</strong> Custom fonts can enhance your brand identity and provide a distinctive visual style for product descriptions, banners, and more. Hosting fonts locally with Custom Fonts improves website performance, benefiting you and your consumers.</p>
</li>
<li>
<p><strong>Bloggers and content creators:</strong> Make your content truly pop. Stand out from the crowd and captivate your audience with Custom Fonts.</p>
</li>
<li>
<p><strong>SEO experts:</strong> You can now boost page speed by hosting fonts locally with Custom Fonts. Fewer external requests means faster loading times! Plus, you ensure compliance with privacy regulations.</p>
</li>
</ol>
<p>Custom Fonts caters to anyone who values the customization of typography, performance optimization, privacy control, and compliance with regulations.</p>
<p>If you want to take control of your website’s typography and enhance its overall appearance, Custom Fonts is the plugin for you!</p>
<h3>SOME OF THE SUPPORTED WORDPRESS THEMES:</h3>
<ul>
<li><a href="http://wpastra.com/" rel="nofollow ugc">Astra WordPress Theme</a></li>
<li><a href="https://wordpress.org/themes/spectra-one/" rel="ugc">Spectra One Theme</a></li>
<li>All FSE themes</li>
</ul>
<h3>SOME OF THE SUPPORTED WORDPRESS PLUGINS:</h3>
<ul>
<li>Spectra Page Builder</li>
<li>Elementor Page Builder</li>
</ul>
<p><strong>Branding Guidelines</strong></p>
<p>When mentioning Custom Fonts, please use the following format:</p>
<ul>
<li>Custom Fonts [correct]</li>
<li>CustomFonts [incorrect]</li>
<li>Custom fonts [incorrect]</li>
<li>CustomFont [incorrect]</li>
<li>Customfont [incorrect]</li>
</ul>
<p><strong>Our Other Products:</strong></p>
<ul>
<li><a href="https://wpastra.com/" rel="nofollow ugc">Astra</a> – The most popular WordPress theme that perfectly integrates with Custom Fonts.</li>
<li><a href="https://wpspectra.com/" rel="nofollow ugc">Spectra</a> – A visual website builder built with WordPress’ native block editor.</li>
<li><a href="https://ultimateelementor.com/" rel="nofollow ugc">Ultimate Addons for Elementor</a> – The best addons to extend Elementor’s capabilities.</li>
<li><a href="https://wpschema.com/" rel="nofollow ugc">Schema Pro</a> – All-in-one schema markup plugin that offers complete functionality and easy configuration.</li>
<li><a href="https://projecthuddle.com/" rel="nofollow ugc">ProjectHuddle</a> – Lets you collect sticky note-style feedback on page designs and web projects.</li>
</ul>
<p><strong>Other partnered products:</strong></p>
<ul>
<li><a href="https://cartflows.com/" rel="nofollow ugc">CartFlows</a> – One-click sales funnel builder for WordPress.</li>
<li><a href="https://prestoplayer.com/" rel="nofollow ugc">Presto Player</a> – Best video player plugin for WordPress.</li>
<li><a href="https://surecart.com/" rel="nofollow ugc">SureCart</a> – A powerful eCommerce platform designed to grow your business by effortlessly selling online.</li>
<li><a href="https://suremembers.com/" rel="nofollow ugc">SureMembers</a> – Fastest and easiest way to protect content on your website and build memberships.</li>
<li><a href="https://ottokit.com/" rel="nofollow ugc">OttoKit</a> – Connects your favorite tools so you can automate workflows and streamline your business processes.</li>
<li><a href="https://www.surewriter.com/" rel="nofollow ugc">SureWriter</a> – AI writing tool to make your web design journey faster.</li>
</ul>


Custom Fonts – Host Your Fonts Locally

Looks nice, but does not work with Oxygen Builder

Does not work with Oxygen Builder

Just works

Custom Fonts is a powerful WordPress plugin that allows you to upload your own custom fonts or choose from a vast collection of Google Fonts, all host …

Animated Typed JS Shortcode vs Custom Fonts – Host Your Fonts Locally