css confusion upfront

im confused on how to use divs and css in the theme

i am currently trying to use this https://paulund.co.uk/create-typing-effect

I have used it before but i am use to a universal css and use element css only a little bit. i have tried a straight copy and paste. i changed it to a div tag not a p, i just tried to type text in and then use the suggested div's in the custom css. i am always useing the custom part and not using the inline.

also when i tried to copy paste it made a section of the text pop below and made it white, looks like an error to me. why does it do that one pasting from a different site. does it not paste as plain text.

  • Nithin

    Hi shaun,

    Hope you are doing good today. :slight_smile:

    There isn't any option to add the JS library, or external inline scripts through Upfront. You'll have to make use of the Code element, and add the JS code, and HTML, by clicking Write Custom Code link, as shown in the screenshot:

    You can add the following HTML code in the HTML section:

    <div class="element"></div>

    Add the following JS code, in the JS section:

    /* Your code here */
    jQuery(function(){
          jQuery(".element").typed({
            strings: ["First sentence.", "Second sentence."],
            typeSpeed: 0
          });
      });

    Once done, you'll have to include the typed.js library, by creating a folder in your theme folder, and copying the typed.js file in it. For eg: create a /js folder, inside your theme folder, and download, and paste the typed.js file form this link:
    http://www.mattboldt.com/demos/typed-js/

    You'll have to make use of a /mu-plugins to include the script, ie create a /mu-plugins folder, inside your /wp-conten directory, and create PHP file, eg:upfront-lib.php, and add the following code to it:

    <?php
    add_action( 'wp_enqueue_scripts', 'upfront_add_scripts' );
    function upfront_add_scripts() {
    	wp_enqueue_script( 'upfront-typed-script', get_stylesheet_directory_uri() . '/js/typed.js', array( 'jquery' ) );
    }

    This should include the typed.js, and make the JS work according to your needs. Please do note that, since you'll be creating /js folder in your Fixer themes directory, the files will get overwritten when the Fixer theme is updated.

    To avoid getting overwritten, you'll have to create new themes using Upfront Builder. So, instead of adding the PHP code in the /mu-plugins, you can include in the themes functions.php file.

    Please let us know if there's still any confusion, we'll be glad to provide further assistance. Have a nice weekend. :slight_smile:

    Kind Regards,
    Nithin

  • Nithin

    Hi shaun,

    i copied code from that site and it pasted that junk in there. why is it not pasting in plain text. you can see from the site it was straight html that i pasted.

    I have answered related to this question in your another thread, please check, and let us know if you still need any further assistance regarding this.
    https://premium.wpmudev.org/forums/topic/paste-glitching-upfront#post-1179173

    Kind Regards,
    Nithin

Thank NAME, for their help.

Let NAME know exactly why they deserved these points.

Gift a custom amount of points.