Your question should be specific to WordPress. Generic PHP/JS/SQL/HTML/CSS questions might be better asked at Stack Overflow or another appropriate Stack Exchange network site. Third-party plugins and themes are off-topic for this site; they are better asked about at their developers' support routes.

Closed 3 years ago.

I want to convert this code into a shortcode from the Code Snippets plugin, I have seen an example come up but when I put it it does not work, the example is the following:

add_shortcode( 'shortcode_name', function () {

    $out = '<p>write your HTML shortcode content here</p>';

    return $out;
} );

I want to convert the following code to rotate banners:

<script>
 
    rnd.today=new Date();
    rnd.seed=rnd.today.getTime();

    function rnd() {
        rnd.seed = (rnd.seed*9301+49297) % 233280;
        return rnd.seed/(233280.0);
    }

    function rand(number) {
        var result = Math.floor(rnd() * number);
        if (!result) result = 0;
        return result
    }
    var bannerimgs = new Array("a.jpg", "b.jpg");
    var bannerlnks = new Array("a", "b");
    var banneralt = new Array("a", "b");
    var rotatorHtml = "";
    var endJs = "";

    for(var img in bannerimgs){
        var thisImg = new Image();
        thisImg.src = bannerimgs[img];
    }
    var bannerimgCt = 2;
    var bannercurrentAd = rand(bannerimgCt);
    var openlink = "";
    var bannerbanner = document.getElementById('banner');
    var bannerlink = document.getElementById('banneradLink');
    
        if(bannerlnks[bannercurrentAd] != ""){
        rotatorHtml += '<a href="' + bannerlnks[bannercurrentAd] + '" id="banneradLink"  target="_blank">';
        endJs = "</a>";
    }
    rotatorHtml += '<img src="' + bannerimgs[bannercurrentAd] + '" alt = "' + banneralt[bannercurrentAd] + '" id="bannerbanner">' + endJs;
    document.getElementById("banner_div").innerHTML = rotatorHtml;  
</script>

How can this script be converted to a shortcode? I have replaced what it says but errors appear, then I do something wrong. How can this script be converted to a shortcode? Do you know any other way?

Your question should be specific to WordPress. Generic PHP/JS/SQL/HTML/CSS questions might be better asked at Stack Overflow or another appropriate Stack Exchange network site. Third-party plugins and themes are off-topic for this site; they are better asked about at their developers' support routes.

Closed 3 years ago.

I want to convert this code into a shortcode from the Code Snippets plugin, I have seen an example come up but when I put it it does not work, the example is the following:

add_shortcode( 'shortcode_name', function () {

    $out = '<p>write your HTML shortcode content here</p>';

    return $out;
} );

I want to convert the following code to rotate banners:

<script>
 
    rnd.today=new Date();
    rnd.seed=rnd.today.getTime();

    function rnd() {
        rnd.seed = (rnd.seed*9301+49297) % 233280;
        return rnd.seed/(233280.0);
    }

    function rand(number) {
        var result = Math.floor(rnd() * number);
        if (!result) result = 0;
        return result
    }
    var bannerimgs = new Array("a.jpg", "b.jpg");
    var bannerlnks = new Array("a", "b");
    var banneralt = new Array("a", "b");
    var rotatorHtml = "";
    var endJs = "";

    for(var img in bannerimgs){
        var thisImg = new Image();
        thisImg.src = bannerimgs[img];
    }
    var bannerimgCt = 2;
    var bannercurrentAd = rand(bannerimgCt);
    var openlink = "";
    var bannerbanner = document.getElementById('banner');
    var bannerlink = document.getElementById('banneradLink');
    
        if(bannerlnks[bannercurrentAd] != ""){
        rotatorHtml += '<a href="' + bannerlnks[bannercurrentAd] + '" id="banneradLink"  target="_blank">';
        endJs = "</a>";
    }
    rotatorHtml += '<img src="' + bannerimgs[bannercurrentAd] + '" alt = "' + banneralt[bannercurrentAd] + '" id="bannerbanner">' + endJs;
    document.getElementById("banner_div").innerHTML = rotatorHtml;  
</script>

How can this script be converted to a shortcode? I have replaced what it says but errors appear, then I do something wrong. How can this script be converted to a shortcode? Do you know any other way?

• shortcode
• javascript
• hooks
• html

• "but errors appear" - what errors? – kero Commented Mar 23, 2021 at 10:28

1 Answer 1

Your JavaScript targets a HTML element with the id 'banner_div'. So the first step is to output such an element in the shortcode.

add_shortcode( 'shortcode_name', function () {
    $out = '<div id='banner_div'></div>';
    return $out;
} );

Now you need to save the JavaScript (everything between the <script> tags) as a file. This you can now enqueue which is a whole other question. Here's a question about doing this with a widget.

I would go with:

wp_enqueue_script( 'unique-name', '/path/to/script.js,  array(), false, true);

What is going on here? Let me summarise for you.

• Param 1 is a name for your script.
• Param 2 is the URL for where-ever you put the script file.
• Params 3 and 4 are not used in this example
• Param 5 sets the script output to the footer so it runs after the widget div is on screen.

For more reference on the function wp_enqueue_script see the codex page