HTML code not working at front end

Your page already has the WP copy of jQuery loaded for the page. By also loading a version from jquery.com, you are creating a conflict. Try simply removing the jquery.com reference.

Note that the WP version runs in noConflict mode. Your related script cannot use the usual $ shortcut unless you place it within a noConflict wrapper that re-declares the shortcut.

Converting embedded script to shortcodes is a good practice. Otherwise, if anyone editing a page with code directly embedded should switch to visual view, the editor’s parser will corrupt your code.

I tried using the WP coder which provides a shortcode for it but the shortcode doesn’t work either.

Having said that WHy does it display within the editor PREVIEW then?

• This reply was modified 6 years, 1 month ago by phil1ooo.

Right. Once your script is working correctly, it’s still worth implementing it as a shortcode so the editor cannot corrupt it.

I’ve no idea why preview works but not normal view. Since visitors cannot view previews, it’s not possible for me to inspect previews and compare with normal views. To hazard a guess, it’s possible the WP version of jQuery is failing to load in preview as it does in normal view, so there is no conflict.

Hi
I am not that great at php or working with functions. I tried to create shortcodes but they never work.

Is there anyone who would be able to help me create a shortcode for the above script to work. Happy to provide proper links via other means than public for testing. This URL’s come from a third party site.

Just to give an example as well I have installed the scripts & styles plugin which actually does display the content but below the wp footer of the usual content pages.
https://ozy-web-hosting-services.ozy.net.au/compare-shared-hosting-plans/
If there is something I can add to make this display correctly then that would be create.

Cheers

Here’s code for a simple plugin that adds your script to post content via shortcode. You can add other custom code to this plugin if you like. If you don’t like the naming I chose, you should be able to figure out how to change it. The key is consistency. Change all occurrences of the name equally.

Create a new empty text file named ozy-script.php. Paste the following code into the file and save it. Upload to /wp-content/plugins/ or /wp-content/plugins/ozy-script/.

<?php
/*
Plugin Name: ozy-script
Description: Embed script via [ozy-script] shortcode.
Author: bcworkz
Version: 0.10 beta
*/
function do_ozy-script( $atts ) {
   $script = <<<'EOT'
<link rel="stylesheet" href="https://comparetables.site.com/plain.css?table_bkg=FFFFFF&table_color=000000&plan_names_bkg=EEEEEE&features_hover=F9F9F9&order_bkg=CCCCCC&order_color=000000">
<div id="compareTable"></div>
<script src="https://comparetables.site.com/script.js?store_id=282151&service=hosting&style=plain&order_url=https://site.ozy.net/hosting-order-form/&order_text=Order Now&container_id=compareTable&features_type=0"></script>
EOT;
// the above line must NOT contain any whitespace
   return $script;
}
add_shortcode('ozy-script', 'do_ozy-script');

Correct the “site.com” URLs that you used for obfuscation.

I’ve removed the reference to jquery.com to prevent a conflict with the WP jQuery. If the referenced script.js uses $ shortcuts and does not use a noConflict wrapper, you will need to download the referenced file, add a noConflict wrapper, then host the file on your server. Alter the script’s src reference in the handler function accordingly.

Activate this plugin. To use it, insert [ozy-script] in post content where ever you want the table to appear. I leave the testing for you to do ??

You can add similar code to define other shortcodes, replacing the current output with other desired content. Remember to rename the shortcode and the related function. The key to shortcodes is nothing can be echoed out by the handler function. All shortcode output must be returned by the function.

Hi

Tried to get to work but no go. I have converted everything to iframes as that’s the only way I can get to appear where I need it to be in the pages.

I don’t really like using iframes but it seems I have no choice atm.

Thanks for your help.

I am working on improving on these shorthcode scripts and I can get the basics to work just need more understanding of the atts etc and how to use them correctly.

Cheers

You’re welcome.

All the different possibilities for implementing shortcodes can get confusing. If you’ve not yet encountered it, the shortcode reference in the Plugin Handbook can be very helpful.